修改供应商管理

src/apis/components/search-company-type.js

@@ -2,6 +2,6 @@ import http from "@/apis/axios";
 const api = "admin/";
 export default {
   // 列表
-  list: (data, params) => http(api + "businesstitle", data, "post", params),
+  list: (data, params) => http(api + "supplier/nature", data, "post", params),
 };
    

src/components/globalComponents/search-company-type/main.vue

@@ -18,9 +18,8 @@
     <el-option
       v-for="(item, index) in options"
       :key="item.id + index + 'company_type'"
-      :label="item.company_type"
-      :value="item.id"
-      :disabled="item.status + '' === '0'"
+      :label="item.nature"
+      :value="item.nature"
     >
     </el-option>
   </el-select>
@@ -32,15 +31,7 @@ import resToken from "@/mixins/resToken";
 export default {
   name: "SearchCompanyType",
   mixins: [resToken],
-  props: [
-    "size",
-    "value",
-    "placeholder",
-    "isDetail",
-    "disabled",
-    "type",
-    "names",
-  ],
+  props: ["size", "value", "placeholder", "isDetail", "disabled", "type", "names"],
   /**
    * 属性集合
    * @param {String}        size             : 组件大小            非必填
@@ -86,7 +77,7 @@ export default {
     async selectChange(e) {
       let item = {};
       if (e) {
-        item = this.options.find((i) => i.id === e);
+        item = this.options.find((i) => i.nature === e);
       }
       this.$emit("searchChange", item);
     },
@@ -94,13 +85,11 @@ export default {
     async remoteMethod() {
       this.selectLoading = true;
       this.options = [];
-      const { code, data, message } = await asyncRequest.list(this.formValue);
-      if (code === 0) {
+      const { code, data } = await asyncRequest.list(this.formValue);
+      if (code === 1) {
         this.options = data;
-      } else if (code >= 100 && code <= 104) {
-        await this.logout();
       } else {
-        this.$message.warning(message);
+        this.options = [];
       }
       this.selectLoading = false;
     },
@@ -108,5 +97,4 @@ export default {
 };
 </script>
 
-<style>
-</style>
+<style></style>

src/components/globalComponents/select-area/main.vue

@@ -94,6 +94,7 @@ export default {
     //    @getCheckedNodes="getCheckedNodes"
     // },
     handleChange(value) {
+      console.log(value);
       this.$emit("selectChange", value);
     },
   },

src/views/operate/shop/addEdit.vue

@@ -118,6 +118,7 @@
                     size="small"
                     placeholder="地址省市区"
                     :disabled="isDetail"
+                    @selectChange="store_city_change"
                   />
                   <!-- <el-input
                     v-model="ruleForm.store_addr"
@@ -294,6 +295,10 @@ export default {
         }
       });
     },
+    store_city_change(e) {
+      this.ruleForm.store_city = e;
+      this.$refs.ruleForm.validateField("store_city");
+    },
     async submitForm() {
       await this.$refs.ruleForm.validate(async (valid) => {
         if (valid) {
@@ -348,7 +353,6 @@ export default {
       } else {
         this.ruleForm.store_image = url;
         this.$refs.ruleForm.validateField("store_image");
-        
       }
     },
 

src/views/operate/shop/columns.js

@@ -52,18 +52,17 @@ const rules = {
 
 const formItem = {
   id: "",
-  supplier_code: "QS20230605170528",
-  type_id: 34,
-  store_name: "测试店铺",
-  store_image:
-    "http://hwpro.test241.wanyuhengtong.com/storage/default/20230607/6c4b040420fb5a1d01837d0f120d60ec5c92ea62.jpg",
+  supplier_code: "",
+  type_id: "",
+  store_name: "",
+  store_image: "",
   map_addr: [115.70340104103089, 39.40107657164336],
-  store_addr: "顺义区",
-  store_city: ["1", "2", "3"],
-  contactor: "张三",
-  mobile: "17777777777",
-  email: "11@qq.com",
-  store_post: "经理",
+  store_addr: "",
+  store_city: [],
+  contactor: "",
+  mobile: "",
+  email: "",
+  store_post: "",
   status: 0,
 };
 const columns = [
@@ -91,7 +90,7 @@ const columns = [
     width: "60",
     _slot_: "status",
   },
-  
+
   {
     prop: "store_city_text",
     label: "所在城市",

src/views/operate/shopTrim/activity/addEdit.vue

@@ -162,6 +162,7 @@ export default {
           } else {
             this.ruleForm = {
               ...formItem,
+              act_img: [],
             };
           }
         }

src/views/operate/shopTrim/activity/columns.js

@@ -26,19 +26,8 @@ const rules = {
 
 const formItem = {
   id: "",
-  name: "测试活动",
-  act_img: [
-    "http://hwpro.test241.wanyuhengtong.com/storage/default/20230607/6c4b040420fb5a1d01837d0f120d60ec5c92ea62.jpg",
-    "http://hwpro.test241.wanyuhengtong.com/storage/default/20230607/6c4b040420fb5a1d01837d0f120d60ec5c92ea62.jpg",
-    "http://hwpro.test241.wanyuhengtong.com/storage/default/20230607/6c4b040420fb5a1d01837d0f120d60ec5c92ea62.jpg",
-    "http://hwpro.test241.wanyuhengtong.com/storage/default/20230607/6c4b040420fb5a1d01837d0f120d60ec5c92ea62.jpg",
-    "http://hwpro.test241.wanyuhengtong.com/storage/default/20230607/6c4b040420fb5a1d01837d0f120d60ec5c92ea62.jpg",
-    "http://hwpro.test241.wanyuhengtong.com/storage/default/20230607/6c4b040420fb5a1d01837d0f120d60ec5c92ea62.jpg",
-    "http://hwpro.test241.wanyuhengtong.com/storage/default/20230607/6c4b040420fb5a1d01837d0f120d60ec5c92ea62.jpg",
-    "http://hwpro.test241.wanyuhengtong.com/storage/default/20230607/6c4b040420fb5a1d01837d0f120d60ec5c92ea62.jpg",
-    "http://hwpro.test241.wanyuhengtong.com/storage/default/20230607/6c4b040420fb5a1d01837d0f120d60ec5c92ea62.jpg",
-    "http://hwpro.test241.wanyuhengtong.com/storage/default/20230607/6c4b040420fb5a1d01837d0f120d60ec5c92ea62.jpg",
-  ],
+  name: "",
+  act_img: [],
   act_url: "",
 };
 const columns = [
@@ -51,19 +40,19 @@ const columns = [
   {
     prop: "name",
     label: "名称",
-    minWidth: "200px"
+    minWidth: "200px",
   },
   {
     prop: "act_img",
     label: "图片",
-    _slot_:"act_img",
+    _slot_: "act_img",
     minWidth: "300px",
   },
   {
     prop: "act_url",
     label: "超链",
-    _slot_:"act_url",
-    minWidth: "70px"
+    _slot_: "act_url",
+    minWidth: "70px",
   },
 
   {

src/views/operate/shopTrim/conference/columns.js

@@ -15,10 +15,10 @@ const rules = {
 const formItem = {
   id: "",
   image:
-  "http://hwpro.test241.wanyuhengtong.com/storage/default/20230607/6c4b040420fb5a1d01837d0f120d60ec5c92ea62.jpg",
+  "http://hwpro.test241.wanyuhengtong.com/storage/default/20230629/adee46ee26342512293d7f340bc666475ba06674.png",
   name: "测试会议室",
   area: "412",
-  length: "3.9",
+  length: "23",
   capacity: "300",
   price: "20000",
 };

src/views/operate/shopTrim/guest/columns.js

@@ -15,7 +15,7 @@ const rules = {
 const formItem = {
   id: "",
   image:
-  "http://hwpro.test241.wanyuhengtong.com/storage/default/20230607/6c4b040420fb5a1d01837d0f120d60ec5c92ea62.jpg",
+  "http://hwpro.test241.wanyuhengtong.com/storage/default/20230629/adee46ee26342512293d7f340bc666475ba06674.png",
   name: "测试客房",
   area: "412",
   length: "1",

src/views/operate/shopTrim/picture/columns.js

@@ -10,7 +10,7 @@ const rules = {
 const formItem = {
   id: "",
   image:
-  "http://hwpro.test241.wanyuhengtong.com/storage/default/20230607/6c4b040420fb5a1d01837d0f120d60ec5c92ea62.jpg",
+  "http://hwpro.test241.wanyuhengtong.com/storage/default/20230629/adee46ee26342512293d7f340bc666475ba06674.png",
   name: "测试详情图",
 };
 const columns = [

src/views/operate/supplier/components/addEdit.vue

@@ -0,0 +1,336 @@
+<template>
+  <el-dialog
+    v-loading="loading"
+    :title="title"
+    :center="true"
+    align="left"
+    top="10vh"
+    width="600px"
+    :close-on-click-modal="false"
+    :visible.sync="showModelThis"
+    element-loading-text="拼命加载中"
+    element-loading-spinner="el-icon-loading"
+    element-loading-background="rgba(0, 0, 0, 0.8)"
+    @close="showModelThis = false"
+  >
+    <el-card style="margin-top: -20px">
+      <el-row :gutter="10">
+        <el-col :span="24">
+          <el-form
+            ref="ruleForm"
+            v-loading="loading"
+            :model="ruleForm"
+            status-icon
+            size="small"
+            :rules="rulesThis"
+            label-width="90px"
+            class="supplierAdd"
+          >
+            <el-row>
+              <el-col :span="24">
+                <el-form-item label="行业" prop="industry_id">
+                  <el-select
+                    v-model="ruleForm.industry_id"
+                    style="width: 100%"
+                    placeholder="请选择行业"
+                    @change="industry_id_change"
+                  >
+                    <el-option
+                      v-for="item in options"
+                      :key="item.id"
+                      :label="item.name"
+                      :value="item.id"
+                      :disabled="String(item.status) == '0'"
+                    >
+                    </el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :span="24">
+                <el-form-item label="资质情况" prop="need_permits">
+                  <el-select
+                    v-model="ruleForm.need_permits"
+                    style="width: 100%"
+                    placeholder="资质情况"
+                    :disabled="true"
+                  >
+                    <el-option
+                      v-for="item in reqOptions"
+                      :key="item.value"
+                      :label="item.label"
+                      :value="item.value"
+                    >
+                    </el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :span="24">
+                <el-form-item
+                  label="资质图片"
+                  prop="industry_img"
+                  class="activity-upload"
+                  style="margin: 0 0 22px 0"
+                >
+                  <div v-if="ruleForm.industry_img" class="img-find">
+                    <img
+                      v-viewer
+                      :src="ruleForm.industry_img"
+                      class="avatar hover fl"
+                      style="width: 86px; height: 86px"
+                    />
+                    <i
+                      class="el-icon-close img-close"
+                      v-if="!isDetail"
+                      @click="deleteimg()"
+                    />
+                  </div>
+                  <div v-else class="btnupload" style="network: relative">
+                    <i class="el-icon-plus avatar-uploader-icon" />
+                    <file-upload
+                      v-if="type !== 'view'"
+                      class="Upload"
+                      :disabled="isDetail"
+                      :accept="'.jpg,.png,.jpeg'"
+                      :multiple="true"
+                      :uploadcondition="beforeAvatarUpload"
+                      @UploadErrorEvent="imgUploadError"
+                      @UploadSuccessEvent="UploadSuccessEvent"
+                    />
+                  </div>
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </el-form>
+        </el-col>
+        <el-col :span="24" class="tr">
+          <el-button v-if="!isDetail" type="primary" @click="submitForm" :size="'mini'"
+            >保 存
+          </el-button>
+          <el-button @click="showModelThis = false" :size="'mini'">{{
+            isDetail ? "关 闭" : "取 消"
+          }}</el-button></el-col
+        >
+      </el-row>
+    </el-card>
+  </el-dialog>
+  <!-- <map-modal :visible.sync="visible1" :toponym="toponym" @save="handleMapSelection" /> -->
+</template>
+<script>
+import asyncRequest from "@/apis/service/serviceParam/industry";
+// import { formItem, rules, parmValue } from "./columns";
+// import MapModal from "./mapModal.vue"
+const formItem = {
+  industry_id: "",
+  industry_id_name: "",
+  need_permits: "1",
+  industry_img: "",
+};
+export default {
+  name: "shop",
+  props: ["showModel", "editSitem", "editIndex"],
+  data() {
+    return {
+      parmValue: {
+        limit: 15,
+        name: "",
+        page: 1,
+        size: 15,
+        status: "",
+      },
+      loading: false,
+      visible1: false,
+      toponym: "",
+      options: [],
+      reqOptions: [
+        {
+          value: "1",
+          label: "需要上传资质",
+        },
+        {
+          value: "0",
+          label: "不需要上传资质",
+        },
+      ],
+      title: "添加客房",
+      showModelThis: this.showModel,
+      ruleForm: {},
+
+      rules: {
+        industry_id: [{ required: true, message: "请选择行业", trigger: "change" }],
+        need_permits: [{ required: true, message: "请选择资质情况", trigger: "change" }],
+        industry_img: [{ required: true, message: "请上传资质图片", trigger: "change" }],
+      },
+      rulesThis: this.rules,
+    };
+  },
+  watch: {
+    showModel: function (val) {
+      this.showModelThis = val;
+      if (val) {
+        this.initForm();
+      }
+    },
+    showModelThis(val) {
+      if (!val) {
+        this.$emit("cancel");
+      }
+    },
+  },
+  mounted() {
+    this.ruleForm = {
+      ...formItem,
+    };
+  },
+  methods: {
+    async initForm() {
+      this.loading = true;
+      if (this.editIndex === -1) {
+        this.title = "添加行业";
+      } else {
+        this.title = "修改行业";
+      }
+      this.rulesThis = this.rules;
+      await this.resetForm();
+      await this.searchTypeList();
+      this.loading = false;
+    },
+    industry_id_change() {
+      const { industry_id } = this.ruleForm;
+      let index = this.options.findIndex((s) => String(s.id) === String(industry_id));
+      if (index !== -1) {
+        this.ruleForm.need_permits = String(this.options[index].need_permits);
+        this.ruleForm.industry_id_name = this.options[index].name;
+      } else {
+        this.ruleForm.need_permits = "1";
+        this.ruleForm.industry_id_name = "";
+      }
+      this.rulesThis.industry_img[0].required =
+        String(this.ruleForm.need_permits) === "1";
+    },
+
+    async resetForm() {
+      // 重置
+      await this.$nextTick(() => {
+        if (this.$refs.ruleForm) {
+          this.$refs.ruleForm.resetFields();
+          this.$refs.ruleForm.clearValidate();
+          // console.log(this.editSitem);
+          if (this.editSitem && this.editSitem.id) {
+            const { industry_id, need_permits, industry_img } = this.editSitem;
+            this.ruleForm = {
+              industry_id: industry_id || "",
+              need_permits: need_permits || "1",
+              industry_img: industry_img || "",
+            };
+          } else {
+            this.ruleForm = {
+              ...formItem,
+            };
+          }
+        }
+      });
+    },
+    async submitForm() {
+      await this.$refs.ruleForm.validate(async (valid) => {
+        if (valid) {
+          if (!this.loading) {
+            this.loading = true;
+            let model = JSON.parse(JSON.stringify(this.ruleForm));
+            model.editIndex = this.editIndex;
+            this.loading = false;
+            this.$emit("refresh", model);
+            this.showModelThis = false;
+          }
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+    // 刷新表格
+    async searchTypeList() {
+      const { code, data } = await asyncRequest.list(this.parmValue);
+      this.options = code === 1 ? data.list : [];
+    },
+
+    deleteimg() {
+      this.ruleForm.industry_img = "";
+      this.$refs.ruleForm.validateField("industry_img");
+    },
+
+    // 图片上传成功
+    async UploadSuccessEvent(data) {
+      const { url } = data;
+      console.log(url);
+      if (url === "noToken") {
+        await this.logout();
+      } else {
+        this.ruleForm.industry_img = url;
+        this.$refs.ruleForm.validateField("industry_img");
+      }
+    },
+
+    // 图片上传失败
+    imgUploadError(res) {
+      if (res !== "break") {
+        this.$message.error("图片上传失败!");
+        this.$refs.ruleForm.validateField("industry_img");
+      }
+    },
+    // 判断图片规格
+    beforeAvatarUpload(file) {
+      let isJPG = false;
+      if (
+        file.type === "image/jpg" ||
+        file.type === "image/png" ||
+        file.type === "image/jpeg"
+      ) {
+        isJPG = true;
+      }
+      const isLt2M = file.size / 1024 / 1024 < 1;
+      if (!isJPG) {
+        this.$message.error("图片格式不正确！");
+      }
+      if (!isLt2M) {
+        this.$message.error("图片大小不能超过 1MB!");
+      }
+      return isJPG && isLt2M;
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.btnupload {
+  width: 86px;
+  height: 86px;
+  line-height: 86px;
+}
+.avatar-uploader-icon {
+  width: 86px;
+  height: 86px;
+  line-height: 86px;
+}
+.img-find {
+  position: relative;
+  width: 86px;
+  height: 86px;
+  line-height: 86px;
+  &:hover {
+    .img-close {
+      color: #409eff;
+    }
+  }
+}
+.img-close {
+  position: absolute;
+  top: 0;
+  right: 0;
+  font-size: 18px;
+  font-weight: lighter;
+  z-index: 999999;
+  &:hover {
+    cursor: pointer;
+  }
+}
+</style>

src/views/operate/supplier/components/baseForm.vue

@@ -1,297 +1,365 @@
 <template>
-  <el-form
-    ref="ruleForm"
-    v-loading="loading"
-    :model="ruleForm"
-    status-icon
-    :rules="rulesThis"
-    :size="'small'"
-    label-width="100px"
-    class="supplierAdd"
-  >
-    <el-row>
-      <el-col :span="24" style="margin-bottom: 10px"
-        ><div class="supplierAdd-title" style="margin: 6px 0 0 10px">
-          基础信息
-        </div></el-col
-      >
-      <el-col :span="8">
-        <el-form-item label="供应商性质" prop="supplier_type">
-          <el-select
-            v-model="ruleForm.supplier_type"
-            style="width: 100%"
-            :disabled="type !== 'add' && type !== 'edit'"
-            placeholder="供应商性质"
-          >
-            <el-option
-              v-for="item in natureOfSupplierList"
-              :key="item.value"
-              :label="item.label"
-              :value="item.value"
-            />
-          </el-select>
-        </el-form-item>
-      </el-col>
-      <el-col :span="8">
-        <el-form-item label="供应商来源" prop="source">
-          <el-select
-            v-model="ruleForm.source"
-            style="width: 100%"
-            :disabled="type !== 'add' && type !== 'edit'"
-            placeholder="供应商来源"
-          >
-            <el-option
-              v-for="item in sourceoptions"
-              :key="item.value"
-              :label="item.label"
-              :value="item.value"
-            />
-          </el-select>
-        </el-form-item>
-      </el-col>
-
-      <el-col :span="8">
-        <el-form-item label="有效期至" prop="expiretime">
-          <el-date-picker
-            style="width: 100%"
-            value-format="yyyy-MM-DD HH:mm:ss"
-            :disabled="type !== 'add' && type !== 'edit'"
-            v-model="ruleForm['expiretime']"
-            placeholder="有效期"
-          />
-        </el-form-item>
-      </el-col>
-
-      <el-col :span="8">
-        <el-form-item label="付款方式" prop="pay_type">
-          <el-select
-            v-model="ruleForm.pay_type"
-            style="width: 100%"
-            :disabled="type !== 'add' && type !== 'edit'"
-            placeholder="付款方式"
-          >
-            <el-option
-              v-for="item in pay_typeoptions"
-              :key="item.value"
-              :label="item.label"
-              :value="item.value"
-            />
-          </el-select>
-        </el-form-item>
-      </el-col>
-      <el-col :span="8">
-        <el-form-item
-          label="营业执照"
-          prop="license_img"
-          :disabled="id == 'view'"
-          class="activity-upload"
+  <div>
+    <el-form
+      ref="ruleForm"
+      v-loading="loading"
+      :model="ruleForm"
+      status-icon
+      :rules="rulesThis"
+      :size="'small'"
+      label-width="85px"
+      class="supplierAdd"
+    >
+      <el-row>
+        <el-col :span="24" style="margin: -20px 0 0 0"
+          ><div class="supplierAdd-title">基础信息</div></el-col
         >
-          <div v-if="ruleForm.license_img" class="img-find">
-            <img
-              v-viewer
-              :src="ruleForm.license_img"
-              class="avatar hover fl"
-              style="width: 50px; height: 50px"
-            />
-            <el-link
-              v-if="type !== 'view'"
-              class="fl"
-              :underline="false"
-              type="warning"
-              style="margin: 0 0 0 16px"
-              @click="deleteimg()"
-              >删除</el-link
-            >
-          </div>
-          <div v-else class="btnupload" style="position: relative">
-            <i class="el-icon-plus avatar-uploader-icon" />
-            <file-upload
-              v-if="type !== 'view'"
-              class="Upload"
-              :disabled="type !== 'add' && type !== 'edit'"
-              :accept="'.jpg,.png,.jpeg'"
-              :multiple="true"
-              :uploadcondition="beforeAvatarUpload"
-              @UploadErrorEvent="UploadErrorEvent($event, imageProp)"
-              @UploadSuccessEvent="UploadSuccessEvent($event, imageProp)"
-            />
-          </div>
-        </el-form-item>
-      </el-col>
+        <el-col :span="24">
+          <el-row>
+            <el-col :span="4" style="width: 160px">
+              <el-form-item
+                label="营业执照"
+                prop="license_img"
+                :disabled="id == 'view'"
+                class="activity-upload"
+              >
+                <div v-if="ruleForm.license_img" class="img-find">
+                  <img
+                    v-viewer
+                    :src="ruleForm.license_img"
+                    class="avatar hover fl"
+                    style="width: 50px; height: 50px"
+                  />
+                  <el-link
+                    v-if="type !== 'view'"
+                    class="fl"
+                    :underline="false"
+                    type="warning"
+                    style="margin: 0 0 0 16px"
+                    @click="deleteimg()"
+                    >删除</el-link
+                  >
+                </div>
+                <div v-else class="btnupload" style="position: relative">
+                  <i class="el-icon-plus avatar-uploader-icon" />
+                  <file-upload
+                    v-if="type !== 'view'"
+                    class="Upload"
+                    :disabled="type !== 'add' && type !== 'edit'"
+                    :accept="'.jpg,.png,.jpeg'"
+                    :multiple="true"
+                    :uploadcondition="beforeAvatarUpload"
+                    @UploadErrorEvent="UploadErrorEvent($event, imageProp)"
+                    @UploadSuccessEvent="UploadSuccessEvent($event, imageProp)"
+                  />
+                </div>
+              </el-form-item>
+            </el-col>
+            <el-col :span="20" style="width: calc(100% - 160px)">
+              <el-row>
+                <el-col :span="6">
+                  <el-form-item label="有效期至" prop="expiretime">
+                    <el-date-picker
+                      style="width: 100%"
+                      value-format="yyyy-MM-DD HH:mm:ss"
+                      :disabled="type !== 'add' && type !== 'edit'"
+                      v-model="ruleForm['expiretime']"
+                      placeholder="有效期"
+                    />
+                  </el-form-item>
+                </el-col>
+                <el-col :span="6">
+                  <el-form-item label="公司性质" prop="supplier_type">
+                    <el-select
+                      v-model="ruleForm.supplier_type"
+                      style="width: 100%"
+                      :disabled="type !== 'add' && type !== 'edit'"
+                      placeholder="公司性质"
+                    >
+                      <el-option
+                        v-for="item in natureOfSupplierList"
+                        :key="item.value"
+                        :label="item.label"
+                        :value="item.value"
+                      />
+                    </el-select>
+                  </el-form-item>
+                </el-col>
+                <el-col :span="6">
+                  <el-form-item label="公司来源" prop="source">
+                    <el-select
+                      v-model="ruleForm.source"
+                      style="width: 100%"
+                      :disabled="type !== 'add' && type !== 'edit'"
+                      placeholder="公司来源"
+                    >
+                      <el-option
+                        v-for="item in sourceoptions"
+                        :key="item.value"
+                        :label="item.label"
+                        :value="item.value"
+                      />
+                    </el-select>
+                  </el-form-item>
+                </el-col>
 
-      <el-col :span="24"><div class="supplierAdd-title">行业信息</div></el-col>
-      <table-editor
-        mode="modal"
-        :readonly="type !== 'add' && type !== 'edit'"
-        title="行业"
-        :columns="columns"
-        :rules="tableRules"
-        ref="editor"
-        :data.sync="ruleForm.industry"
-        @row-update="handleRowUpdate"
-      />
+                <el-col :span="6">
+                  <el-form-item label="付款方式" prop="pay_type">
+                    <el-select
+                      v-model="ruleForm.pay_type"
+                      style="width: 100%"
+                      :disabled="type !== 'add' && type !== 'edit'"
+                      placeholder="付款方式"
+                    >
+                      <el-option
+                        v-for="item in pay_typeoptions"
+                        :key="item.value"
+                        :label="item.label"
+                        :value="item.value"
+                      />
+                    </el-select>
+                  </el-form-item>
+                </el-col>
+                <el-col :span="6">
+                  <el-form-item label="姓名" prop="contactor">
+                    <el-input
+                      v-model="ruleForm.contactor"
+                      :disabled="type !== 'add' && type !== 'edit'"
+                      placeholder="姓名"
+                      maxlength="20"
+                    />
+                  </el-form-item>
+                </el-col>
+                <el-col :span="6">
+                  <el-form-item label="手机号" prop="mobile">
+                    <el-input
+                      v-model="ruleForm.mobile"
+                      :disabled="type !== 'add' && type !== 'edit'"
+                      placeholder="手机号"
+                      maxlength="11"
+                    />
+                  </el-form-item>
+                </el-col>
+                <el-col :span="6">
+                  <el-form-item label="电子邮箱" prop="email">
+                    <el-input
+                      v-model="ruleForm.email"
+                      :disabled="type !== 'add' && type !== 'edit'"
+                      placeholder="电子邮箱"
+                      maxlength="50"
+                    />
+                  </el-form-item>
+                </el-col>
 
-      <el-col :span="24"><div class="supplierAdd-title">联系人信息</div></el-col>
-      <el-col :span="8">
-        <el-form-item label="姓名" prop="contactor">
-          <el-input
-            v-model="ruleForm.contactor"
-            :disabled="type !== 'add' && type !== 'edit'"
-            placeholder="姓名"
-            maxlength="20"
-          />
-        </el-form-item>
-      </el-col>
-      <el-col :span="8">
-        <el-form-item label="手机号" prop="mobile">
-          <el-input
-            v-model="ruleForm.mobile"
-            :disabled="type !== 'add' && type !== 'edit'"
-            placeholder="手机号"
-            maxlength="11"
-          />
-        </el-form-item>
-      </el-col>
-      <el-col :span="8">
-        <el-form-item label="电子邮箱" prop="email">
-          <el-input
-            v-model="ruleForm.email"
-            :disabled="type !== 'add' && type !== 'edit'"
-            placeholder="电子邮箱"
-            maxlength="50"
-          />
-        </el-form-item>
-      </el-col>
+                <el-col :span="6">
+                  <el-form-item label="职位" prop="position">
+                    <el-input
+                      v-model="ruleForm.position"
+                      :disabled="type !== 'add' && type !== 'edit'"
+                      placeholder="职位"
+                      maxlength="20"
+                    />
+                  </el-form-item>
+                </el-col>
+              </el-row>
+            </el-col>
+          </el-row>
+        </el-col>
 
-      <el-col :span="8">
-        <el-form-item label="职位" prop="position">
-          <el-input
-            v-model="ruleForm.position"
-            :disabled="type !== 'add' && type !== 'edit'"
-            placeholder="职位"
-            maxlength="20"
-          />
-        </el-form-item>
-      </el-col>
-      <el-col :span="24"> <div class="supplierAdd-title">营业执照信息</div></el-col>
+        <el-col :span="24" style="margin: -42px 0 0 0"
+          ><div class="supplierAdd-title">行业信息</div></el-col
+        >
+        <el-col :span="24">
+          <el-form-item label-width="0px" prop="industry">
+            <el-table
+              :data="ruleForm.industry"
+              size="mini"
+              border
+              stripe
+              style="width: 100%"
+            >
+              <el-table-column prop="industry_id_name" label="所在行业">
+              </el-table-column>
+              <!-- <el-table-column prop="need_permits" label="资质情况"> </el-table-column> -->
+              <el-table-column prop="industry_img" label="资质图片">
+                <template slot-scope="scope">
+                  <div
+                    v-if="scope.row.industry_img"
+                    style="width: 20px; height: 20px"
+                    class="hover"
+                    v-viewer
+                  >
+                    <img
+                      :src="scope.row.industry_img"
+                      style="display: inline-block; width: 100%; height: 100%"
+                      alt=""
+                    />
+                  </div>
+                </template>
+              </el-table-column>
+              <el-table-column fixed="right" width="100">
+                <template slot="header" slot-scope="scope">
+                  <span>操作</span>
+                  <el-tooltip :effect="'dark'" :content="'添加'">
+                    <i
+                      class="el-icon-circle-plus-outline tb-icon"
+                      style="margin: 3px 0 0 5px"
+                      @click="industryEdit(-1, {})"
+                    />
+                  </el-tooltip>
+                </template>
+                <template slot-scope="scope">
+                  <el-tooltip effect="dark" content="修改" placement="top">
+                    <i
+                      class="el-icon-edit tb-icon"
+                      @click="industryEdit(scope.$index, scope.row)"
+                    ></i>
+                  </el-tooltip>
+                  <el-tooltip effect="dark" content="删除" placement="top">
+                    <i
+                      class="el-icon-delete tb-icon"
+                      @click="industryDel(scope.$index)"
+                    ></i>
+                  </el-tooltip>
+                </template>
+              </el-table-column>
+            </el-table>
+          </el-form-item>
+        </el-col>
 
-      <el-col :span="8" v-if="!ruleForm.license_img">
-        <el-form-item label="注册号" prop="registercode" label-width="140px">
-          <el-input
-            v-model="ruleForm.registercode"
-            :disabled="type == 'view'"
-            placeholder="注册号"
-            maxlength="18"
-          />
-        </el-form-item>
-      </el-col>
+        <el-col :span="24"> <div class="supplierAdd-title">营业执照信息</div></el-col>
 
-      <el-col :span="16">
-        <el-form-item label="供应商名称" prop="name">
-          <el-input
-            v-model="ruleForm.name"
-            :disabled="type !== 'add' && type !== 'edit'"
-            placeholder="供应商名称"
-            maxlength="50"
-          />
-        </el-form-item>
-      </el-col>
+        <el-col :span="16">
+          <el-form-item label="公司名称" prop="name">
+            <el-input
+              v-model="ruleForm.name"
+              :disabled="type !== 'add' && type !== 'edit'"
+              placeholder="公司名称"
+              maxlength="50"
+            />
+          </el-form-item>
+        </el-col>
+        <el-col :span="8" v-if="!ruleForm.license_img">
+          <el-form-item label="统一社会信用代码" prop="registercode" label-width="140px">
+            <el-input
+              v-model="ruleForm.registercode"
+              :disabled="type == 'view'"
+              placeholder="统一社会信用代码"
+              maxlength="18"
+            />
+          </el-form-item>
+        </el-col>
 
-      <el-col
-        :span="8"
-        v-if="
-          (ruleForm.license_img === '' && (type === 'add' || type == 'edit')) ||
-          type == 'view'
-        "
-      >
-        <el-form-item label="公司类型" prop="nature">
-          <el-select
-            v-model="ruleForm.nature"
-            style="width: 100%"
-            placeholder="公司类型"
-            :disabled="type !== 'add' && type !== 'edit'"
-          >
-            <el-option
-              v-for="option in supplier_typeoptions"
-              :key="option.value"
-              :value="option.value"
-              :label="option.label"
+        <el-col
+          :span="8"
+          v-if="
+            (ruleForm.license_img === '' && (type === 'add' || type == 'edit')) ||
+            type == 'view'
+          "
+        >
+          <el-form-item label="公司类型" prop="nature">
+            <search-company-type
+              :value="ruleForm.nature"
+              :disabled="type == 'view'"
+              :size="'small'"
+              :is-detail="false"
+              :placeholder="'公司类型'"
+              @searchChange="type_search_change"
+            />
+          </el-form-item>
+        </el-col>
+        <el-col
+          :span="8"
+          v-if="
+            (ruleForm.license_img === '' && (type === 'add' || type == 'edit')) ||
+            type == 'view'
+          "
+        >
+          <el-form-item label="法人代表" prop="legaler">
+            <el-input
+              v-model="ruleForm.legaler"
+              :disabled="type == 'view'"
+              placeholder="法人代表"
+              maxlength="20"
             />
-          </el-select>
-        </el-form-item>
-      </el-col>
-      <el-col :span="8"   v-if="
-          (ruleForm.license_img === '' && (type === 'add' || type == 'edit')) ||
-          type == 'view'
-        ">
-        <el-form-item label="法人代表" prop="legaler">
-          <el-input
-            v-model="ruleForm.legaler"
-            :disabled="type == 'view'"
-            placeholder="法人代表"
-            maxlength="20"
-          />
-        </el-form-item>
-      </el-col>
+          </el-form-item>
+        </el-col>
 
-      <el-col :span="8"   v-if="
-          (ruleForm.license_img === '' && (type === 'add' || type == 'edit')) ||
-          type == 'view'
-        " >
-        <el-form-item label="成立日期" prop="registertime">
-          <el-date-picker
-            style="width: 100%"
-            v-model="ruleForm['registertime']"
-            placeholder="成立日期"
-            :disabled="type == 'view'"
-            value-format="yyyy-MM-DD HH:mm:ss"
-          />
-        </el-form-item>
-      </el-col>
-      <el-col :span="24"   v-if="
-          (ruleForm.license_img === '' && (type === 'add' || type == 'edit')) ||
-          type == 'view'
-        ">
-        <el-form-item label="详细地址" prop="register_addr">
-          <el-input
-            v-model="ruleForm.register_addr"
-            :disabled="type == 'view'"
-            placeholder="详细地址"
-            maxlength="200"
-          />
-        </el-form-item>
-      </el-col>
+        <el-col
+          :span="8"
+          v-if="
+            (ruleForm.license_img === '' && (type === 'add' || type == 'edit')) ||
+            type == 'view'
+          "
+        >
+          <el-form-item label="成立日期" prop="registertime">
+            <el-input
+              v-model="ruleForm.registertime"
+              :disabled="type == 'view'"
+              placeholder="成立日期"
+              maxlength="50"
+            />
+          </el-form-item>
+        </el-col>
+        <el-col
+          :span="24"
+          v-if="
+            (ruleForm.license_img === '' && (type === 'add' || type == 'edit')) ||
+            type == 'view'
+          "
+        >
+          <el-form-item label="详细地址" prop="register_addr">
+            <el-input
+              v-model="ruleForm.register_addr"
+              :disabled="type == 'view'"
+              placeholder="详细地址"
+              maxlength="200"
+            />
+          </el-form-item>
+        </el-col>
 
-      <el-col :span="24"   v-if="
-          (ruleForm.license_img === '' && (type === 'add' || type == 'edit')) ||
-          type == 'view'
-        ">
-        <el-form-item label="运营范围" prop="scope">
-          <el-input
-            v-model="ruleForm.scope"
-            :autosize="{ minRows: 6, maxRows: 6 }"
-            type="textarea"
-            :disabled="type == 'view'"
-            placeholder="运营范围"
-            maxlength="5000"
-            show-word-limit
-          />
-        </el-form-item>
-      </el-col>
+        <el-col
+          :span="24"
+          v-if="
+            (ruleForm.license_img === '' && (type === 'add' || type == 'edit')) ||
+            type == 'view'
+          "
+        >
+          <el-form-item label="运营范围" prop="scope">
+            <el-input
+              v-model="ruleForm.scope"
+              :autosize="{ minRows: 6, maxRows: 6 }"
+              type="textarea"
+              :disabled="type == 'view'"
+              placeholder="运营范围"
+              maxlength="5000"
+              show-word-limit
+            />
+          </el-form-item>
+        </el-col>
 
-      <el-col
-        v-if="type === 'add' || type === 'edit'"
-        :span="24"
-        style="text-align: right"
-      >
-        <el-button type="primary" :size="'small'" @click="submitForm">保 存 </el-button>
-      </el-col>
-    </el-row>
-  </el-form>
+        <el-col
+          v-if="type === 'add' || type === 'edit'"
+          :span="24"
+          style="text-align: right"
+        >
+          <el-button type="primary" :size="'small'" @click="submitForm">保 存 </el-button>
+        </el-col>
+      </el-row>
+    </el-form>
+    <add-edit
+      :editSitem="editSitem"
+      :editIndex="editIndex"
+      :show-model="showModel"
+      @refresh="addRefresh"
+      @cancel="showModel = false"
+    />
+  </div>
 </template>
 <script>
 import asyncRequest from "@/apis/service/operate/supplier";
 import resToken from "@/mixins/resToken";
+import addEdit from "./addEdit.vue";
 import {
   isLicense,
   isMobile,
@@ -324,7 +392,9 @@ import {
 export default {
   name: "SupplierAdd",
   mixins: [resToken],
-  props: ["showModel", "id", "type", "sitem"],
+  props: ["id", "type", "sitem"],
+
+  components: { addEdit },
   data() {
     const validateLicense = (rule, value, callback) => {
       if (value !== "") {
@@ -375,6 +445,9 @@ export default {
       }
     };
     return {
+      showModel: false,
+      editIndex: "-1",
+      editSitem: null,
       loading: false,
       hand_name: "",
       sourceoptions: [
@@ -382,20 +455,7 @@ export default {
         { value: "2", label: "供应商" },
         { value: "3", label: "公司开发" },
       ],
-      typeoptions: [
-        { value: "0", label: "正式供应商" },
-        { value: "1", label: "临时供应商" },
-      ],
-      categoryoptions: [
-        { value: "0", label: "单品类供应商" },
-        { value: "1", label: "多品类供应商" },
-      ],
-      supplier_typeoptions: [
-        { value: "1", label: "股份" },
-        { value: "2", label: "有限" },
-        { value: "3", label: "独资" },
-        { value: "4", label: "合伙" },
-      ],
+
       leveloptions: [
         { value: "2", label: "生产厂家" },
         { value: "0", label: "一级代理商" },
@@ -411,51 +471,7 @@ export default {
         { id: "1", label: "识别成功" },
         { id: "2", label: "识别失败" },
       ],
-      columns: [
-        {
-          prop: "industry_id",
-          label: "请选择行业",
-          type: "select",
-          options: [],
-        },
-        {
-          prop: "industry_img",
-          label: "行业资质",
-          type: "select",
-          options: [
-            { label: "需要", value: "1" },
-            { label: "不需要", value: "0" },
-          ],
-        },
-        {
-          prop: "image",
-          label: "行业资质图片",
-          type: "image",
-        },
-      ],
-      tableRules: {
-        industry_id: [
-          {
-            required: true,
-            trigger: "change",
-            message: "请选择行业",
-          },
-        ],
-        industry_img: [
-          {
-            required: true,
-            trigger: "change",
-            message: "请选择行业资质",
-          },
-        ],
-        image: [
-          {
-            required: true,
-            trigger: "blur",
-            message: "请上传行业资质图片",
-          },
-        ],
-      },
+
       title: "添加供应商",
       showModelThis: this.showModel,
       pickerOptions: {
@@ -480,10 +496,19 @@ export default {
         category: [{ required: true, message: "请选择所属类别", trigger: "change" }],
         level: [{ required: true, message: "请选择供应商级别", trigger: "change" }],
         pay_type: [{ required: true, message: "请选择付款方式", trigger: "change" }],
+
         contactor: [{ required: true, message: "姓名不能为空", trigger: "blur" }],
         mobile: [{ required: true, validator: validatemobile, trigger: "blur" }],
         email: [{ required: true, validator: validateEmail, trigger: "blur" }],
         position: [{ required: true, message: "职位不能为空", trigger: "blur" }],
+        industry: [
+          {
+            type: "array",
+            required: true,
+            message: "至少选择一个行业",
+            trigger: "change",
+          },
+        ],
         registercode: [{ required: true, validator: validateLicense, trigger: "blur" }],
         name: [{ required: true, message: "供应商名称不能为空", trigger: "blur" }],
         nature: [{ required: true, message: "公司类型不能为空", trigger: "change" }],
@@ -492,6 +517,7 @@ export default {
         registertime: [
           { required: true, message: "成立时间不能为空", trigger: "change" },
         ],
+        scope: [{ required: true, message: "不能为空", trigger: "blur" }],
       },
     };
   },
@@ -544,7 +570,7 @@ export default {
       this.ruleForm = {
         id: id || "",
         expiretime: expiretime || "",
-        industry: industry_info,
+        industry: industry_info || [],
         source: source || "",
         supplier_type: supplier_type || "",
         pay_type: pay_type || "",
@@ -562,19 +588,20 @@ export default {
         scope: scope || "",
       };
     },
+    industryEdit(type, row) {
+      this.editIndex = type;
+      this.editSitem = row;
+      this.showModel = true;
+    },
+    industryDel(index) {
+      this.ruleForm.industry.splice(index, 1);
+      this.$refs.ruleForm.validateField("industry");
+    },
     closeImg(index) {
       this.ruleForm.license_img.splice(index, 1);
       this.$refs.ruleForm.validateField("license_img");
     },
-    handleRowUpdate({ row }) {
-      console.log(row);
-      this.tableRules.image = [
-        {
-          ...this.tableRules.image[0],
-          required: row.industry_img === "1",
-        },
-      ];
-    },
+
     async submitForm() {
       await this.$refs.ruleForm.validate(async (valid) => {
         if (valid) {
@@ -583,7 +610,6 @@ export default {
           }
           this.loading = true;
           const model = JSON.parse(JSON.stringify(this.ruleForm));
-          // model.license_img = model.license_img.toString()
 
           const mapProps = {
             contact: ["contactor", "mobile", "email", "position"],
@@ -596,7 +622,7 @@ export default {
               delete model[property];
             });
           });
-
+          console.log(model);
           let res = {};
           if (this.id === "add") {
             delete model["id"];
@@ -621,21 +647,23 @@ export default {
         }
       });
     },
+    addRefresh(e) {
+      const { editIndex } = e;
+      if (editIndex === -1) {
+        this.ruleForm.industry.push(e);
+      } else {
+        this.ruleForm.industry[editIndex] = e;
+      }
+      this.$refs.ruleForm.validateField("industry");
+    },
     deleteimg() {
       this.ruleForm.license_img = "";
       this.$refs.ruleForm.validateField("license_img");
     },
-    handleHandoverName(e) {
-      // if (e && e.id) {
-      //   this.ruleForm.personid = [e.id]
-      // } else {
-      //   this.ruleForm.personid = []
-      // }
-      // this.$refs.ruleForm.validateField('personid')
-    },
+
     type_search_change(e) {
-      const { id } = e;
-      this.ruleForm.nature = id || "";
+      const { nature } = e;
+      this.ruleForm.nature = nature || "";
       this.$refs.ruleForm.validateField("nature");
     },
     // 图片上传成功
@@ -654,7 +682,6 @@ export default {
           this.ruleForm.license_img.push(url);
           this.$refs.ruleForm.validateField("license_img");
         }
-        
       }
     },
     // 图片上传失败
@@ -699,7 +726,6 @@ export default {
       } else {
         this.ruleForm[key] = url;
         this.$refs.ruleForm.validateField(key);
-        
       }
     },
     UploadErrorEvent(res, key = "license_img") {
@@ -708,14 +734,6 @@ export default {
         this.$refs.ruleForm.validateField(key);
       }
     },
-    async onSubmit() {
-      try {
-        await this.$refs.ruleForm.validate();
-        this.$emit("confirm", this.ruleForm);
-      } catch (err) {
-        console.log(err);
-      }
-    },
   },
 };
 </script>
@@ -761,7 +779,7 @@ export default {
   }
   .supplierAdd-title {
     border-left: 5px solid #006eff;
-    margin: 6px 0 25px 10px;
+    margin: 20px 0 20px 10px;
     width: 100%;
     box-sizing: border-box;
     padding: 0 0 0 10px;

src/views/operate/supplier/components/industryModal.vue

@@ -1,97 +0,0 @@
-<template>
-  <el-dialog :visible="_visible" center @close="handleClose" title="设置行业" append-to-body>
-    <table-editor mode="modal" title="行业" :columns="columns" :rules="rules" ref="editor" :data.sync="data" @rowUpdate="handleRowUpdate">
-      <el-button type="primary" size="mini"  @click="onSave">保存</el-button>
-    </table-editor>
-  </el-dialog>
-</template>
-
-<script>
-export default {
-  props:['visible'],
-  computed:{
-    _visible:{
-      get(){
-        return this.visible
-      },
-      set(newVal){
-        if(!newVal) this.$refs.editor.update([])
-        this.$emit("update:visible", newVal)
-      }
-    }
-  },
-  data(){
-    return {
-      data:[],
-      columns:[
-        {
-          prop:'industry',
-          label:'请选择行业',
-          type:'select',
-          options:[]
-        },
-        {
-          prop: 'qualification',
-          label:'行业资质',
-          type:'select',
-          options:[
-            {label:'需要',value:'1'},
-            {label:'不需要',value:'0'},
-          ]
-        },
-        {
-          prop:'image',
-          label:"行业资质图片",
-          type:'image'
-        }
-      ],
-      rules:{
-        industry:[
-          {
-            required:true,
-            trigger:'change',
-            message:'请选择行业'
-          },
-        ],
-        qualification:[
-          {
-            required:true,
-            trigger:'change',
-            message:'请选择行业资质'
-          }
-        ],
-        image:[
-          {
-            required:true,
-            trigger:'blur',
-            message:'请上传行业资质图片'
-          }
-        ]
-      }    
-    }
-  },
-  mounted(){
-    this.$set(this.columns,0,{
-      ...this.columns[0],
-       options:[
-          {label:'需要',value:'1'},
-          {label:'不需要',value:'0'},
-        ]
-    })
-  },
-  methods:{
-    handleClose(){
-      this._visible = false
-    },
-    handleRowUpdate({row}){
-      this.rules.image = [{
-        ...this.rules.image[0],
-        required:row.qualification === "1"
-      }]
-    },
-    onSave(){
-      console.log(this.data)
-    }
-  }
-}
-</script>

src/views/operate/supplier/index.vue

@@ -220,7 +220,6 @@
       </template>
     </ex-table>
 
-    <industry-modal :visible.sync="modalVisible.industry" />
     <service-charge-modal
       :visible.sync="modalVisible.service"
       :row="currentRow"
@@ -246,7 +245,6 @@ import mixinPage from "@/mixins/elPaginationHandle";
 import { mapGetters } from "vuex";
 import resToken from "@/mixins/resToken";
 
-import IndustryModal from "./components/industryModal.vue";
 import ServiceChargeModal from "./components/serviceChargeModal.vue";
 import ToPublicModal from "./components/toPublicModal.vue";
 import SupplierLevelModal from "./components/supplierLevelModal.vue";
@@ -266,7 +264,7 @@ import { supplierLevelList } from "./columns";
 export default {
   name: "supplier",
   mixins: [mixinPage, resToken],
-  components: { IndustryModal, ServiceChargeModal, ToPublicModal, SupplierLevelModal },
+  components: { ServiceChargeModal, ToPublicModal, SupplierLevelModal },
   computed: {
     //组件SIZE设置
     ...mapGetters(["tablebtnSize", "searchSize", "size"]),