|
|
@@ -0,0 +1,314 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <div class="swq">
|
|
|
+ <img
|
|
|
+ style="width: 182px; height: 168px"
|
|
|
+ src="@/assets/images/dr.png"
|
|
|
+ alt=""
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <div style="padding-left: 100px">
|
|
|
+ <p>第一步：下载word导入模板</p>
|
|
|
+ <p style="padding-left: 50px">
|
|
|
+ <i class="el-icon-upload"></i
|
|
|
+ ><span class="dowmStys" @click="getDowm">下载模板</span>
|
|
|
+ </p>
|
|
|
+ <p>第二步：选择必填项</p>
|
|
|
+ <div>
|
|
|
+ <!-- 教育类型 -->
|
|
|
+ <el-select
|
|
|
+ v-model="formData.eduId"
|
|
|
+ placeholder="请选择教育类型（必填）"
|
|
|
+ size="mini"
|
|
|
+ @change="changeEducationType"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="(items, indexs) in educationType"
|
|
|
+ :key="indexs"
|
|
|
+ :label="items.educationName"
|
|
|
+ :value="items.id"
|
|
|
+ ></el-option>
|
|
|
+ </el-select>
|
|
|
+ <!-- 业务层次 -->
|
|
|
+ <el-select
|
|
|
+ v-if="formData.eduId"
|
|
|
+ v-model="formData.businessId"
|
|
|
+ placeholder="请选择业务层次（必填）"
|
|
|
+ size="mini"
|
|
|
+ @change="changeBusinessLevel"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="(items, indexs) in newBusinessLevel"
|
|
|
+ :key="indexs"
|
|
|
+ :label="items.projectName + '-' + items.businessName"
|
|
|
+ :value="items.id"
|
|
|
+ ></el-option>
|
|
|
+ </el-select>
|
|
|
+ <!-- 科目 -->
|
|
|
+ <el-select
|
|
|
+ v-if="formData.businessId"
|
|
|
+ v-model="formData.subjectId"
|
|
|
+ placeholder="请选择科目（必填）"
|
|
|
+ size="mini"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="(items, indexs) in newSujectType"
|
|
|
+ :key="indexs"
|
|
|
+ :label="items.subjectName"
|
|
|
+ :value="items.id"
|
|
|
+ ></el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ <p>
|
|
|
+ 第三步：(批量新增)：点击“上传Word”完成导入<span
|
|
|
+ v-if="!(formData.eduId && formData.businessId && formData.subjectId)"
|
|
|
+ style="color: red; margin-left: 14px"
|
|
|
+ >请完成第二步选择必填项</span
|
|
|
+ >
|
|
|
+ </p>
|
|
|
+ <label
|
|
|
+ v-if="formData.eduId && formData.businessId && formData.subjectId"
|
|
|
+ for="mobles"
|
|
|
+ class="el-button el-button--primary el-button--mini"
|
|
|
+ >上传Word</label
|
|
|
+ ><input
|
|
|
+ style="display: none"
|
|
|
+ type="file"
|
|
|
+ id="mobles"
|
|
|
+ ref="input1"
|
|
|
+ @change="importMobleadd"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <el-dialog
|
|
|
+ append-to-body
|
|
|
+ :visible.sync="dialogERROR"
|
|
|
+ width="660px"
|
|
|
+ :show-close="false"
|
|
|
+ :close-on-click-modal="false"
|
|
|
+ >
|
|
|
+ <div slot="title" class="hearders">
|
|
|
+ <div class="leftTitle">提示</div>
|
|
|
+ <div class="rightBoxs">
|
|
|
+ <img
|
|
|
+ src="@/assets/images/Close@2x.png"
|
|
|
+ alt=""
|
|
|
+ @click="dialogERROR = false"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <h4 style="margin-top: 0px; font-weight: bold; text-align: center">
|
|
|
+ 导入失败原因
|
|
|
+ </h4>
|
|
|
+ <el-input
|
|
|
+ readonly
|
|
|
+ type="textarea"
|
|
|
+ :autosize="{ minRows: 6, maxRows: 24 }"
|
|
|
+ v-model="errorData"
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
+ </div>
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="dialogERROR = false">确定</el-button>
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import { mapGetters } from "vuex";
|
|
|
+import * as baseUrls from "@/utils/request.js";
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ newBusinessLevel: [],
|
|
|
+ newSujectType: [],
|
|
|
+ errorData: "",
|
|
|
+ formData: {
|
|
|
+ eduId: "",
|
|
|
+ businessId: "",
|
|
|
+ subjectId: "",
|
|
|
+ projectId: "",
|
|
|
+ },
|
|
|
+ dialogERROR: false,
|
|
|
+ };
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapGetters(["educationType"]),
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ "formData.eduId"() {
|
|
|
+ this.formData.businessId = "";
|
|
|
+ this.formData.projectId = "";
|
|
|
+ },
|
|
|
+ "formData.businessId"(v) {
|
|
|
+ if (v) {
|
|
|
+ for (let i = 0; i < this.newBusinessLevel.length; i++) {
|
|
|
+ if (this.newBusinessLevel[i].id === v) {
|
|
|
+ this.formData.projectId = this.newBusinessLevel[i].projectId;
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ console.log(1);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.formData.subjectId = "";
|
|
|
+ },
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ changeEducationType(v) {
|
|
|
+ this.$api
|
|
|
+ .inquirebusinessList({ status: 1, educationId: v })
|
|
|
+ .then((res) => {
|
|
|
+ this.newBusinessLevel = res.rows;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ changeBusinessLevel(v) {
|
|
|
+ this.$api
|
|
|
+ .inquireCourseSubject({ status: 1, businessId: v })
|
|
|
+ .then((res) => {
|
|
|
+ this.newSujectType = res.rows;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getDowm() {
|
|
|
+ let url =
|
|
|
+ baseUrls.BASE_IMG_URL + "/oss/images/file/20220317/1647486041811.docx";
|
|
|
+ let link = document.createElement("a");
|
|
|
+ let fileName = "导入模板" + ".docx";
|
|
|
+ document.body.appendChild(link);
|
|
|
+ link.href = url;
|
|
|
+ link.dowmload = fileName;
|
|
|
+ link.click();
|
|
|
+ link.remove();
|
|
|
+ },
|
|
|
+ importMobleadd(e) {
|
|
|
+ var self = this;
|
|
|
+ var file = e.target.files[0];
|
|
|
+ let formData = new FormData();
|
|
|
+ formData.append("file", file);
|
|
|
+ formData.append("eduId", this.formData.eduId);
|
|
|
+ formData.append("projectId", this.formData.projectId);
|
|
|
+ formData.append("businessId", this.formData.businessId);
|
|
|
+ formData.append("subjectId", this.formData.subjectId);
|
|
|
+ this.$api
|
|
|
+ .bankquestionimportWordData(formData)
|
|
|
+ .then((res) => {
|
|
|
+ if (res.code === 200) {
|
|
|
+ if (!res.msg) {
|
|
|
+ self.$message.success("导入成功");
|
|
|
+ this.$parent.$parent.dialogDRword = false;
|
|
|
+ } else {
|
|
|
+ self.errorData = res.msg;
|
|
|
+ self.dialogERROR = true;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .finally(() => {
|
|
|
+ e.target.value = "";
|
|
|
+ self.$emit("search", 2);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="less" scoped>
|
|
|
+
|
|
|
+/deep/.el-button {
|
|
|
+ border-radius: 8px;
|
|
|
+}
|
|
|
+/deep/.el-dialog {
|
|
|
+ border-radius: 8px;
|
|
|
+ .el-dialog__header {
|
|
|
+ padding: 0;
|
|
|
+ .hearders {
|
|
|
+ height: 40px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ padding: 0px 18px 0px 20px;
|
|
|
+ border-bottom: 1px solid #e2e2e2;
|
|
|
+ .leftTitle {
|
|
|
+ font-size: 14px;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #2f4378;
|
|
|
+ }
|
|
|
+ .rightBoxs {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ img {
|
|
|
+ width: 14px;
|
|
|
+ height: 14px;
|
|
|
+ margin-left: 13px;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .el-dialog__footer {
|
|
|
+ padding: 0;
|
|
|
+ .dialog-footer {
|
|
|
+ padding: 0px 40px;
|
|
|
+ height: 70px;
|
|
|
+ border-top: 1px solid #e2e2e2;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: flex-end;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.swq {
|
|
|
+ text-align: center;
|
|
|
+ border-bottom: 1px solid #eee;
|
|
|
+}
|
|
|
+.dowmStys {
|
|
|
+ color: blue;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+.imgBox {
|
|
|
+ width: 100%;
|
|
|
+ // height: 210px;
|
|
|
+ border: 1px solid #e2e2e2;
|
|
|
+ border-radius: 8px;
|
|
|
+ padding: 8px 8px 3px;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ .imgLabel {
|
|
|
+ flex: 1;
|
|
|
+ width: 100%;
|
|
|
+ border: 1px dotted #e2e2e2;
|
|
|
+ color: #999;
|
|
|
+ font-size: 14px;
|
|
|
+ cursor: pointer;
|
|
|
+ border-radius: 8px;
|
|
|
+ .msPhoto {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ max-width: 100%;
|
|
|
+ max-height: 270px;
|
|
|
+ img {
|
|
|
+ max-width: 100%;
|
|
|
+ max-height: 270px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .imgbbx {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ i {
|
|
|
+ font-weight: bold;
|
|
|
+ margin: 14px 0;
|
|
|
+ font-size: 24px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ p {
|
|
|
+ margin: 5px 0px;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
