feat:应用主题添加封面，修复绑定事项和业务时偶尔校验失败的问题

base-manager-ui/admin/src/pages/basicset/appmarket/components/AppTheme.vue

@@ -44,6 +44,16 @@
           (current - 1) * size + index + 1
         }}</span>
 
+        <!-- 主题封面 -->
+        <template slot="cover" slot-scope="text">
+          <img
+            class="cover"
+            v-if="text.cover"
+            :src="api2 + text.cover"
+            @click="handlePreview(api2 + text.cover)"
+          />
+          <span v-else>--</span>
+        </template>
         <!-- 创建时间 -->
         <template slot="createTime" slot-scope="text">
           {{ text.createTime | dateFormat }}
@@ -65,6 +75,11 @@
       :addVisile.sync="addVisile"
       @addSuccess="getCategoryList"
     ></AddTheme>
+    <!-- 预览 -->
+    <PrevieModal
+      :previewData="previewData"
+      :previewVisible.sync="previewVisible"
+    ></PrevieModal>
   </div>
 </template>
 
@@ -73,6 +88,7 @@ import { getCategoryList, deleteCategory } from "@/services/market";
 import AddTheme from "../modal/AddTheme";
 import local from "@/utils/local";
 import { pageSizeOptions } from "@/config/pageConfig.js";
