feat: 渠道列表新增渠道码列、二维码列及生成二维码按钮

src/views/modules/supplier/channel.vue

@@ -7,12 +7,30 @@
             </div>
             <el-table :data="dataList" border cell-class-name="vertical-top-cell" v-loading="loading" empty-text="暂无渠道方" style="margin-top: 16px;">
                 <el-table-column prop="channelName" label="渠道方名称"></el-table-column>
+                <el-table-column prop="code" label="渠道码" width="120"></el-table-column>
+                <el-table-column label="二维码" width="100" align="center">
+                  <template slot-scope="scope">
+                    <el-image
+                      v-if="scope.row.qrUrl"
+                      :src="scope.row.qrUrl"
+                      :preview-src-list="[scope.row.qrUrl]"
+                      style="width: 60px; height: 60px;"
+                      fit="contain"
+                    ></el-image>
+                    <span v-else style="color: #999; font-size: 12px;">未生成</span>
+                  </template>
+                </el-table-column>
                 <el-table-column prop="contactName" label="联系人"></el-table-column>
                 <el-table-column prop="contactPhone" label="联系方式"></el-table-column>
                 <el-table-column label="操作">
                     <template slot-scope="scope">
                         <el-button type="text" @click="handleEdit(scope.row)">编辑</el-button>
                         <el-button type="text" @click="handleDelete(scope.row)">删除</el-button>
+                        <el-button
+                          type="text"
+                          :loading="loadingIds.includes(scope.row.id)"
+                          @click="handleGenerateQr(scope.row)"
+                        >生成二维码</el-button>
                     </template>
                 </el-table-column>
             </el-table>
@@ -65,7 +83,8 @@ export default {
           { pattern: /^1[3456789]\d{9}$/, message: '请输入正确的手机号', trigger: 'blur' }
         ]
       },
-      buttonLoading: false
+      buttonLoading: false,
+      loadingIds: []
     }
   },
   mounted () {
@@ -128,6 +147,21 @@ export default {
       }
       this.$refs['formRef'].resetFields()
       this.show = false
+    },
+    handleGenerateQr (row) {
+      this.loadingIds.push(row.id)
+      this.$http.post(`/core/channel/generateQr/${row.id}`).then(res => {
+        if (res.data.code !== 0) {
+          this.$message.error(res.data.msg)
+        } else {
+          this.$set(row, 'qrUrl', res.data.data)
+          this.$message.success('二维码生成成功')
+        }
+      }).catch(() => {
+        this.$message.error('操作失败，请重试')
+      }).finally(() => {
+        this.loadingIds = this.loadingIds.filter(id => id !== row.id)
+      })
     }
   }
 }