js

src/views/Store/enter.vue

@@ -21,13 +21,10 @@
         </el-form-item>
       </el-form>
       <!--操作区-->
-      <div class="btn-nav clr">
-        <el-upload class="upload-demo fl" :data="fileData" :action="uploadUrl" :on-change="handleChange" multiple>
-          <div class="fl dcg">导入</div>
-        </el-upload>
-        <a :href="downHref" ref="downs" target="_blank" style="display:none">下载</a>
-        <a class="fl dcg" :href="downUrl" target="_blank">下载模版</a>
-        <div class="fl dcg delbtn" @click="del">删除</div>
+      <div class="operation-area row">
+        <el-button type="primary" @click="importChange">导入</el-button>
+        <a href="/uploadSku.csv" class="downTemplate">下载模版</a>
+        <el-button type="danger" @click="del">删除</el-button>
       </div>
       <!--列表区-->
       <div class="data-box th-all" v-if="tableData">
@@ -56,6 +53,27 @@
         </el-table>
         <el-pagination layout="total, sizes, prev, pager, next, jumper" :page-sizes="[10, 20, 50, 100, 200]" :total="total" @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="page"></el-pagination>
       </div>
+      <!--导入数据确认-->
+      <el-dialog title="导入数据确认" :close-on-click-modal="false" :visible.sync="dialogVisible" width="700px" custom-class="dialog-layer-notice">
+        <div class="dialog-text">
+          <p class="tt">
+            上传的型号经由猎芯审核通过后，会展示在【猎芯网】进行售卖，并参与【猎芯询报价】系统自动推送询价<br/>
+            您此次上传的型号是否要对已在【猎芯网】展示的型号进行覆盖或是新增？
+          </p>
+          <p class="alink">覆盖：已在【猎芯网】进行展示的型号全部下架，展示现在新上传的型号；</p>
+          <p class="alink">新增：已在【猎芯网】进行展示的型号保持不变，额外加上新上传的型号；</p>
+          <div class="row" style="margin-top: 10px;margin-bottom: 10px;">
+            <el-radio v-model="fileData.type" label="1">覆盖</el-radio>
+            <el-radio v-model="fileData.type" label="2">新增</el-radio>
+          </div>
+          <div slot="footer" class="dialog-footer row" style="text-align: right;justify-content: flex-end;">
+            <el-button @click="dialogVisible = false" style="margin-right: 10px;">取 消</el-button>
+            <el-upload :data="fileData" :action="uploadUrl" :on-change="handleChange" multiple>
+              <el-button type="primary" @click="uploadChange">确 定</el-button>
+            </el-upload>
+          </div>
+        </div>
+      </el-dialog>
     </div>
     <Menu/>
   </div>
@@ -66,11 +84,11 @@ import Vue from 'vue';
 import Menu from "@/components/menu.vue";
 import Tool from '../../tool'
 import {NODE_ENVS} from "../../ajax";
-import {Button, DatePicker, Dialog, Dropdown, DropdownItem, DropdownMenu, Form, FormItem, Input, Message, MessageBox, Option, Pagination, Select, Table, TableColumn, Tag, Upload} from 'element-ui'
+import {Button, DatePicker, Dialog, Dropdown, DropdownItem, DropdownMenu, Form, FormItem, Input, Message, MessageBox, Option, Pagination, Radio, Select, Table, TableColumn, Tag, Upload} from 'element-ui'
 
 Vue.prototype.$message = Message
 Vue.use(Button).use(Form).use(Select).use(Option).use(Input).use(FormItem).use(Dialog).use(Pagination).use(Tag);
-Vue.use(DatePicker).use(Dropdown).use(DropdownMenu).use(DropdownItem).use(TableColumn).use(Table).use(Upload);
+Vue.use(DatePicker).use(Dropdown).use(DropdownMenu).use(DropdownItem).use(TableColumn).use(Table).use(Upload).use(Radio);
 export default {
   name: "enter",
   data() {
@@ -79,9 +97,12 @@ export default {
       limit: 10,
       page: 1,
       downHref: "",
+      dialogVisible: false,
       uploadUrl: NODE_ENVS + '/api/uploadSku/import',
-      fileData: {token: Tool.getCookie('token')},
-      downUrl: NODE_ENVS + '/api/uploadSku/downUploadCsv?token=' + Tool.getCookie('token'),
+      fileData: {
+        token: Tool.getCookie('token'),
+        type:"1"//1覆盖 2新增
+      },
       formParam: {
         status: '',
         date: ''
@@ -100,8 +121,13 @@ export default {
   created() {
     this.getData();
   },
-  computed: {},
   methods: {
+    importChange() {
+      this.dialogVisible = true;
+    },
+    /**
+     * 获取数据
+     */
     getData() {
       this.$http('get', "/api/uploadSku/list", {
         page: this.page,
@@ -125,10 +151,19 @@ export default {
       this.formParam.date = '';
       this.$refs[formName].resetFields();
     },
+    /**
+     * 搜索提交
+     */
     submit() {
       this.page = 1;
       this.getData();
     },
+    /**
+     * 文件导入
+     * @param file
+     * @param fileList
+     * @returns {boolean}
+     */
     handleChange(file, fileList) {
       if (!file.response) {
         return false;
@@ -141,31 +176,15 @@ export default {
         this.page = 1;
         this.getData();
       } else {
-        this.$message(file.response.msg);
-      }
-
-    },
-    checkdr() {
-      if (this.multipleSelection.length > 1) {
-        this.$message({
-          message: '只能选择一条数据导入',
-          type: 'warning'
-        });
-        return
-      }
-      if (this.multipleSelection.length == 0) {
         this.$message({
-          message: '请至少选择一条数据导入',
+          message: res.msg,
           type: 'warning'
         });
-        return
       }
-      this.downHref = NODE_ENVS + '/api/uploadSku/downResult?id=' + this.multipleSelection[0]['id'] + '&token=' + Tool.getCookie('token')
-      setTimeout(() => {
-        this.$refs.downs.click()
-      }, 10)
-
     },
+    /**
+     * 删除
+     */
     del() {
       if (this.multipleSelection.length == 0) {
         this.$message({
@@ -201,6 +220,12 @@ export default {
 
       })
     },
+    /**
+     * 导入数据确认提交
+     */
+    uploadChange() {
+
+    },
     handleSizeChange(val) {
       this.limit = val;
       this.getData();
@@ -220,4 +245,30 @@ export default {
 </script>
 <style scoped>
 @import "../../assets/css/store/enter.min.css";
+
+.downTemplate {
+  width: 68px;
+  height: 28px;
+  text-align: center;
+  line-height: 28px;
+  color: #FFF;
+  background-color: #409EFF;
+  border-color: #409EFF;
+  font-size: 12px;
+  border-radius: 3px;
+  margin-left: 10px;
+  margin-right: 10px;
+  display: block;
+}
+
+.dialog-text .tt {
+  color: #333;
+  font-weight: bold;
+  line-height: 25px;
+  margin-bottom: 16px;
+}
+
+.dialog-text .alink {
+  font-size: 12px;
+}
 </style>
\ No newline at end of file