feature_20260319_质感服务商拜访任务

src/views/storeManagement/FSQStoreEdit.vue

@@ -10,152 +10,164 @@
         @click-right="clickSubmit" />
     </div>
     <div class="content">
-      <van-form ref="tabstoreVal" @submit="onSubmit" :scroll-to-error="true" :show-error="false">
-        <van-field readonly :value="fromData.storeCode" label="编号">
-          <template #left-icon>
-            <span class="van-f-red"></span>
-          </template>
-        </van-field>
-        <van-field
-          v-model="fromData.storeName"
-          label="名称"
-          placeholder="请输入名称"
-          readonly
-          :rules="[{ required: true, message: '请输入名称' }]">
-          <template #left-icon>
-            <span class="van-f-red"></span>
-          </template>
-        </van-field>
-        <van-field
-          readonly
-          clickable
-          name="picker"
-          :value="fromData.storeCategoryName"
-          label="类型"
-          placeholder="点击选择类型">
-          <template #left-icon>
-            <span class="van-f-red"></span>
-          </template>
-        </van-field>
-        <van-field
-          v-model="fromData.orgName"
-          label="销售部"
-          placeholder="请输入销售部"
-          readonly
-          :rules="[{ required: true, message: '请输入销售部' }]">
-          <template #left-icon>
-            <span class="van-f-red"></span>
-          </template>
-        </van-field>
-        <van-row style="border-bottom: 1px solid #ebedf0">
-          <van-field
-            rows="1"
-            autosize
-            type="textarea"
-            readonly
-            clickable
-            name="picker"
-            :value="fromData.chainName"
-            label="经销商名称"
-            placeholder="点击选择经销商名称"
-            :rules="[
-              {
-                required: true,
-                message: '请选择经销商',
-              },
-            ]">
-            <template #left-icon>
-              <span class="van-f-red"></span>
-            </template>
-          </van-field>
-        </van-row>
-        <van-field
-          readonly
-          clickable
-          name="picker"
-          :value="fromData.provinceName"
-          label="省(州)"
-          placeholder="点击选择省(州)">
-          <template #left-icon>
-            <span class="van-f-red"></span>
-          </template>
-        </van-field>
-        <van-field
-          readonly
-          clickable
-          name="picker"
-          :value="fromData.cityName"
-          label="城市"
-          placeholder="点击选择城市">
-          <template #left-icon>
-            <span class="van-f-red"></span>
-          </template>
-        </van-field>
-        <van-field
-          readonly
-          clickable
-          name="picker"
-          :value="fromData.districtName"
-          label="区(县)"
-          placeholder="点击选择区(县)">
-          <template #left-icon>
-            <span class="van-f-red"></span>
-          </template>
-        </van-field>
-        <van-field
-          readonly
-          clickable
-          name="picker"
-          :value="fromData.townName"
-          label="街道"
-          placeholder="点击选择街道">
-          <template #left-icon>
-            <span class="van-f-red"></span>
-          </template>
-        </van-field>
-        <van-field
-          v-model="fromData.addressLine"
-          label="地址"
-          placeholder="请输入地址"
-          rows="1"
-          autosize
-          type="textarea">
-          <template #left-icon>
-            <span class="van-f-red"></span>
-          </template>
-        </van-field>
-        <van-field readonly v-model="fromData.contactName" label="实际经营人">
-          <template #left-icon>
-            <span class="van-f-red"></span>
-          </template>
-        </van-field>
-        <van-field
-          readonly
-          type="tel"
-          v-model="fromData.telephone"
-          label="实际经营人电话"
-          placeholder="请输入实际经营人电话"
-          :rules="[
-            {
-              required: false,
-              validator: FSQValidatePhone,
-              message: '请输入手机号',
-            },
-          ]">
-          <template #left-icon>
-            <span class="van-f-red"></span>
-          </template>
-        </van-field>
-        <van-field
-          readonly
-          v-model="fromData.salesmanName"
-          label="所属销售员"
-          placeholder="所属销售员">
-          <template #left-icon>
-            <span class="van-f-red"></span>
-          </template>
-        </van-field>
-      </van-form>
+      <van-tabs class="myTab" v-model="tabVal" color="#0057ba" @change="tabChange">
+        <van-tab title="基础信息" name="insidePlan" ref="dispsps">
+          <van-form
+            ref="tabstoreVal"
+            @submit="onSubmit"
+            :scroll-to-error="true"
+            :show-error="false">
+            <van-field readonly :value="fromData.storeCode" label="编号">
+              <template #left-icon>
+                <span class="van-f-red"></span>
+              </template>
+            </van-field>
+            <van-field
+              v-model="fromData.storeName"
+              label="名称"
+              placeholder="请输入名称"
+              readonly
+              :rules="[{ required: true, message: '请输入名称' }]">
+              <template #left-icon>
+                <span class="van-f-red"></span>
+              </template>
+            </van-field>
+            <van-field
+              readonly
+              clickable
+              name="picker"
+              :value="fromData.storeCategoryName"
+              label="类型"
+              placeholder="点击选择类型">
+              <template #left-icon>
+                <span class="van-f-red"></span>
+              </template>
+            </van-field>
+            <van-field
+              v-model="fromData.orgName"
+              label="销售部"
+              placeholder="请输入销售部"
+              readonly
+              :rules="[{ required: true, message: '请输入销售部' }]">
+              <template #left-icon>
+                <span class="van-f-red"></span>
+              </template>
+            </van-field>
+            <van-row style="border-bottom: 1px solid #ebedf0">
+              <van-field
+                rows="1"
+                autosize
+                type="textarea"
+                readonly
+                clickable
+                name="picker"
+                :value="fromData.chainName"
+                label="经销商名称"
+                placeholder="点击选择经销商名称"
+                :rules="[
+                  {
+                    required: true,
+                    message: '请选择经销商',
+                  },
+                ]">
+                <template #left-icon>
+                  <span class="van-f-red"></span>
+                </template>
+              </van-field>
+            </van-row>
+            <van-field
+              readonly
+              clickable
+              name="picker"
+              :value="fromData.provinceName"
+              label="省(州)"
+              placeholder="点击选择省(州)">
+              <template #left-icon>
+                <span class="van-f-red"></span>
+              </template>
+            </van-field>
+            <van-field
+              readonly
+              clickable
+              name="picker"
+              :value="fromData.cityName"
+              label="城市"
+              placeholder="点击选择城市">
+              <template #left-icon>
+                <span class="van-f-red"></span>
+              </template>
+            </van-field>
+            <van-field
+              readonly
+              clickable
+              name="picker"
+              :value="fromData.districtName"
+              label="区(县)"
+              placeholder="点击选择区(县)">
+              <template #left-icon>
+                <span class="van-f-red"></span>
+              </template>
+            </van-field>
+            <van-field
+              readonly
+              clickable
+              name="picker"
+              :value="fromData.townName"
+              label="街道"
+              placeholder="点击选择街道">
+              <template #left-icon>
+                <span class="van-f-red"></span>
+              </template>
+            </van-field>
+            <van-field
+              v-model="fromData.addressLine"
+              label="地址"
+              placeholder="请输入地址"
+              rows="1"
+              autosize
+              type="textarea">
+              <template #left-icon>
+                <span class="van-f-red"></span>
+              </template>
+            </van-field>
+            <van-field readonly v-model="fromData.contactName" label="实际经营人">
+              <template #left-icon>
+                <span class="van-f-red"></span>
+              </template>
+            </van-field>
+            <van-field
+              readonly
+              type="tel"
+              v-model="fromData.telephone"
+              label="实际经营人电话"
+              placeholder="请输入实际经营人电话"
+              :rules="[
+                {
+                  required: false,
+                  validator: FSQValidatePhone,
+                  message: '请输入手机号',
+                },
+              ]">
+              <template #left-icon>
+                <span class="van-f-red"></span>
+              </template>
+            </van-field>
+            <van-field
+              readonly
+              v-model="fromData.salesmanName"
+              label="所属销售员"
+              placeholder="所属销售员">
+              <template #left-icon>
+                <span class="van-f-red"></span>
+              </template>
+            </van-field>
+          </van-form>
+        </van-tab>
+        <!-- 质感服务商档案 -->
+        <van-tab title="服务商档案" name="outsidePlan">
+          <FSQattributeEdit :storeArchives="fromData.serviceProviderArchives"></FSQattributeEdit>
+        </van-tab>
+      </van-tabs>
     </div>
   </div>
 </template>
