bug fix

src/views/config/city.vue

@@ -1,6 +1,5 @@
 <template>
   <div class="app-container">
-
     <!-- 查询和其他操作
     <div class="filter-container">
       <el-input v-model="listQuery.title" clearable class="filter-item" style="width: 200px;" placeholder="请输入专题标题" />
@@ -14,47 +13,115 @@
 
     <!--<div class="operator-container"> -->
     <div class="filter-container">
-      <el-button v-permission="['POST /admin/city/create']" class="filter-item" type="primary" icon="el-icon-edit" @click="handleCreate">添加</el-button>
+      <el-button
+        v-permission="['POST /admin/city/create']"
+        class="filter-item"
+        type="primary"
+        icon="el-icon-edit"
+        @click="handleCreate"
+        >添加</el-button
+      >
       <!--<el-button v-permission="['GET /admin/city/batch-delete']" class="filter-item" type="danger" icon="el-icon-delete" @click="handleBatchDelete">批量删除</el-button>-->
     </div>
 
     <!-- 查询结果 -->
-    <el-table v-loading="listLoading" :data="list" element-loading-text="正在查询中。。。" border fit highlight-current-row @selection-change="handleSelectionChange">
+    <el-table
+      v-loading="listLoading"
+      :data="list"
+      element-loading-text="正在查询中。。。"
+      border
+      fit
+      highlight-current-row
+      @selection-change="handleSelectionChange"
+    >
       <!--<el-table-column type="selection" width="55" />-->
 
       <el-table-column align="center" label="业务城市" prop="cityName" />
 
       <el-table-column align="center" label="位置编码" prop="areaId" />
 
+      <el-table-column align="center" label="默认门店" prop="defaultShopName" />
+
       <el-table-column align="center" label="分站地址" prop="cityAddress" />
 
-      <el-table-column align="center" label="操作" min-width="100" class-name="small-padding fixed-width">
+      <el-table-column
+        align="center"
+        label="操作"
+        min-width="100"
+        class-name="small-padding fixed-width"
+      >
         <template slot-scope="scope">
-          <el-button v-permission="['POST /admin/city/update']" type="primary" size="mini" @click="handleUpdate(scope.row)">编辑</el-button>
+          <el-button
+            v-permission="['POST /admin/city/update']"
+            type="primary"
+            size="mini"
+            @click="handleUpdate(scope.row)"
+            >编辑</el-button
+          >
           <!-- <el-button v-permission="['POST /admin/city/delete']" type="danger" size="mini" @click="handleDelete(scope.row)">删除</el-button>-->
         </template>
       </el-table-column>
     </el-table>
 
-    <pagination v-show="total>0" :total="total" :page.sync="listQuery.page" :limit.sync="listQuery.limit" @pagination="getList" />
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      :page.sync="listQuery.page"
+      :limit.sync="listQuery.limit"
+      @pagination="getList"
+    />
 
     <!-- 添加或修改对话框 -->
     <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible">
-      <el-form ref="dataForm" :rules="rules" :model="dataForm" status-icon label-position="left" label-width="100px" style="width: 500px; margin-left:50px;">
-
+      <el-form
+        ref="dataForm"
+        :rules="rules"
+        :model="dataForm"
+        status-icon
+        label-position="left"
+        label-width="100px"
+        style="width: 500px; margin-left:50px;"
+      >
         <el-form-item label="业务城市" prop="cityName">
           <el-input v-model="dataForm.cityName" placeholder="请输入内容" />
         </el-form-item>
         <el-form-item label="位置编码" prop="areaId">
-          <el-input v-model="dataForm.areaId" type="number" placeholder="请输入城市编码" />
+          <el-input
+            v-model="dataForm.areaId"
+            type="number"
+            placeholder="请输入城市编码"
+          />
         </el-form-item>
         <el-form-item label="分站地址" prop="cityAddress">
-          <el-input v-model="dataForm.cityAddress" placeholder="请输入分站地址" />
+          <el-input
+            v-model="dataForm.cityAddress"
+            placeholder="请输入分站地址"
+          />
+        </el-form-item>
+        <el-form-item label="默认门店" prop="shops">
+          <el-select
+            v-model="dataForm.defaultShopId"
+            style="width:100%"
+            placeholder="默认哪个门店"
+            clearable
+          >
+            <el-option
+              v-for="item in shops"
+              :key="item.id"
+              :label="item.shopName"
+              :value="item.id"
+            />
+          </el-select>
         </el-form-item>
       </el-form>
       <div slot="footer" class="dialog-footer">
         <el-button @click="dialogFormVisible = false">取消</el-button>
-        <el-button v-if="dialogStatus=='create'" type="primary" @click="createData">确定</el-button>
+        <el-button
+          v-if="dialogStatus == 'create'"
+          type="primary"
+          @click="createData"
+          >确定</el-button
+        >
         <el-button v-else type="primary" @click="updateData">确定</el-button>
       </div>
     </el-dialog>
