|
@@ -5,7 +5,7 @@
|
|
|
<el-select
|
|
|
:style="marSty"
|
|
|
:size="size"
|
|
|
- filterable
|
|
|
+ filterable
|
|
|
v-model="formData.applyId"
|
|
|
placeholder="请选择考试计划(必填)"
|
|
|
>
|
|
@@ -20,7 +20,7 @@
|
|
|
<el-select
|
|
|
:style="marSty"
|
|
|
:size="size"
|
|
|
- filterable
|
|
|
+ filterable
|
|
|
v-model="formData.applySiteAddress"
|
|
|
placeholder="请选择考试地点(必填)"
|
|
|
>
|
|
@@ -33,13 +33,20 @@
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
|
|
|
+ <el-button
|
|
|
+ :size="size"
|
|
|
+ type="warning"
|
|
|
+ @click="downModel(1)"
|
|
|
+ style="margin-right: 10px"
|
|
|
+ >下载模板(不含考培)</el-button
|
|
|
+ >
|
|
|
<el-select
|
|
|
:style="marSty"
|
|
|
:size="size"
|
|
|
clearable
|
|
|
- filterable
|
|
|
+ filterable
|
|
|
v-model="formData.applySiteAddressTrain"
|
|
|
- placeholder="请选择考培地点(选填)"
|
|
|
+ placeholder="请选择考培地点(必填)"
|
|
|
>
|
|
|
<el-option
|
|
|
v-for="item in applySiteAddress"
|
|
@@ -49,30 +56,68 @@
|
|
|
>
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
- <el-button :size="size" type="warning" @click="downModel"
|
|
|
- >下载模板</el-button
|
|
|
+ <el-button :size="size" type="warning" @click="downModel(2)"
|
|
|
+ >下载模板(含考培)</el-button
|
|
|
>
|
|
|
</div>
|
|
|
<div style="margin-bottom: 12px">
|
|
|
<span style="font-size: 14px">第二步:</span>
|
|
|
- <el-button type="success" :size="size">批量导入</el-button>
|
|
|
+ <label
|
|
|
+ for="mobles"
|
|
|
+ class="el-button el-button--success el-button--mini"
|
|
|
+ style="margin-right: 10px"
|
|
|
+ >批量导入(不含考培)</label
|
|
|
+ ><input
|
|
|
+ style="display: none"
|
|
|
+ type="file"
|
|
|
+ id="mobles"
|
|
|
+ ref="input1"
|
|
|
+ @change="importMobleadd"
|
|
|
+ />
|
|
|
+ <label
|
|
|
+ for="mobles2"
|
|
|
+ class="el-button el-button--success el-button--mini"
|
|
|
+ style="margin-right: 10px"
|
|
|
+ >批量导入(含考培)</label
|
|
|
+ ><input
|
|
|
+ style="display: none"
|
|
|
+ type="file"
|
|
|
+ id="mobles2"
|
|
|
+ ref="input2"
|
|
|
+ @change="importMobleaddtrain"
|
|
|
+ />
|
|
|
</div>
|
|
|
<div>
|
|
|
- <el-button
|
|
|
- :size="size"
|
|
|
- :type="active === 1 ? 'primary' : ''"
|
|
|
- @click="active = 1"
|
|
|
- >成功导入</el-button
|
|
|
+ <el-badge
|
|
|
+ :hidden="!tableDataSuccess.length"
|
|
|
+ :value="tableDataSuccess.length"
|
|
|
+ class="item"
|
|
|
>
|
|
|
- <el-button
|
|
|
- :size="size"
|
|
|
- :type="active === 2 ? 'primary' : ''"
|
|
|
- @click="active = 2"
|
|
|
- >失败导入</el-button
|
|
|
+ <el-button
|
|
|
+ :size="size"
|
|
|
+ :type="active === 1 ? 'primary' : ''"
|
|
|
+ @click="active = 1"
|
|
|
+ >成功导入</el-button
|
|
|
+ >
|
|
|
+ </el-badge>
|
|
|
+ <el-badge
|
|
|
+ :hidden="!tableDataError.length"
|
|
|
+ :value="tableDataError.length"
|
|
|
+ class="item"
|
|
|
>
|
|
|
+ <el-button
|
|
|
+ :size="size"
|
|
|
+ :type="active === 2 ? 'primary' : ''"
|
|
|
+ @click="active = 2"
|
|
|
+ >失败导入</el-button
|
|
|
+ >
|
|
|
+ </el-badge>
|
|
|
</div>
|
|
|
<div v-show="active === 1" class="exportBox">
|
|
|
- <h4 class="h4Sty">成功导入xxx人</h4>
|
|
|
+ <h4 class="h4Sty">
|
|
|
+ 成功导入<strong style="color: red">{{ tableDataSuccess.length }}</strong
|
|
|
+ >人
|
|
|
+ </h4>
|
|
|
<el-table
|
|
|
max-height="600"
|
|
|
:data="tableDataSuccess"
|
|
@@ -85,21 +130,36 @@
|
|
|
}"
|
|
|
>
|
|
|
<el-table-column
|
|
|
- v-for="(item, index) in tableSet"
|
|
|
+ v-for="(item, index) in computedForm(tableSet, 1)"
|
|
|
:key="index"
|
|
|
:prop="item.prop"
|
|
|
:label="item.label"
|
|
|
+ :width="item.width"
|
|
|
align="center"
|
|
|
>
|
|
|
<template slot-scope="scope">
|
|
|
- <span v-if="item.scope === 'test'"></span>
|
|
|
+ <div v-if="item.scope === 'time'">
|
|
|
+ <div>{{ scope.row[item.prop1] }}</div>
|
|
|
+ <div>{{ scope.row[item.prop2] }} {{ scope.row[item.prop3] }}</div>
|
|
|
+ </div>
|
|
|
<span v-else>{{ scope.row[item.prop] }}</span>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
</div>
|
|
|
<div v-show="active === 2" class="exportBox">
|
|
|
- <h4 class="h4Sty">失败导入xxx人</h4>
|
|
|
+ <h4 class="h4Sty">
|
|
|
+ 失败导入<strong style="color: red">{{ tableDataError.length }}</strong
|
|
|
+ >人
|
|
|
+ <el-button
|
|
|
+ v-if="tableDataError.length"
|
|
|
+ style="margin-left: 10px"
|
|
|
+ :size="size"
|
|
|
+ type="success"
|
|
|
+ @click="dowmErrorData"
|
|
|
+ >下载失败数据</el-button
|
|
|
+ >
|
|
|
+ </h4>
|
|
|
<el-table
|
|
|
max-height="600"
|
|
|
:data="tableDataError"
|
|
@@ -112,14 +172,21 @@
|
|
|
}"
|
|
|
>
|
|
|
<el-table-column
|
|
|
- v-for="(item, index) in tableSet"
|
|
|
+ v-for="(item, index) in computedForm(tableSet, 2)"
|
|
|
:key="index"
|
|
|
:prop="item.prop"
|
|
|
:label="item.label"
|
|
|
+ :width="item.width"
|
|
|
align="center"
|
|
|
>
|
|
|
<template slot-scope="scope">
|
|
|
- <span v-if="item.scope === 'test'"></span>
|
|
|
+ <div v-if="item.scope === 'time'">
|
|
|
+ <div>{{ scope.row[item.prop1] }}</div>
|
|
|
+ <div>
|
|
|
+ {{ changeDatas(scope.row[item.prop2]) }}
|
|
|
+ {{ scope.row[item.prop3] }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
<span v-else>{{ scope.row[item.prop] }}</span>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
@@ -134,6 +201,7 @@ import { mapGetters } from "vuex";
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
+ typeInt: 1,
|
|
|
active: 1,
|
|
|
marSty: { marginRight: "10px" },
|
|
|
size: "mini",
|
|
@@ -142,52 +210,121 @@ export default {
|
|
|
applySiteAddress: "",
|
|
|
applySiteAddressTrain: "",
|
|
|
},
|
|
|
- tableDataSuccess: [
|
|
|
- { realname: "唐", idCord: "445224199901043333" },
|
|
|
- { realname: "lian", idCord: "445224199901043313" },
|
|
|
- { realname: "唐", idCord: "445224199901043333" },
|
|
|
- { realname: "lian", idCord: "445224199901043313" },
|
|
|
- { realname: "唐", idCord: "445224199901043333" },
|
|
|
- { realname: "lian", idCord: "445224199901043313" },
|
|
|
- { realname: "唐", idCord: "445224199901043333" },
|
|
|
- { realname: "lian", idCord: "445224199901043313" },
|
|
|
- { realname: "唐", idCord: "445224199901043333" },
|
|
|
- { realname: "lian", idCord: "445224199901043313" },
|
|
|
- { realname: "唐", idCord: "445224199901043333" },
|
|
|
- { realname: "lian", idCord: "445224199901043313" },
|
|
|
- { realname: "lian", idCord: "445224199901043313" },
|
|
|
- { realname: "唐", idCord: "445224199901043333" },
|
|
|
- { realname: "lian", idCord: "445224199901043313" },
|
|
|
- { realname: "唐", idCord: "445224199901043333" },
|
|
|
- { realname: "lian", idCord: "445224199901043313" },
|
|
|
- { realname: "lian", idCord: "445224199901043313" },
|
|
|
- { realname: "唐", idCord: "445224199901043333" },
|
|
|
- { realname: "lian", idCord: "445224199901043313" },
|
|
|
- { realname: "唐", idCord: "445224199901043333" },
|
|
|
- { realname: "lian", idCord: "445224199901043313" },
|
|
|
- { realname: "lian", idCord: "445224199901043313" },
|
|
|
- { realname: "唐", idCord: "445224199901043333" },
|
|
|
- { realname: "lian", idCord: "445224199901043313" },
|
|
|
- { realname: "唐", idCord: "445224199901043333" },
|
|
|
- { realname: "lian", idCord: "445224199901043313" },
|
|
|
- ],
|
|
|
+ tableDataSuccess: [],
|
|
|
tableDataError: [],
|
|
|
tableSet: [
|
|
|
{
|
|
|
label: "学员姓名",
|
|
|
- prop: "realname",
|
|
|
+ prop: "userName",
|
|
|
},
|
|
|
{
|
|
|
label: "学员身份证",
|
|
|
- prop: "idCord",
|
|
|
+ prop: "idCard",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "商品编码",
|
|
|
+ prop: "code",
|
|
|
+ width: "120px",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "所购商品",
|
|
|
+ prop: "goodsName",
|
|
|
+ width: "180px",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "考试安排",
|
|
|
+ prop: "applyName",
|
|
|
+ width: "140px",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "预约场次(考试地点和时间)",
|
|
|
+ prop1: "applySiteAddress",
|
|
|
+ prop2: "applySiteExamTime",
|
|
|
+ prop3: "applySiteTime",
|
|
|
+ scope: "time",
|
|
|
+ width: "240px",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "预约场次(考培地点和时间)",
|
|
|
+ prop1: "applySiteAddressTrain",
|
|
|
+ prop2: "applySiteExamTrainTime",
|
|
|
+ prop3: "applySiteTrainTime",
|
|
|
+ scope: "time",
|
|
|
+ width: "240px",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "出错原因",
|
|
|
+ prop: "cause",
|
|
|
+ hidden: true,
|
|
|
},
|
|
|
],
|
|
|
};
|
|
|
},
|
|
|
- computed: { ...mapGetters(["examList", "applySiteAddress"]) },
|
|
|
+ computed: {
|
|
|
+ ...mapGetters(["examList", "applySiteAddress"]),
|
|
|
+ computedForm: function () {
|
|
|
+ return function (tabs, int) {
|
|
|
+ if (int === 1) {
|
|
|
+ const ays = tabs.filter((item) => {
|
|
|
+ if (this.typeInt === 1) {
|
|
|
+ return (
|
|
|
+ item.label !== "预约场次(考培地点和时间)" && !item.hidden
|
|
|
+ );
|
|
|
+ } else {
|
|
|
+ return !item.hidden;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ return ays;
|
|
|
+ } else {
|
|
|
+ const ays = tabs.filter((item) => {
|
|
|
+ if (this.typeInt === 1) {
|
|
|
+ return item.label !== "预约场次(考培地点和时间)";
|
|
|
+ } else {
|
|
|
+ return item;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ return ays;
|
|
|
+ }
|
|
|
+ };
|
|
|
+ },
|
|
|
+ },
|
|
|
methods: {
|
|
|
- /**下载模板 */
|
|
|
- downModel() {
|
|
|
+ /**
|
|
|
+ * 转换时间格式
|
|
|
+ */
|
|
|
+ changeDatas(time) {
|
|
|
+ if (time) {
|
|
|
+ var datas = this.$methodsTools.onlyForma(
|
|
|
+ new Date(time).getTime() / 1000,
|
|
|
+ false
|
|
|
+ );
|
|
|
+ return datas;
|
|
|
+ } else {
|
|
|
+ return "";
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 下载错误数据
|
|
|
+ */
|
|
|
+ dowmErrorData() {
|
|
|
+ this.$api
|
|
|
+ .inquiresystemsubscribeexportErrorNew(this.tableDataError)
|
|
|
+ .then((res) => {
|
|
|
+ let url = baseUrls.baseURL + "common/download?fileName=" + res.msg;
|
|
|
+ let link = document.createElement("a");
|
|
|
+ let fileName = "导入模板" + ".xlsx";
|
|
|
+ document.body.appendChild(link);
|
|
|
+ link.href = url;
|
|
|
+ link.dowmload = fileName;
|
|
|
+ link.click();
|
|
|
+ link.remove();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ *
|
|
|
+ * @param {Number} int 下载模板
|
|
|
+ */
|
|
|
+ downModel(int) {
|
|
|
if (!this.formData.applyId) {
|
|
|
this.$message.warning("请选择考试计划");
|
|
|
return;
|
|
@@ -196,7 +333,14 @@ export default {
|
|
|
this.$message.warning("请选择考试地点");
|
|
|
return;
|
|
|
}
|
|
|
+ if (int === 2 && !this.formData.applySiteAddressTrain) {
|
|
|
+ this.$message.warning("请选择考培地点");
|
|
|
+ return;
|
|
|
+ }
|
|
|
var data = JSON.parse(JSON.stringify(this.formData));
|
|
|
+ if (int === 1) {
|
|
|
+ delete data.applySiteAddressTrain;
|
|
|
+ }
|
|
|
const indexs = this.examList.findIndex((item) => {
|
|
|
return item.applyId == data.applyId;
|
|
|
});
|
|
@@ -227,6 +371,44 @@ export default {
|
|
|
}, 200);
|
|
|
});
|
|
|
},
|
|
|
+ /**
|
|
|
+ *
|
|
|
+ * @param {event} e 不含考培导入模板
|
|
|
+ */
|
|
|
+ importMobleadd(e) {
|
|
|
+ var file = e.target.files[0];
|
|
|
+ let formData = new FormData();
|
|
|
+ formData.append("file", file);
|
|
|
+ this.$api
|
|
|
+ .editsystemsubscribeimportData(formData)
|
|
|
+ .then((res) => {
|
|
|
+ this.tableDataSuccess = res.data.successList;
|
|
|
+ this.tableDataError = res.data.errorList;
|
|
|
+ this.typeInt = 1;
|
|
|
+ })
|
|
|
+ .finally(() => {
|
|
|
+ e.target.value = "";
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ *
|
|
|
+ * @param {event} e 含考培导入模板
|
|
|
+ */
|
|
|
+ importMobleaddtrain(e) {
|
|
|
+ var file = e.target.files[0];
|
|
|
+ let formData = new FormData();
|
|
|
+ formData.append("file", file);
|
|
|
+ this.$api
|
|
|
+ .editsystemsubscribeimportTrainData(formData)
|
|
|
+ .then((res) => {
|
|
|
+ this.tableDataSuccess = res.data.successList;
|
|
|
+ this.tableDataError = res.data.errorList;
|
|
|
+ this.typeInt = 2;
|
|
|
+ })
|
|
|
+ .finally(() => {
|
|
|
+ e.target.value = "";
|
|
|
+ });
|
|
|
+ },
|
|
|
},
|
|
|
};
|
|
|
</script>
|
|
@@ -242,4 +424,97 @@ export default {
|
|
|
margin-top: 10px;
|
|
|
border-radius: 4px;
|
|
|
}
|
|
|
+/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;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+.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;
|
|
|
+ }
|
|
|
+}
|
|
|
+.item {
|
|
|
+ margin-top: 10px;
|
|
|
+ margin-right: 20px;
|
|
|
+}
|
|
|
</style>
|