build

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

@@ -21,20 +21,20 @@
 </template>
 
 <script>
-import asyncRequest from "@/apis/components/search-work-company";
-import resToken from "@/mixins/resToken";
+import asyncRequest from '@/apis/components/search-work-company'
+import resToken from '@/mixins/resToken'
 export default {
-  name: "SearchWorkCompany",
+  name: 'SearchWorkCompany',
   mixins: [resToken],
   props: [
-    "size",
-    "value",
-    "placeholder",
-    "isDetail",
-    "disabled",
-    "type",
-    "names",
-    "is_show",
+    'size',
+    'value',
+    'placeholder',
+    'isDetail',
+    'disabled',
+    'type',
+    'names',
+    'is_show'
   ],
   /**
    * 属性集合
@@ -53,47 +53,49 @@ export default {
     return {
       options: [],
       selectLoading: false,
-      searchName: "",
-    };
+      searchName: ''
+    }
   },
   mounted() {
-    this.options = [];
-    this.selectLoading = false;
-    this.remoteMethod();
+    this.options = []
+    this.selectLoading = false
+    this.remoteMethod()
   },
   methods: {
     async selectChange(e) {
       // console.log(e);
-      let index = this.options.findIndex((v) => v.companyNo === e);
+      const index = this.options.findIndex((v) => v.companyNo === e)
       if (index !== -1) {
-        let model = {
+        const model = {
           id: this.options[index].id,
           code: this.options[index].companyNo,
-          label: this.options[index].company,
-        };
-        this.$emit("searchChange", model);
+          label: this.options[index].company
+        }
+        this.$emit('searchChange', model)
       } else {
-        this.$emit("searchChange", {});
+        this.$emit('searchChange', {})
       }
     },
     async remoteMethod() {
-      this.selectLoading = true;
+      this.selectLoading = true
       const { code, data, message } = await asyncRequest.list({
-        is_show:this.is_show?this.is_show:'1'
-      });
+        is_show: this.is_show ? this.is_show : '1',
+        size: '999'
+      })
+
       if (code === 0) {
-        const { list } = data;
-        this.options = list || [];
+        const { list } = data
+        this.options = list || []
       } else if (code >= 100 && code <= 104) {
-        await this.logout();
+        await this.logout()
       } else {
-        this.$message.warning(message);
+        this.$message.warning(message)
       }
 
-      this.selectLoading = false;
-    },
-  },
-};
+      this.selectLoading = false
+    }
+  }
+}
 </script>
 
 <style>

src/views/interest/account/addEditDepart.vue

@@ -49,7 +49,7 @@
               </el-col>
 
               <el-col :span="24">
-                <el-form-item label="业务公司">
+                <el-form-item label="业务公司" required>
                   <search-work-company
                     :value="companyNo"
                     :placeholder="'业务公司'"
@@ -155,7 +155,6 @@ export default {
   },
   methods: {
     handleDepartChange() {
-      console.log(11)
       this.$nextTick(() => this.$refs.ruleForm.validateField('itemid'))
     },
     async initForm() {

src/views/interest/account/addEditPlat.vue

@@ -49,7 +49,7 @@
               </el-col>
 
               <el-col :span="24">
-                <el-form-item label="平台">
+                <el-form-item label="平台" prop="platform_id">
                   <select-plat :allow-init="allowInit" :plat_options="plat_options" :value.sync="ruleForm.platform_id" style="width:100%" />
                 </el-form-item>
               </el-col>
@@ -263,8 +263,6 @@ export default {
       // }
 
       await this.$refs.ruleForm.validate(async(valid) => {
-        console.log(this.sitem)
-
         if (valid) {
           if (!this.loading) {
             this.loading = true

src/views/interest/account/select-plat.vue

@@ -1,21 +1,32 @@
 <template>
-  <el-select
-    v-model="proxyValue"
-    multiple
-    filterable
-    remote
-    reserve-keyword
-    placeholder="请选择平台"
-    :remote-method="remoteMethod"
-    :loading="loading"
-  >
-    <el-option
-      v-for="item in options"
-      :key="item.id"
-      :label="item.platform_name"
-      :value="item.id"
-    />
-  </el-select>
+  <div class="select-plat__wrapper" style="width:100%">
+    <el-select
+      v-model="proxyValue"
+      style="width:100%"
+      multiple
+      filterable
+      remote
+      reserve-keyword
+      placeholder="请选择平台"
+      :remote-method="remoteMethod"
+      :loading="loading"
+      @change="updateCacheValue"
+      @visible-change="handleInit"
+    >
+      <el-option
+        v-for="item in options"
+        :key="item.id"
+        :label="item.platform_name"
+        :value="item.id"
+      >
+        <p @click="toggle(item)">{{ item.platform_name }}</p>
+      </el-option>
+    </el-select>
+
+    <div class="tags" style="display:flex;gap:5px;margin-top:10px">
+      <el-tag v-for="item in cacheValues" :key="item.id" size="mini" closable @close="handleClose(item)">{{ item.platform_name }}</el-tag>
+    </div>
+  </div>
 </template>
 
 <script>
@@ -24,6 +35,7 @@ export default {
   props: ['value', 'plat_options', 'allowInit'],
   data() {
     return {
+      cacheValues: [],
       options: [],
       list: [],
       loading: false,
@@ -42,7 +54,9 @@ export default {
   },
   watch: {
     plat_options: {
-      handler() { this.options = this.plat_options },
+      handler() {
+        this.cacheValues = this.plat_options || []
+      },
       deep: true,
       immediate: true
     },
@@ -53,11 +67,26 @@ export default {
     }
   },
   methods: {
+    handleInit(visible) {
+      // 关闭后初始化
+      visible && this.remoteMethod()
+    },
+    handleClose(tag) {
+      const { id } = tag
+      const _cacheIndex = this.cacheValues.findIndex(({ id: _id }) => _id === id)
+      const _sourceIndex = this.proxyValue.findIndex(v => v === id)
+      this.cacheValues.splice(_cacheIndex, 1)
+      this.proxyValue.splice(_sourceIndex, 1)
+    },
+    toggle(item) {
+      const { id } = item
+      const findIndex = this.cacheValues.findIndex(({ id: _id }) => _id === id)
+      if (findIndex >= 0) return this.cacheValues.splice(findIndex, 1)
+      this.cacheValues.push(item)
+    },
     async remoteMethod(platform_name) {
       this.selectLoading = true
       this.options = []
-      // this.proxyValue = []
-
       const { code, data, message } = await asyncRequest.platlist({ platform_name })
       if (code === 0) {
         const { list } = data
@@ -72,3 +101,23 @@ export default {
   }
 }
 </script>
+
+<style lang="scss" scoped>
+.select-plat__wrapper{
+  ::v-deep(.el-tag){
+    display: none;
+  }
+
+  .tags{
+    gap:5px;
+    display:flex;
+    margin-top:10px;
+    flex-wrap: wrap;
+
+    ::v-deep(.el-tag){
+      display: flex !important;
+      align-items: center;
+    }
+  }
+}
+</style>

src/views/serviceParam/workCompany/index.vue

@@ -379,8 +379,11 @@ export default {
         return;
       }
       this.loading = true;
+      console.log(this.parmValue)
+
       const res = await asyncRequest.list({
         ...this.parmValue,
+        ...this.pageInfo,
         needRela: true
       });