@@ -62,27 +129,33 @@
     <el-tooltip placement="top" content="返回顶部">
       <back-to-top :visibility-height="100" />
     </el-tooltip>
-
   </div>
 </template>
 
 <style>
-  .el-table th.gutter{
-          display: table-cell!important;
-        }
+.el-table th.gutter {
+  display: table-cell !important;
+}
 .el-dialog {
   width: 800px;
 }
 </style>
 
 <script>
-import { listCity, deleteCity, updateCity, readCity, createCity } from '@/api/city'
-import BackToTop from '@/components/BackToTop'
-import Pagination from '@/components/Pagination' // Secondary package based on el-pagination
-import _ from 'lodash'
+import {
+  listCity,
+  deleteCity,
+  updateCity,
+  readCity,
+  createCity
+} from "@/api/city";
+import { getShop } from "@/api/goods";
+import BackToTop from "@/components/BackToTop";
+import Pagination from "@/components/Pagination"; // Secondary package based on el-pagination
+import _ from "lodash";
 
 export default {
-  name: 'Topic',
+  name: "Topic",
   components: { BackToTop, Pagination },
   data() {
     return {
@@ -92,203 +165,218 @@ export default {
       listQuery: {
         page: 1,
         limit: 20,
-        sort: 'create_time',
-        order: 'desc'
+        sort: "create_time",
+        order: "desc"
       },
       dataForm: {
         id: undefined,
-        cityName: '',
+        cityName: "",
         areaId: undefined,
-        cityAddress: undefined
+        cityAddress: undefined,
+        defaultShopId: ""
       },
+      shops: [],
       dialogFormVisible: false,
-      dialogStatus: '',
+      dialogStatus: "",
       textMap: {
-        update: '编辑',
-        create: '创建'
+        update: "编辑",
+        create: "创建"
       },
       rules: {
-        cityName: [{ required: true, message: '名称不能为空', trigger: 'blur' }]
+        cityName: [{ required: true, message: "名称不能为空", trigger: "blur" }]
       },
-      options: [{
-        value: 'id',
-        label: '按序号排序'
-      }, {
-        value: 'create_time',
-        label: '按时间排序'
-      }],
+      options: [
+        {
+          value: "id",
+          label: "按序号排序"
+        },
+        {
+          value: "create_time",
+          label: "按时间排序"
+        }
+      ],
       multipleSelection: [],
-      contentDetail: '',
+      contentDetail: "",
       contentDialogVisible: false,
       downloadLoading: false
-    }
+    };
   },
   created() {
-    this.getList()
+    this.getList();
+    getShop().then(res => {
+      console.info(res);
+      this.shops = res.data.data;
+    });
   },
   methods: {
     getList() {
-      this.listLoading = true
+      this.listLoading = true;
       listCity(this.listQuery)
         .then(response => {
-          this.list = response.data.data.list
-          this.total = response.data.data.total
-          this.listLoading = false
+          this.list = response.data.data.list;
+          this.total = response.data.data.total;
+          this.listLoading = false;
         })
         .catch(() => {
-          this.list = []
-          this.total = 0
-          this.listLoading = false
-        })
+          this.list = [];
+          this.total = 0;
+          this.listLoading = false;
+        });
     },
