优化改版信息采集表

src/views/qw/collectionUnBind/addCollectionDialog.vue

@@ -1,11 +1,6 @@
 <template>
   <el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="800px" @close="handleClose" append-to-body>
     <el-form validate-on-rule-change :rules="rules" ref="form" :model="form" label-width="140px">
-      <el-form-item label="小程序" prop="appId">
-        <el-select v-model="form.appId" placeholder="小程序" clearable>
-          <el-option v-for="dict in sourceList" :key="dict.dictValue1" :label="dict.dictLabel" :value="dict.dictValue1" />
-        </el-select>
-      </el-form-item>
       <el-form-item label="信息模板" prop="questionId">
         <el-select @change="selectQuestion" v-model="form.questionId" placeholder="请选择问答">
           <el-option v-for="dict in questionOptions" :key="dict.dictValue" :label="dict.dictLabel"
@@ -74,51 +69,17 @@
         <el-input type="textarea" :rows="2" placeholder="请输入备注" v-model="form.remark">
         </el-input>
       </el-form-item>
-      <el-form-item v-if="form.questionId" label="是否关联产品疗法" prop="isPackage">
-        <el-radio-group v-model="form.isPackage" @change="handleIsPackageChange">
-          <el-radio :label="0">否</el-radio>
-          <el-radio :label="1">是</el-radio>
-        </el-radio-group>
-      </el-form-item>
-      <el-form-item v-if="form.isPackage == 1" label="产品疗法" prop="packageId">
-        <el-select filterable v-model="form.packageId" placeholder="请选择产品疗法">
-          <el-option v-for="dict in privatePackageOptions" :key="dict.dictValue" :label="dict.dictLabel"
-                     :value="parseInt(dict.dictValue)" />
-        </el-select>
-      </el-form-item>
-      <el-form-item v-if="form.packageId && form.isPackage && form.isPackage == 1" label="支付类型" prop="payType">
-        <el-radio-group v-model="form.payType">
-          <el-radio :label="1">全款</el-radio>
-          <el-radio :label="2">物流代收</el-radio>
-        </el-radio-group>
-      </el-form-item>
-      <el-form-item v-if="form.packageId && form.payType == 2 && form.isPackage && form.isPackage == 1"
-                    label="预付金额" prop="amount">
-        <el-input v-model="form.amount" placeholder="请输入物流代收金额" type="number" />
-      </el-form-item>
     </el-form>
     <div slot="footer" class="dialog-footer">
       <el-button @click="dialogVisible = false">取 消</el-button>
       <el-button type="primary" @click="submitForm">确 定</el-button>
     </div>
-
-    <!-- 二维码弹窗 -->
-    <el-dialog :title="qrCodeTitle" :visible.sync="qrCodeVisible" width="450px" append-to-body>
-      <div style="padding-bottom:15px;">
-        <img :src="codeImage" width="400px">
-      </div>
-      <div slot="footer" class="dialog-footer">
-        <el-button @click="downloadImage(codeImage, qrCodeName + '.png')">下载二维码</el-button>
-      </div>
-    </el-dialog>
   </el-dialog>
 </template>
 
 <script>
 import { questionOptions, getAnswer } from "@/api/hisStore/answer";