@@ -163,9 +175,12 @@
 <script>
 import { getById, phoneCheck } from '@/api/index';
 import { updateStore } from '@/api/FSQStore';
+import FSQattributeEdit from './FSQattributeEdit.vue';
 export default {
+  components: { FSQattributeEdit },
   data() {
     return {
+      tabVal: 'insidePlan',
       fromData: {
         storeCode: '',
         storeName: '',
@@ -247,6 +262,7 @@ export default {
         }
       });
     },
+    tabChange(name, title) {},
     onClickLeft() {
       this.$router.go(-1);
     },
@@ -266,5 +282,25 @@ export default {
     flex: 1;
     overflow-y: auto;
   }
+  .myTab .van-tabs__nav--card {
+    margin: 0 !important;
+    border-left: 0;
+    border-right: 0;
+  }
+
+  .myTab .van-tabs__wrap,
+  .myTab .van-tabs__nav--card {
+    height: 40px;
+  }
+
+  .myTab .van-tab {
+    line-height: 40px;
+  }
+
+  .van-f-red {
+    color: red;
+    width: 4px;
+    display: inline-block;
+  }
 }
 </style>

src/views/storeManagement/FSQattributeEdit.vue

@@ -1,131 +1,62 @@
 <template>
   <div class="FSQattributeEdit">