+
     handleFilter() {
-      this.listQuery.page = 1
-      this.getList()
+      this.listQuery.page = 1;
+      this.getList();
     },
     handleCreate() {
-      this.resetForm()
-      this.dialogStatus = 'create'
-      this.dialogFormVisible = true
+      this.resetForm();
+      this.dialogStatus = "create";
+      this.dialogFormVisible = true;
       this.$nextTick(() => {
-        this.$refs['dataForm'].clearValidate()
-      })
+        this.$refs["dataForm"].clearValidate();
+      });
     },
     resetForm() {
-      this.dataForm =
-      {
+      this.dataForm = {
         id: undefined,
-        cityName: '',
+        cityName: "",
         areaId: undefined,
-        cityAddress: undefined
-      }
+        cityAddress: undefined,
+        defaultShopId: ""
+      };
     },
     createData() {
-      this.$refs['dataForm'].validate((valid) => {
+      this.$refs["dataForm"].validate(valid => {
         if (valid) {
-          createCity(this.dataForm).then(response => {
-            this.list.unshift(response.data.data)
-            this.dialogFormVisible = false
-            this.$notify.success({
-              title: '成功',
-              message: '创建成功'
-            })
-          }).catch(response => {
-            this.$notify.error({
-              title: '失败',
-              message: response.data.errmsg
+          createCity(this.dataForm)
+            .then(response => {
+              this.list.unshift(response.data.data);
+              this.dialogFormVisible = false;
+              this.$notify.success({
+                title: "成功",
+                message: "创建成功"
+              });
             })
-          })
+            .catch(response => {
+              this.$notify.error({
+                title: "失败",
+                message: response.data.errmsg
+              });
+            });
         }
-      })
+      });
     },
     handleUpdate(row) {
-      this.dataForm = Object.assign({}, row)
-      this.dialogStatus = 'update'
-      this.dialogFormVisible = true
+      this.dataForm = Object.assign({}, row);
+      this.dialogStatus = "update";
+      this.dialogFormVisible = true;
       this.$nextTick(() => {
-        this.$refs['dataForm'].clearValidate()
-      })
+        this.$refs["dataForm"].clearValidate();
+      });
     },
     updateData() {
-      this.$refs['dataForm'].validate((valid) => {
+      this.$refs["dataForm"].validate(valid => {
         if (valid) {
-          updateCity(this.dataForm).then(() => {
-            for (const v of this.list) {
-              if (v.id === this.dataForm.id) {
-                const index = this.list.indexOf(v)
-                this.list.splice(index, 1, this.dataForm)
-                break
+          updateCity(this.dataForm)
+            .then(() => {
+              for (const v of this.list) {
+                if (v.id === this.dataForm.id) {
+                  const index = this.list.indexOf(v);
+                  this.list.splice(index, 1, this.dataForm);
+                  break;
+                }
               }
-            }
-            this.dialogFormVisible = false
-            this.$notify.success({
-              title: '成功',
-              message: '更新成功'
+              this.dialogFormVisible = false;
+              this.$notify.success({
+                title: "成功",
+                message: "更新成功"
+              });
+              this.getList();
             })
-          }).catch(response => {
-            this.$notify.error({
-              title: '失败',
-              message: response.data.errmsg
-            })
-          })
+            .catch(response => {
+              this.$notify.error({
+                title: "失败",
+                message: response.data.errmsg
+              });
+            });
         }
-      })
+      });
     },
     handleDelete(row) {
       deleteCity(row)
         .then(response => {
           this.$notify.success({
-            title: '成功',
-            message: '停用城市成功'
-          })
-          const index = this.list.indexOf(row)
-          this.list.splice(index, 1)
+            title: "成功",
+            message: "停用城市成功"
+          });
+          const index = this.list.indexOf(row);
+          this.list.splice(index, 1);
         })
         .catch(response => {
           this.$notify.error({
-            title: '失败',
+            title: "失败",
             message: response.data.errmsg
-          })
-        })
+          });
+        });
     },
     handleSelectionChange(val) {
-      this.multipleSelection = val
+      this.multipleSelection = val;
     },
     showContent(content) {
-      this.contentDetail = content
-      this.contentDialogVisible = true
+      this.contentDetail = content;
+      this.contentDialogVisible = true;
     },
     handleBatchDelete() {
       if (this.multipleSelection.length === 0) {
-        this.$message.error('请选择至少一条记录')
-        return
+        this.$message.error("请选择至少一条记录");
+        return;
       }
-      const ids = []
+      const ids = [];
       _.forEach(this.multipleSelection, function(item) {
-        ids.push(item.id)
-      })
+        ids.push(item.id);
+      });
       batchDeleteTopic({ ids: ids })
         .then(response => {
           this.$notify.success({
-            title: '成功',
-            message: '批量删除专题成功'
-          })
-          this.getList()
+            title: "成功",
+            message: "批量删除专题成功"
+          });
+          this.getList();
         })
         .catch(response => {
           this.$notify.error({
-            title: '失败',
+            title: "失败",
             message: response.data.errmsg
-          })
-        })
+          });
+        });
     },
     handleDownload() {
-      this.downloadLoading = true
-      import('@/vendor/Export2Excel').then(excel => {
+      this.downloadLoading = true;
+      import("@/vendor/Export2Excel").then(excel => {
         const tHeader = [
-          '专题ID',
-          '专题标题',
-          '专题子标题',
-          '专题内容',
-          '专题图片',
-          '商品低价',
-          '阅读量',
-          '专题商品'
-        ]
+          "专题ID",
+          "专题标题",
+          "专题子标题",
+          "专题内容",
+          "专题图片",
+          "商品低价",
+          "阅读量",
+          "专题商品"
+        ];
         const filterVal = [
-          'id',
-          'title',
-          'subtitle',
-          'content',
-          'picUrl',
-          'price',
-          'readCount',
-          'goods'
-        ]
-        excel.export_json_to_excel2(tHeader, this.list, filterVal, '专题信息')
-        this.downloadLoading = false
-      })
+          "id",
+          "title",
+          "subtitle",
+          "content",
+          "picUrl",
+          "price",
+          "readCount",
+          "goods"
+        ];
+        excel.export_json_to_excel2(tHeader, this.list, filterVal, "专题信息");
+        this.downloadLoading = false;
+      });
     }
   }
-}
+};
 </script>