-import { allPrivatePackage } from "@/api/store/package";
-import { options } from "@/api/course/coursePlaySourceConfig";
-import { getWxaCodeCollectionUnLimit, getSalesHasCollectionPermission } from "@/api/hisStore/collection";
+import { getSalesHasCollectionPermission } from "@/api/hisStore/collection";
 import { createSimpleUserInfo } from "@/api/qw/collectionUnBind";
 
 export default {
@@ -154,55 +115,28 @@ export default {
     };
 
     return {
-      // ========== 答案修改标识相关字段 ==========
       originalAnswers: null,
       isAnswersModified: 0,
       isSalesProxyFill: true,
 
       dialogVisible: false,
-      sourceList: [],
       form: {
         id: null,
         questionId: null,
-        packageId: null,
-        payType: null,
-        amount: null,
-        isPackage: null,
         answers: [],
         userName: '',
         userPhoneFour: '',
         sex: null,
         age: null,
         allergy: '',
-        remark: '',
-        appId: null
+        remark: ''
       },
       questionOptions: [],
-      privatePackageOptions: [],
-      qrCodeVisible: false,
-      qrCodeTitle: "用户信息采集分享",
-      qrCodeName: null,
-      codeImage: null,
       permissionLoading: false,
       rules: {
-        appId: [
-          {required: true, message: '请选择分享的小程序', trigger: 'change'}
-        ],
         questionId: [
           {required: true, message: '请选择信息模板', trigger: 'change'}
         ],
-        packageId: [
-          {required: true, message: '请选择套餐包', trigger: 'change'}
-        ],
-        isPackage: [
-          {required: true, message: '请选择是否关联套餐包', trigger: 'change'}
-        ],
-        payType: [
-          {required: true, message: '请选择支付类型', trigger: 'change'}
-        ],
-        amount: [
-          {required: true, message: '请填写物流代收金额', trigger: 'blur'}
-        ],
         userName: [
           {required: true, validator: validateName, trigger: 'blur'}
         ],
@@ -259,8 +193,6 @@ export default {
   },
   created() {
     this.getQuestionOptions();
-    this.getAllPrivatePackge();
-    this.getSourceOptions();
     this.fetchSalesProxyFillPermission();
   },
   methods: {
@@ -277,13 +209,11 @@ export default {
       }
     },
 
-    // 判断某个选项的备注是否为必填且未填写
     isRemarkRequired(answer, option) {
       if (!this.isSalesProxyFill) return false;
       return option.open && this.isOptionSelected(answer, option) && (!option.remarkText || option.remarkText.trim() === '');
     },
 
-    // 监听复选框组的变化
     onCheckboxGroupChange(answer) {
       answer.options.forEach(option => {
         if (!answer.value.includes(option.value)) {
@@ -293,12 +223,10 @@ export default {
       this.onAnswerChange();
     },
 
-    // 检查选项是否被选中
     isOptionSelected(answer, option) {
       return answer.value && answer.value.includes(option.value);
     },
 
-    // 备注输入框失去焦点时的处理
     onRemarkBlur(option) {
       if (!option.remarkText?.trim()) {
         option.remarkText = '';
@@ -358,62 +286,12 @@ export default {
       });
     },
 
-    getSourceOptions() {
-      options().then(res => {
-        this.sourceList = res.data;
-      });
-    },
-
-    handleIsPackageChange(value) {
-      if (value === 0) {
-        this.form.packageId = null;
-        this.form.payType = null;
-        this.form.amount = null;
-        this.$nextTick(() => {
-          this.$refs.form.clearValidate(['packageId', 'payType', 'amount']);
-        });
-      }
-    },
-
-    downloadImage(imageSrc, fileName) {
-      const link = document.createElement('a');
-      link.href = imageSrc;
-      link.download = fileName || '付款二维码.png';
-      document.body.appendChild(link);
-      link.click();
-      document.body.removeChild(link);
-    },
-
-    handleShare(id, appId) {
-      let loadingRock = this.$loading({
-        lock: true,
-        text: '生成二维码中~~请不要刷新页面！！',
-        spinner: 'el-icon-loading',
-        background: 'rgba(0, 0, 0, 0.7)'
-      });
-
-      getWxaCodeCollectionUnLimit(id, appId).then(response => {
-        this.codeImage = response.url;
-        this.qrCodeVisible = true;
-        this.qrCodeName = id;
-        loadingRock.close();
-      }).finally(() => {
-        loadingRock.close();
-      });
-    },
-
     getQuestionOptions() {
       questionOptions().then(response => {
         this.questionOptions = response.rows;
       });
     },
 
-    getAllPrivatePackge() {
-      allPrivatePackage().then(res => {
-        this.privatePackageOptions = res.rows;
-      });
-    },
-
     selectQuestion(val) {
       if (!val) return;
 
@@ -458,18 +336,13 @@ export default {
           sex: this.form.sex,
           age: this.form.age,
           allergy: this.form.allergy,
-          remark: this.form.remark,
-          appId: this.form.appId
+          remark: this.form.remark
         };
 
         this.form = {
           ...preservedFields,
           questionId: val,
           answers: answers,
-          isPackage: null,
-          packageId: null,
-          payType: null,
-          amount: null,
           id: null
         };
 
@@ -499,24 +372,18 @@ export default {
       this.form = {
         id: null,
         questionId: null,
-        packageId: null,
-        payType: null,
-        amount: null,
-        isPackage: null,
         answers: [],
         userName: '',
         userPhoneFour: '',
         sex: null,
         age: null,
         allergy: '',
-        remark: '',
-        appId: null
+        remark: ''
       };
       this.originalAnswers = null;
       this.isAnswersModified = 0;
     },
 
-    // 自定义备注必填校验
     validateRemarksRequired() {
       if (!this.isSalesProxyFill) return true;
       for (const answer of this.form.answers) {
@@ -534,13 +401,11 @@ export default {
     submitForm() {
       this.$refs["form"].validate(valid => {
         if (valid) {
-          // 1. 自定义备注必填校验
           if (!this.validateRemarksRequired()) {
             this.$message.error('请填写所有必填的备注信息');
             return;
           }
 
-          // 2. 构建提交用的 answers 副本
           const answersForSubmit = this.form.answers.map(answer => {
             const remarks = [];
             answer.options.forEach(option => {
@@ -570,26 +435,11 @@ export default {
             fillFlag: this.isAnswersModified
           };
 
-          if (submitData.isPackage !== 1) {
-            delete submitData.packageId;
-            delete submitData.payType;
-            delete submitData.amount;
-          } else {
-            if (submitData.payType !== 2) {
-              delete submitData.amount;
-            }
-          }
-
-          const appId = this.form.appId;
-
           createSimpleUserInfo(submitData).then(res => {
             this.$message.success("新增成功");
             this.dialogVisible = false;
             this.$emit('success');
             this.$emit('update:visible', false);
-            if (res.data) {
-              this.handleShare(res.data, appId);
-            }
           }).catch(error => {
             this.$message.error(error.msg || "新增失败");
           });
@@ -607,12 +457,10 @@ export default {
 </script>
 
 <style scoped>
-/* 必填备注输入框红色边框 */
 .remark-required >>> .el-input__inner {
   border-color: #f56c6c !important;
 }
 
-/* 必填提示文字 */
 .remark-error-tip {
   color: #f56c6c;
   font-size: 12px;

src/views/qw/collectionUnBind/index.vue

@@ -42,23 +42,43 @@
 
     <!-- 数据表格 -->
     <el-table border v-loading="loading" :data="collectionList">
-      <el-table-column label="用户姓名" align="center" prop="userName" />
+      <el-table-column label="用户姓名" align="center" prop="userName"/>
+      <el-table-column label="绑定状态" align="center" width="120">
+        <template slot-scope="scope">
+          <el-tag v-if="scope.row.userId" type="success">已绑定个微</el-tag>
+          <el-tag v-else type="danger">未绑定</el-tag>
+        </template>
+      </el-table-column>
       <el-table-column label="用户性别" align="center" prop="sex">
         <template slot-scope="scope">
           <span>{{ sexFormat(scope.row.sex) }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="用户年龄" align="center" prop="age" />
-      <el-table-column label="电话尾号" align="center" prop="userPhoneFour" />
-      <el-table-column label="是否过敏" align="center" prop="allergy" />
-      <el-table-column label="备注" align="center" prop="remark" show-overflow-tooltip />
-      <el-table-column label="医生姓名" align="center" prop="doctorName" />
-      <el-table-column label="销售人员" align="center" prop="companyUserName" />
+      <el-table-column label="用户年龄" align="center" prop="age"/>
+      <el-table-column label="电话尾号" align="center" prop="userPhoneFour"/>
+      <el-table-column label="是否过敏" align="center" prop="allergy"/>
+      <el-table-column label="备注" align="center" prop="remark" show-overflow-tooltip/>
+      <el-table-column label="医生姓名" align="center" prop="doctorName"/>
+      <el-table-column label="销售人员" align="center" prop="companyUserName"/>
       <el-table-column label="创建时间" align="center" width="180">
         <template slot-scope="scope">
           <span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
         </template>
       </el-table-column>
+      <!-- 新增操作列 -->
+      <el-table-column label="操作" align="center" width="100">
+        <template slot-scope="scope">
+          <el-button
+            type="text"
+            icon="el-icon-share"
+            size="mini"
+            v-if="!scope.row.userId"
+            @click="handleShare(scope.row)"
+          >
+            分享绑定用户
+          </el-button>
+        </template>
+      </el-table-column>
     </el-table>
 
     <!-- 分页组件 -->
@@ -70,18 +90,46 @@
       @pagination="getList"
     />
 
-    <!-- 新增弹窗 - 不传递 userId -->
+    <!-- 新增弹窗 -->
     <add-collection-dialog
       :visible.sync="addDialogVisible"
       :extra-params="extraParams"
       @success="getList"
     />
+
+    <!-- 分享弹窗：选择小程序 -->
+    <el-dialog title="分享信息采集" :visible.sync="shareDialogVisible" width="450px" append-to-body>
+      <el-form :model="shareForm" label-width="100px">
+        <el-form-item label="选择小程序" required>
+          <el-select v-model="shareForm.appId" placeholder="请选择小程序" clearable style="width: 100%">
+            <el-option v-for="dict in sourceList" :key="dict.dictValue1" :label="dict.dictLabel"
+                       :value="dict.dictValue1"/>
+          </el-select>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="shareDialogVisible = false">取 消</el-button>
+        <el-button type="primary" @click="confirmShare">确 定</el-button>
+      </div>
+    </el-dialog>
+
+    <!-- 二维码展示弹窗 -->
+    <el-dialog :title="qrCodeTitle" :visible.sync="qrCodeVisible" width="450px" append-to-body>
+      <div style="padding-bottom:15px;">
+        <img :src="codeImage" width="400px">
+      </div>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="downloadImage(codeImage, qrCodeName + '.png')">下载二维码</el-button>
+      </div>
+    </el-dialog>
   </div>
 </template>
 
 <script>
-import { listUnbindCollection } from "@/api/qw/collectionUnBind";
+import {listUnbindCollection} from "@/api/qw/collectionUnBind";
 import AddCollectionDialog from "./addCollectionDialog.vue";
+import {options} from "@/api/course/coursePlaySourceConfig";
+import {getWxaCodeCollectionUnLimitNew} from "@/api/hisStore/collection";
 
 export default {
   name: "UnbindCollection",
@@ -112,12 +160,26 @@ export default {
       extraParams: {
         companyId: null,
         companyUserId: null
-      }
+      },
+      // 分享相关
+      shareDialogVisible: false,
+      shareForm: {
+        appId: null,
+        collectionId: null
+      },
+      sourceList: [],
+      // 二维码弹窗
+      qrCodeVisible: false,
+      qrCodeTitle: "用户信息采集分享",
+      qrCodeName: null,
+      codeImage: null,
+      currentShareRow: null
     };
   },
   created() {
     this.getList();
     this.getCurrentUserInfo();
+    this.getSourceOptions();
   },
   methods: {
     /** 查询未绑定的信息采集列表 */
@@ -154,6 +216,52 @@ export default {
         this.extraParams.companyId = userInfo.companyId;
         this.extraParams.companyUserId = userInfo.userId;
       }
+    },
+    /** 获取小程序选项列表 */
+    getSourceOptions() {
+      options().then(res => {
+        this.sourceList = res.data;
+      });
+    },
+    /** 分享按钮点击 */
+    handleShare(row) {
+      this.currentShareRow = row;
+      this.shareForm = {
+        appId: null,
+        collectionId: row.id
+      };
+      this.shareDialogVisible = true;
+    },
+    /** 确认分享，生成二维码 */
+    confirmShare() {
+      if (!this.shareForm.appId) {
+        this.$message.warning("请选择小程序");
+        return;
+      }
+      const loading = this.$loading({
+        lock: true,
+        text: '生成二维码中~~请不要刷新页面！！',
+        spinner: 'el-icon-loading',
+        background: 'rgba(0, 0, 0, 0.7)'
+      });
+      getWxaCodeCollectionUnLimitNew(this.shareForm.collectionId, this.shareForm.appId).then(response => {
+        this.codeImage = response.url;
+        this.qrCodeVisible = true;
+        this.qrCodeName = this.shareForm.collectionId;
+        this.shareDialogVisible = false;
+        loading.close();
+      }).catch(() => {
+        loading.close();
+      });
+    },
+    /** 下载二维码 */
+    downloadImage(imageSrc, fileName) {
+      const link = document.createElement('a');
+      link.href = imageSrc;
+      link.download = fileName || '付款二维码.png';
+      document.body.appendChild(link);
+      link.click();
+      document.body.removeChild(link);
     }
   }
 };