+import PrevieModal from "@/components/PrevieModal.vue";
 const columns = [
   {
     title: "序号",
@@ -94,6 +110,12 @@ const columns = [
     title: "主题编码",
     dataIndex: "categoryCode",
   },
+  {
+    title: "主题封面",
+    scopedSlots: {
+      customRender: "cover",
+    },
+  },
   {
     title: "排序",
     dataIndex: "sort",
@@ -113,12 +135,15 @@ const columns = [
 export default {
   components: {
     AddTheme,
+    PrevieModal,
   },
   data() {
     return {
       api: process.env.VUE_APP_API_BASE_URL + "/",
       api2: process.env.VUE_APP_API_IMG_URL,
       columns,
+      previewData: {}, // 预览
+      previewVisible: false,
       siteId: local.getLocal("siteId"),
       tableData: [], // 表格数据
       loading: false,
@@ -227,8 +252,21 @@ export default {
         },
       });
     },
+    // 预览封面
+    handlePreview(url) {
+      this.previewData = {
+        type: "img",
+        url: url,
+      };
+      this.previewVisible = true;
+    },
   },
 };
 </script>
 
-<style lang="less" scoped></style>
+<style lang="less" scoped>
+.cover {
+  width: 50px;
+  cursor: pointer;
+}
+</style>

base-manager-ui/admin/src/pages/basicset/appmarket/modal/AddApp.vue

@@ -48,26 +48,6 @@
                 <div class="ant-upload-text">选择图标</div>
               </div>
             </a-upload>
-
-            <!-- <a-upload
-              name="file"
-              list-type="picture-card"
-              class="avatar-uploader"
-              :show-upload-list="false"
-              :action="api + 'base/file/commonupload'"
-              :before-upload="iconBeforeUpload"
-              @change="handleChangeIcon"
-            >
-              <img
-                class="icon"
-                v-if="form.appIconPath"
-                :src="api2 + form.appIconPath"
-              />
-              <div v-else>
-                <a-icon :type="loading ? 'loading' : 'plus'" />
-                <div class="ant-upload-text">选择图标</div>
-              </div>
-            </a-upload> -->
           </a-form-model-item>
           <a-form-model-item label="应用简介" prop="summary">
             <a-textarea
@@ -102,6 +82,7 @@
               <a-radio :value="1"> 应用程序 </a-radio>
               <a-radio :value="2"> URL </a-radio>
               <a-radio :value="3" v-if="form.type != 1"> 微信小程序 </a-radio>
+              <a-radio :value="4" v-if="form.type != 2"> 天府通办 </a-radio>
             </a-radio-group>
           </a-form-model-item>
           <a-form-model-item

base-manager-ui/admin/src/pages/basicset/appmarket/modal/AddTheme.vue

@@ -25,10 +25,32 @@
         <a-form-model-item label="主题编码" prop="categoryCode">
           <a-input v-model="form.categoryCode" placeholder="请输入主题编码" />
         </a-form-model-item>
+        <a-form-model-item label="主题封面" prop="cover">
+          <a-upload
+            name="file"
+            list-type="picture-card"
+            :action="api + 'base/file/commonupload'"
+            :file-list="fileList"
+            @change="handleChangeCover"
+            :accept="accept"
+            :before-upload="beforeUpload"
+            @preview="handlePreview"
+          >
+            <div v-if="fileList.length < 1">
+              <a-icon type="plus" />
+              <div class="ant-upload-text">选择封面</div>
+            </div>
+          </a-upload>
+        </a-form-model-item>
         <a-form-model-item label="排序" prop="sort">
           <a-input-number v-model="form.sort" :min="1" />
         </a-form-model-item>
       </a-form-model>
+      <!-- 预览 -->
+      <PrevieModal
+        :previewData="previewData"
+        :previewVisible.sync="previewVisible"
+      ></PrevieModal>
     </a-modal>
   </div>
 </template>
@@ -36,6 +58,7 @@
 <script>
 import { saveCategory } from "@/services/market";
 import local from "@/utils/local";
+import PrevieModal from "@/components/PrevieModal.vue";
 export default {
   props: {
     addVisile: {
@@ -48,15 +71,25 @@ export default {
       default: "新增分类",
     },
   },
-  components: {},
+  components: {
+    PrevieModal,
+  },
   data() {
     return {
+      accept: "image/jpeg,image/png",
+      api: process.env.VUE_APP_API_BASE_URL + "/",
+      api2: process.env.VUE_APP_API_IMG_URL,
+      fileList: [],
+      previewData: {}, // 预览
+      previewVisible: false,
       form: {
         siteId: local.getLocal("siteId"), // 站点id
         siteName: local.getLocal("siteName"), // 站点名称
         categoryName: "", // 分类名称
         categoryCode: "", // 分类编码
         sort: 99, // 排序
+        cover: "", // 封面
+        remark: "", // 备注
       },
       rules: {
         categoryName: [
@@ -88,9 +121,21 @@ export default {
     // 编辑
     onEdit(data) {
       this.form = { ...data };
+      if (this.form.cover) {
+        this.fileList = [
+          {
+            uid: "-2",
+            name: this.form.cover,
+            status: "done",
+            url: this.api2 + this.form.cover,
+            url2: this.form.cover,
+          },
+        ];
+      }
     },
     // 关闭弹窗
     handleClose() {
+      this.fileList = [];
       this.$refs.form.resetFields();
       this.Visible = false;
     },
@@ -108,6 +153,43 @@ export default {
         }
       });
     },
+    // 上传之前
+    beforeUpload(file) {
+      const isJpgOrPng =
+        file.type === "image/jpeg" || file.type === "image/png";
+      if (!isJpgOrPng) {
+        this.$message.error("请上传jpeg、png格式图片!");
+      }
+      const isLt10M = file.size / 1024 / 1024 < 10;
+      if (!isLt10M) {
+        this.$message.error("图片大小不能超过 10MB!");
+      }
+      return isJpgOrPng && isLt10M;
+    },
+    // 上传封面
+    handleChangeCover({ fileList }) {
+      this.fileList = [...fileList].slice(-1);
+      this.fileList = this.fileList.map((v) => {
+        if (v.response) {
+          v.url2 = v.response.url;
+          v.url = this.api2 + v.response.url;
+        }
+        return v;
+      });
+      if (this.fileList[0]) {
+        this.form.cover = this.fileList[0].url2;
+      } else {
+        this.form.cover = "";
+      }
+    },
+    // 预览
+    handlePreview(info) {
+      this.previewData = {
+        type: "img",
+        url: info.url,
+      };
+      this.previewVisible = true;
+    },
     // 重置
     handleReset() {
       this.$refs.form.resetFields();

base-manager-ui/admin/src/pages/basicset/business/components/businessTabs3.vue

@@ -671,6 +671,7 @@ export default {
 
     // 业务下拉
     handleChange(val, node) {
+      this.$refs.formData.validateField("siteBusinessId");
       if (node) {
         let { text } = node.componentOptions.children[0];
         this.siteBusiness.siteBusinessName = text;