-    <van-nav-bar class="navBar" title="公装经销商编辑" left-arrow @click-left="onClickLeft" />
-    <div class="content" v-if="detail">
+    <div class="content">
       <van-form ref="tabstoreVal" @submit="onSubmit">
         <van-field
-          label="是否终端客户"
-          :rules="[{ required: true, message: '请选择是否终端客户' }]">
+          v-model="detail.estimateSalesYearTarget"
+          type="number"
+          :rules="[{ required: true, message: '请输入年预估销额目标/干元' }]"
+          label="年预估销额目标/干元:">
           <template #left-icon>
             <span class="van-f-red">*</span>
           </template>
-          <template #input>
-            <van-radio-group v-model="detail.terminalCustomer" direction="horizontal">
-              <van-radio name="是">是</van-radio>
-              <van-radio name="否">否</van-radio>
-            </van-radio-group>
-          </template>
         </van-field>
         <van-field
-          v-if="detail.terminalCustomer == '否'"
-          label="是否双包客户"
-          :rules="[{ required: true, message: '请选择是否双包客户' }]">
+          v-model="detail.zgwqWorkerNum"
+          type="number"
+          :rules="[{ required: true, message: '请输入旗下质感外墙工人数量' }]"
+          label="旗下质感外墙工人数量:">
           <template #left-icon>
             <span class="van-f-red">*</span>
           </template>
-          <template #input>
-            <van-radio-group v-model="detail.doubleCustomer" direction="horizontal">
-              <van-radio name="是">是</van-radio>
-              <van-radio name="否">否</van-radio>
-            </van-radio-group>
-          </template>
         </van-field>
         <van-field
-          v-if="detail.doubleCustomer == '是' && detail.terminalCustomer == '否'"
-          :rules="[{ required: true, message: '请选择客户类型' }]"
-          autosize
-          type="textarea"
-          label="客户类型">
+          v-model="detail.projectYearNum"
+          type="number"
+          :rules="[{ required: true, message: '请输入年承接项目数量' }]"
+          label="年承接项目数量:">
           <template #left-icon>
             <span class="van-f-red">*</span>
           </template>
-          <template #input>
-            <van-checkbox-group v-model="detail.customerType" direction="horizontal">
-              <van-checkbox
-                v-for="(item, index) in doubleustomer"
-                :name="item.dictLabel"
-                shape="square"
-                :key="index">
-                {{ item.dictValue }}
-              </van-checkbox>
-            </van-checkbox-group>
-          </template>
-        </van-field>
-        <van-field
-          v-if="detail.terminalCustomer == '否'"
-          autosize
-          type="textarea"
-          label="渠道类型"
-          :rules="[{ required: true, message: '请选择渠道类型' }]">
-          <template #left-icon>
-            <span class="van-f-red">*</span>
-          </template>
-          <template #input>
-            <van-radio-group v-model="detail.channelType" direction="horizontal">
-              <van-radio
-                v-for="(item, index) in channelTypeArr"
-                :name="item.dictLabel"
-                :key="index">
-                {{ item.dictValue }}
-              </van-radio>
-            </van-radio-group>
-          </template>
         </van-field>
       </van-form>
     </div>
