Elements-SY

modify

...@@ -2,17 +2,43 @@ ...@@ -2,17 +2,43 @@
2 <div class="table-container"> 2 <div class="table-container">
3 <el-row v-if="attrs.btnCofig.isBtn" style="margin-bottom: 15px"> 3 <el-row v-if="attrs.btnCofig.isBtn" style="margin-bottom: 15px">
4 <el-col> 4 <el-col>
5 - <el-button 5 + <span
6 - v-for="item in attrs.btnCofig.btnGroup" 6 + v-for="(item, i) in attrs.btnCofig.btnGroup"
7 :key="item.btnName" 7 :key="item.btnName"
8 + :class="i == 0 ? 'first-span' : 'span'"
9 + >
10 + <el-button
8 :type="item.type" 11 :type="item.type"
9 :icon="item.icon" 12 :icon="item.icon"
10 :round="item.round" 13 :round="item.round"
11 :size="item.size" 14 :size="item.size"
12 :loading="item.loading" 15 :loading="item.loading"
13 @click="handleClick(item)" 16 @click="handleClick(item)"
17 + v-if="item.btnName !== '导入' && item.btnName !== '导出'"
18 + >{{ item.btnName }}</el-button
19 + >
20 + <el-upload
21 + v-else
22 + ref="upload"
23 + :action="item.action"
24 + :fileName="item.fileName"
25 + :http-request="toUpload"
26 + :on-remove="onRemoveUpload"
27 + :limit="item.limit"
28 + :accept="item.accept"
29 + :show-file-list="false"
30 + class="upload"
31 + >
32 + <el-button
33 + :type="item.type"
34 + :icon="item.icon"
35 + :round="item.round"
36 + :size="item.size"
37 + :loading="item.loading"
14 >{{ item.btnName }}</el-button 38 >{{ item.btnName }}</el-button
15 > 39 >
40 + </el-upload>
41 + </span>
16 </el-col> 42 </el-col>
17 </el-row> 43 </el-row>
18 <el-table 44 <el-table
...@@ -231,6 +257,14 @@ export default { ...@@ -231,6 +257,14 @@ export default {
231 }, 257 },
232 }); 258 });
233 }, 259 },
260 + // 选择上传
261 + toUpload(options) {
262 + this.$emit("upload", options);
263 + },
264 + //移除上传
265 + onRemoveUpload(file, fileList) {
266 + this.$emit("rmfile", { file, fileList });
267 + },
234 }, 268 },
235 watch: { 269 watch: {
236 data() { 270 data() {
...@@ -250,4 +284,10 @@ export default { ...@@ -250,4 +284,10 @@ export default {
250 padding: 0; 284 padding: 0;
251 } 285 }
252 } 286 }
287 + .first-span,.span{
288 + display: inline-block;
289 + }
290 + .span{
291 + margin-left: 6px;
292 + }
253 </style> 293 </style>
......
1 <template> 1 <template>
2 <div class="error-container"> 2 <div class="error-container">
3 <el-dialog 3 <el-dialog
4 - title="错误信息" 4 + :width="width"
5 + :title="title"
6 + :center="center"
5 :visible.sync="dialogVisible" 7 :visible.sync="dialogVisible"
8 + :close-on-click-modal="onModalClickClose"
6 @open="dialogOpenEvent" 9 @open="dialogOpenEvent"
7 @close="dialogCloseEvent" 10 @close="dialogCloseEvent"
8 > 11 >
9 - <el-table :data="errorMessageData"> 12 + <slot></slot>
10 - <el-table-column 13 + <span slot="footer" class="dialog-footer">
11 - type="index" 14 + <el-button @click="cancel">取 消</el-button>
12 - width="50" 15 + <el-button type="primary" @click="confirm">{{
13 - align="center" 16 + confirmBtnName
14 - ></el-table-column> 17 + }}</el-button>
15 - <el-table-column label="错误信息" prop="errorMessage" width="200"> 18 + </span>
16 - <template slot-scope="scope">
17 - <div v-for="(m, key) in scope.row.errorMessage" :key="key">
18 - {{ m }}
19 - </div>
20 - </template>
21 - </el-table-column>
22 - </el-table>
23 </el-dialog> 19 </el-dialog>
24 </div> 20 </div>
25 </template> 21 </template>
26 22
27 - <script> 23 +<script>
28 export default { 24 export default {
25 + props: {
26 + width: {
27 + type: String,
28 + default: "50%",
29 + },
30 + title: {
31 + type: String,
32 + default: "标题",
33 + },
34 + center: {
35 + type: String,
36 + default: "center",
37 + },
38 + confirmBtnName: {
39 + type: String,
40 + default: "确 定",
41 + },
42 + onModalClickClose: {
43 + type: Boolean,
44 + default: false,
45 + },
46 + },
29 data() { 47 data() {
30 return { 48 return {
31 dialogVisible: false, 49 dialogVisible: false,
32 - errorMessageData: [],
33 }; 50 };
34 }, 51 },
35 computed: {}, 52 computed: {},
...@@ -38,7 +55,6 @@ export default { ...@@ -38,7 +55,6 @@ export default {
38 methods: { 55 methods: {
39 dialogOpenEvent(data) { 56 dialogOpenEvent(data) {
40 if (data && data.length) { 57 if (data && data.length) {
41 - this.errorMessageData = data;
42 console.log(data); 58 console.log(data);
43 } 59 }
44 this.dialogVisible = true; 60 this.dialogVisible = true;
...@@ -48,9 +64,19 @@ export default { ...@@ -48,9 +64,19 @@ export default {
48 this.dialogVisible = false; 64 this.dialogVisible = false;
49 this.$emit("close"); 65 this.$emit("close");
50 }, 66 },
67 + // 确认事件
68 + confirm() {
69 + this.dialogVisible = false;
70 + this.$emit("confirm");
71 + },
72 + // 取消事件
73 + cancel() {
74 + this.dialogVisible = false;
75 + this.$emit("cancel");
76 + },
51 }, 77 },
52 }; 78 };
53 </script> 79 </script>
54 - <style lang='scss' scoped> 80 +<style lang='scss' scoped>
55 81
56 - </style> 82 +</style>
......
...@@ -20,19 +20,69 @@ ...@@ -20,19 +20,69 @@
20 :pageConfig="pageConfig" 20 :pageConfig="pageConfig"
21 @search="searchBtn" 21 @search="searchBtn"
22 @download="downloadTemplate" 22 @download="downloadTemplate"
23 - @upLoad="upLoadTemplate" 23 + @upload="toUpload"
24 - @export="exportTemplate" 24 + @rmfile="onRemoveUpload"
25 @delete="deleteData" 25 @delete="deleteData"
26 @sizeChange="handleSizeChange" 26 @sizeChange="handleSizeChange"
27 @currentChange="handleCurrentChange" 27 @currentChange="handleCurrentChange"
28 > 28 >
29 </yl-table> 29 </yl-table>
30 + <!-- <modle-view
31 + ref="modleViewRef"
32 + width="30%"
33 + title="导入Excel"
34 + confirmBtnName="导入Excel"
35 + @confirm="dialogConfirm"
36 + >
37 + <el-form
38 + :model="paramsForm"
39 + :rules="rules"
40 + ref="ruleForm"
41 + label-width="80px"
42 + >
43 + <el-row>
44 + <el-col :span="20">
45 + <el-form-item
46 + label="商品名称"
47 + prop="skuName"
48 + size="small"
49 + label-position="left"
50 + >
51 + <el-input
52 + v-model="paramsForm.skuName"
53 + placeholder="请输入商品名称"
54 + ></el-input>
55 + </el-form-item>
56 + </el-col>
57 + </el-row>
58 + <el-row>
59 + <el-col>
60 + <el-form-item prop="file">
61 + <el-upload
62 + ref="upload"
63 + action="/goods/uploadGoodsExcel"
64 + name="file"
65 + :http-request="toUpload"
66 + :on-remove="onRemoveUpload"
67 + :limit="1"
68 + accept=".xlsx"
69 + class="upload"
70 + >
71 + <el-button type="primary" icon="el-icon-upload2" size="small"
72 + >选择文件</el-button
73 + >
74 + </el-upload>
75 + </el-form-item>
76 + </el-col>
77 + </el-row>
78 + </el-form>
79 + </modle-view> -->
30 </div> 80 </div>
31 </template> 81 </template>
32 -
33 <script> 82 <script>
34 import YlForm from "@/components/YlForm"; 83 import YlForm from "@/components/YlForm";
35 import YlTable from "@/components/YlTable"; 84 import YlTable from "@/components/YlTable";
85 +import ModleView from "./components/ModleView";
36 import { formConfig } from "./formConfig"; 86 import { formConfig } from "./formConfig";
37 import { tableAttr, columnHeader } from "./tableConfig"; 87 import { tableAttr, columnHeader } from "./tableConfig";
38 export default { 88 export default {
...@@ -40,11 +90,21 @@ export default { ...@@ -40,11 +90,21 @@ export default {
40 components: { 90 components: {
41 YlForm, 91 YlForm,
42 YlTable, 92 YlTable,
93 + ModleView,
43 }, 94 },
44 data() { 95 data() {
45 return { 96 return {
46 formConfig: formConfig, // 表单配置项 97 formConfig: formConfig, // 表单配置项
47 queryForm: {}, // 表单参数 98 queryForm: {}, // 表单参数
99 + paramsForm: {
100 + skuName: "",
101 + file: null,
102 + },
103 + rules: {
104 + skuName: [
105 + { required: true, message: "请输入商品名称", trigger: "blur" },
106 + ],
107 + },
48 pageConfig: { 108 pageConfig: {
49 // 分页配置项 109 // 分页配置项
50 isPagination: true, 110 isPagination: true,
...@@ -63,17 +123,29 @@ export default { ...@@ -63,17 +123,29 @@ export default {
63 created() {}, 123 created() {},
64 methods: { 124 methods: {
65 // 失焦事件 125 // 失焦事件
66 - blurEvent() { 126 + blurEvent() {},
67 - 127 + // 选择上传
128 + toUpload(options) {
129 + console.log(options);
130 + },
131 + //移除上传
132 + onRemoveUpload(options) {
133 + console.log(options);
68 }, 134 },
69 // 搜索 135 // 搜索
70 searchBtn() { 136 searchBtn() {
71 this.$refs.ruleForm.handleSearch("ruleForm", (val) => {}); 137 this.$refs.ruleForm.handleSearch("ruleForm", (val) => {});
72 }, 138 },
139 + // 确认对话框
140 + dialogConfirm() {},
73 // 下载 141 // 下载
74 - downloadTemplate() {}, 142 + downloadTemplate() {
143 + // this.$refs.modleViewRef.dialogOpenEvent();
144 + },
75 // 上传 145 // 上传
76 - upLoadTemplate() {}, 146 + upLoadTemplate() {
147 + // console.log(this.$refs.modleViewRef);
148 + },
77 // 导出 149 // 导出
78 exportTemplate() {}, 150 exportTemplate() {},
79 // 删除 151 // 删除
......
...@@ -32,6 +32,10 @@ export const tableAttr = { ...@@ -32,6 +32,10 @@ export const tableAttr = {
32 round: false, 32 round: false,
33 loading: false, 33 loading: false,
34 event: "upLoad", 34 event: "upLoad",
35 + action: "/goods/uploadGoodsExcel",
36 + fileName: "name",
37 + limit: 1,
38 + accept: ".xlsx",
35 }, 39 },
36 { 40 {
37 type: "primary", 41 type: "primary",
...@@ -41,6 +45,10 @@ export const tableAttr = { ...@@ -41,6 +45,10 @@ export const tableAttr = {
41 round: false, 45 round: false,
42 loading: false, 46 loading: false,
43 event: "export", 47 event: "export",
48 + action: "/goods/uploadGoodsExcel",
49 + fileName: "name",
50 + limit: 1,
51 + accept: ".xlsx",
44 }, 52 },
45 { 53 {
46 type: "danger", 54 type: "danger",
...@@ -69,35 +77,36 @@ export const columnHeader = (deleteRow) => [ ...@@ -69,35 +77,36 @@ export const columnHeader = (deleteRow) => [
69 width: "50", 77 width: "50",
70 }, 78 },
71 { 79 {
72 - label: "货站名称", 80 + label: "口岸",
73 prop: "portName", 81 prop: "portName",
74 align: "center", 82 align: "center",
75 minWidth: 100, 83 minWidth: 100,
76 }, 84 },
77 { 85 {
78 - label: "品名", 86 + label: "HSCODE",
79 - prop: "goodsName", 87 + prop: "goodsCode",
80 align: "center", 88 align: "center",
81 minWidth: 100, 89 minWidth: 100,
82 }, 90 },
83 { 91 {
84 - label: "操作人", 92 + label: "创建时间",
85 - prop: "updateUserName", 93 + prop: "createTime",
86 align: "center", 94 align: "center",
87 minWidth: 100, 95 minWidth: 100,
88 }, 96 },
89 { 97 {
90 - label: "操作时间", 98 + label: "创建人",
91 - prop: "updateTime", 99 + prop: "createUserName",
92 align: "center", 100 align: "center",
93 minWidth: 100, 101 minWidth: 100,
94 }, 102 },
95 { 103 {
96 - label: "创建时间", 104 + label: "文件名",
97 - prop: "createTime", 105 + prop: "fileName",
98 align: "center", 106 align: "center",
99 minWidth: 100, 107 minWidth: 100,
100 }, 108 },
109 +
101 { 110 {
102 label: "操作", 111 label: "操作",
103 prop: "operate", 112 prop: "operate",
......
...@@ -186,7 +186,7 @@ export default { ...@@ -186,7 +186,7 @@ export default {
186 cancelButtonText: '取消', 186 cancelButtonText: '取消',
187 type: "warning", 187 type: "warning",
188 }).then(() => { 188 }).then(() => {
189 - this.statusChange({ id: val.id, status: status }) 189 + this.statusChange({ id: val.id, status: status, tip: tip })
190 }).catch(() => { }) 190 }).catch(() => { })
191 } else { 191 } else {
192 this.msgWarning(res.msg) 192 this.msgWarning(res.msg)
...@@ -200,7 +200,7 @@ export default { ...@@ -200,7 +200,7 @@ export default {
200 cancelButtonText: '取消', 200 cancelButtonText: '取消',
201 type: "warning", 201 type: "warning",
202 }).then(() => { 202 }).then(() => {
203 - this.statusChange({ id: val.id, status: status }) 203 + this.statusChange({ id: val.id, status: status, tip: tip })
204 }).catch(() => { }) 204 }).catch(() => { })
205 } 205 }
206 }, 206 },
......