-    <div class="footer-btn">
-      <van-button
-        style="color: white; background: rgb(0, 87, 186); border-radius: 6px; width: 90%"
-        @click="confirmShare">
-        保 存
-      </van-button>
-    </div>
   </div>
 </template>
 
 <script>
-import { getDictOption } from '@/api/index';
-import { getGzVisitLabel, updateVisitLabel } from '@/api/storeManagement';
 export default {
   name: 'FSQattributeEdit',
+  props: {
+    storeArchives: {
+      type: Object,
+    },
+  },
   data() {
     return {
-      detail: null,
-      channelTypeArr: [],
-      doubleustomer: [],
+      detail: {},
     };
   },
-  activated() {
-    this.detail = null;
-    this.toastLoading(0, '加载中...', true);
-    // 公装拜访标签渠道类型：gz_visit_label_channel_type 公装拜访标签双包客户：gz_visit_label_double_customer
-    Promise.all([
-      this.getDictOptionFun('gz_visit_label_channel_type'),
-      this.getDictOptionFun('gz_visit_label_double_customer'),
-    ]).then((res) => {
-      this.channelTypeArr = res[0];
-      this.doubleustomer = res[1];
-      console.log(this.doubleustomer);
-      this.getDetaild();
-    });
+  watch: {
+    storeArchives: {
+      handler(val) {
+        this.detail = JSON.parse(JSON.stringify(val));
+      },
+      deep: true,
+      immediate: true,
+    },
   },
   methods: {
-    getDictOptionFun(type) {
-      return new Promise((resolve, reject) => {
-        getDictOption({}, type).then((res) => {
-          resolve(res.data);
-        });
-      });
-    },
-    getDetaild() {
-      getGzVisitLabel({ storeCode: this.$route.query.storeCode }).then((res) => {
-        this.toastLoading().clear();
-        if (res.code == 200) {
-          res.data.customerType = res.data.customerType ? res.data.customerType.split(',') : [];
-          this.detail = res.data;
-        }
-      });
-    },
     // 保存
     confirmShare() {
       this.$refs.tabstoreVal.submit();
@@ -133,27 +64,6 @@ export default {
     onSubmit(value) {
       this.toastLoading(0, '加载中...', true);
       let params = JSON.parse(JSON.stringify(this.detail));
-      params.customerType = params.customerType.join(',');
-      params.storeCode = this.$route.query.storeCode;
-      params.chainCode = this.$route.query.chainCode;
-      if (params.terminalCustomer == '是') {
-        params.doubleCustomer = null;
-        params.customerType = '';
-        params.channelType = '';
-      }
-      if (params.doubleCustomer == '否') params.customerType = '';
-      updateVisitLabel(params).then((res) => {
-        this.toastLoading().clear();
-        if (res.code == 200) {
-          this.$toast(res.msg);
-          this.$router.go(-1);
-        } else {
-          this.$toast(res.msg);
-        }
-      });
-    },
-    onClickLeft() {
-      this.$router.go(-1);
     },
   },
 };
@@ -174,25 +84,12 @@ export default {
     padding: 10px 15px;
     margin-top: 10px;
     background: #fff;
-    .van-cell {
-      padding: 10px 0;
-      border-bottom: 1px solid #ccc;
-    }
-    .van-field__label {
-      width: 9em;
-    }
-    .van-checkbox--horizontal {
-      margin-bottom: 10px;
-      width: 100%;
-    }
-    .van-radio--horizontal {
-      margin-bottom: 10px;
+
+    .van-f-red {
+      color: red;
+      width: 4px;
+      display: inline-block;
     }
   }
-  .footer-btn {
-    display: flex;
-    justify-content: space-around;
-    padding: 10px 0;
-  }
 }
 </style>