perf: 优化应用集市

base-manager-ui/admin/src/components/YUpload.vue

@@ -75,6 +75,7 @@ export default {
       type: [String, Array],
       default: "",
     },
+    // 文件限制
     accept: {
       type: String,
       default: "",
@@ -87,9 +88,12 @@ export default {
       },
       default: 0, // 0为不限制
     },
-    // 上传文件大小限制mb
+    // 上传文件大小限制mb 0为不限制
     MB: {
       type: Number,
+      validator: (value) => {
+        return value >= 0;
+      },
       default: 10,
     },
     action: {

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

@@ -45,66 +45,57 @@
     <div class="version-manage flex1">
       <div class="title">版本管理</div>
       <div class="table-content">
-        <a-table
-          :loading="loading"
+        <y-table
           size="small"
           bordered
           :scroll="{ y: 350 }"
           :columns="columns"
-          :pagination="{
-            showTotal: (total) => `共 ${total} 条`,
-            current: current,
-            total: total,
-            pageSize: size,
-            showSizeChanger: true,
-            showQuickJumper: true,
-            size: 'small',
-            pageSizeOptions: pageSizeOptions,
-            onChange: handleChange,
-            onShowSizeChange: showSizeChange,
-          }"
-          :data-source="tableData"
-          :rowKey="(record) => record.id"
+          :data="tableData"
+          :pageSize.sync="size"
+          :page.sync="page"
+          :total="total"
+          :loading="loading"
+          @changePagination="getVersions"
         >
-          <!-- 序号 -->
-          <span slot="num" slot-scope="text, record, index">{{
-            (current - 1) * size + index + 1
+          <span slot="index" slot-scope="{ index }">{{
+            (page - 1) * size + index + 1
           }}</span>
+
           <!-- 版本号 -->
-          <template slot="version" slot-scope="text">
-            v{{ text.version }}
+          <template slot="version" slot-scope="{ record }">
+            v{{ record.version }}
           </template>
           <!-- 应用包 -->
-          <template slot="fileName" slot-scope="text">
-            <a v-if="text.fileName" class="primary">{{ text.fileName }}</a>
+          <template slot="fileName" slot-scope="{ record }">
+            <a v-if="record.fileName" class="primary">{{ record.fileName }}</a>
             <span v-else>--</span>
           </template>
           <!-- 当前是否使用 -->
-          <template slot="used" slot-scope="text">
-            <a-tag v-if="text.used" color="blue"> 正在使用 </a-tag>
+          <template slot="used" slot-scope="{ record }">
+            <a-tag v-if="record.used" color="blue"> 正在使用 </a-tag>
             <span v-else>否</span>
           </template>
           <!-- 操作 -->
-          <template slot="action" slot-scope="text">
+          <template slot="action" slot-scope="{ record }">
             <a-space size="middle">
               <span
                 class="primary pointer"
-                :disabled="text.used ? true : false"
-                @click="handleUse(text.id)"
+                :disabled="record.used ? true : false"
+                @click="handleUse(record.id)"
                 >使用</span
               >
-              <span class="primary pointer" @click="handlePreview(text.id)"
+              <span class="primary pointer" @click="handlePreview(record.id)"
                 >预览</span
               >
               <span
                 class="delete pointer"
                 v-permission="[1]"
-                @click="handleDel(text.id)"
+                @click="handleDel(record.id)"
                 >删除</span
               >
             </a-space>
           </template>
-        </a-table>
+        </y-table>
       </div>
     </div>
     <!-- 站点树弹窗 -->
@@ -127,8 +118,8 @@ import {
   deleteVersion,
 } from "@/services/market";
 import CheckSite from "../modal/CheckSite.vue";
-import { pageSizeOptions } from "@/config/pageConfig.js";
 import { mapGetters } from "vuex";
+import YTable from "@/components/YTable.vue";
 export default {
   props: {
     // 应用信息
@@ -142,15 +133,15 @@ export default {
   },
   components: {
     CheckSite,
+    YTable,
   },
   data() {
     const columns = [
       {
         title: "序号",
-        dataIndex: "num",
         width: "65px",
         scopedSlots: {
-          customRender: "num",
+          customRender: "index",
         },
       },
       {
@@ -181,11 +172,10 @@ export default {
       columns,
       appId: this.$route.query.id,
       appInfo: {}, // 应用信息
-      current: 1,
+      page: 1,
       size: 10,
       total: 0,
       loading: false,
-      pageSizeOptions,
       form: {},
       tableData: [],
       siteVisible: false,
@@ -224,7 +214,7 @@ export default {
     async getVersions() {
       this.loading = true;
       let res = await getVersionList({
-        page: this.current,
+        page: this.page,
         size: this.size,
         appId: this.appId,
       });
@@ -304,17 +294,6 @@ export default {
       });
     },
 
-    // 翻页
-    handleChange(cur) {
-      this.current = cur;
-      this.getVersions();
-    },
-    // 改变每页显示数量
-    showSizeChange(cur, size) {
-      this.current = cur;
-      this.size = size;
-      this.getVersions();
-    },
     // 查看试用范围详情
     checkSite(siteList) {
       this.$refs.CheckSite.getSiteList(siteList);

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

@@ -16,57 +16,51 @@
     </div>
     <!-- 表格 -->
     <div class="table-content">
-      <a-table
+      <y-table
+        :columns="columns"
+        :data="tableData"
+        :pageSize.sync="size"
+        :page.sync="page"
+        :total="total"
+        :loading="loading"
+        :scroll="{ y: 580 }"
         :row-selection="{
           selectedRowKeys: selectedRowKeys,
           onChange: onSelectChange,
         }"
-        :loading="loading"
-        bordered
-        :scroll="{ y: 580 }"
-        :columns="columns"
-        :pagination="{
-          showTotal: (total) => `共 ${total} 条`,
-          current: current,
-          total: total,
-          pageSize: size,
-          showSizeChanger: true,
-          showQuickJumper: true,
-          pageSizeOptions: pageSizeOptions,
-          onChange: handleChange,
-          onShowSizeChange: showSizeChange,
-        }"
-        :data-source="tableData"
-        :rowKey="(record) => record.id"
+        @changePagination="getCategoryList"
       >
-        <!-- 序号 -->
-        <span slot="num" slot-scope="text, record, index">{{
-          (current - 1) * size + index + 1
+        <span slot="index" slot-scope="{ index }">{{
+          (page - 1) * size + index + 1
         }}</span>
 
         <!-- 主题封面 -->
-        <template slot="cover" slot-scope="text">
+        <template slot="cover" slot-scope="{ record }">
           <img
             class="cover"
-            v-if="text.cover"
-            :src="text.cover"
-            @click="handlePreview(text.cover)"
+            v-if="record.cover"
+            :src="record.cover"
+            @click="handlePreview(record.cover)"
           />
           <span v-else>--</span>
         </template>
         <!-- 创建时间 -->
-        <template slot="createTime" slot-scope="text">
-          {{ text.createTime | dateFormat }}
+        <template slot="createTime" slot-scope="{ record }">
+          {{ record.createTime | dateFormat }}
         </template>
 
         <!-- 操作 -->
-        <template slot="action" slot-scope="text">
+        <template slot="action" slot-scope="{ record }">
           <a-space size="middle">
-            <span class="primary pointer" @click="handleEdit(text)">编辑</span>
-            <span class="delete pointer" @click="handleDel(text.id)">删除</span>
+            <span class="primary pointer" @click="handleEdit(record)"
+              >编辑</span
+            >
+            <span class="delete pointer" @click="handleDel(record.id)"
+              >删除</span
+            >
           </a-space>
         </template>
-      </a-table>
+      </y-table>
     </div>
     <!-- 新增、编辑分类 -->
     <AddTheme
@@ -82,14 +76,13 @@
 import { getCategoryList, deleteCategory } from "@/services/market";
 import AddTheme from "../modal/AddTheme";
 import local from "@/utils/local";
-import { pageSizeOptions } from "@/config/pageConfig.js";
+import YTable from "@/components/YTable.vue";
 const columns = [
   {
     title: "序号",
-    dataIndex: "num",
     width: "65px",
     scopedSlots: {
-      customRender: "num",
+      customRender: "index",
     },
   },
   {
@@ -129,6 +122,7 @@ const columns = [
 export default {
   components: {
     AddTheme,
+    YTable,
   },
   data() {
     return {
@@ -137,10 +131,9 @@ export default {
       tableData: [], // 表格数据
       loading: false,
       searchVal: "", // 搜索
-      current: 1,
+      page: 1,
       size: 10,
       total: 0,
-      pageSizeOptions,
       selectedRowKeys: [], // 表格勾选数据
       AddVisible: false,
       title: "新增主题",
@@ -156,7 +149,7 @@ export default {
     async getCategoryList() {
       this.loading = true;
       let res = await getCategoryList({
-        page: this.current,
+        page: this.page,
         size: this.size,
         siteId: this.siteId,
         categoryName: `%${this.searchVal}%`,
@@ -164,8 +157,8 @@ export default {
       this.loading = false;
       let { data, total } = res.data.data;
       if (res.data.code === 1) {
-        if (!data.length && this.current > 1) {
-          this.current -= 1;
+        if (!data.length && this.page > 1) {
+          this.page -= 1;
           this.getCategoryList();
         }
         this.tableData = data;
@@ -181,21 +174,10 @@ export default {
     },
     // 搜索
     onSearch() {
-      this.current = 1;
+      this.page = 1;
       this.selectedRowKeys = [];
       this.getCategoryList();
     },
-    // 翻页
-    handleChange(cur) {
-      this.current = cur;
-      this.getCategoryList();
-    },
-    // 改变每页显示数量
-    showSizeChange(current, size) {
-      this.current = current;
-      this.size = size;
-      this.getCategoryList();
-    },
     // 勾选表格
     onSelectChange(keys) {
       this.selectedRowKeys = keys;

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

@@ -39,40 +39,30 @@
     </div>
     <!-- 表格 -->
     <div class="table-content">
-      <a-table
-        :loading="loading"
-        bordered
+      <y-table
         :columns="columns"
+        :data="tableData"
+        :pageSize.sync="size"
+        :page.sync="page"
+        :total="total"
+        :loading="loading"
         :scroll="{ y: 550 }"
-        :pagination="{
-          showTotal: (total) => `共 ${total} 条`,
-          current: current,
-          total: total,
-          pageSize: size,
-          showSizeChanger: true,
-          showQuickJumper: true,
-          pageSizeOptions: pageSizeOptions,
-          onChange: handleChange,
-          onShowSizeChange: showSizeChange,
-        }"
-        :data-source="tableData"
         :row-selection="{
           selectedRowKeys: selectedRowKeys,
           onChange: onSelectChange,
         }"
-        :rowKey="(record) => record.id"
+        @changePagination="getDatasetList"
       >
-        <!-- 序号 -->
-        <span slot="num" slot-scope="text, record, index">{{
-          (current - 1) * size + index + 1
+        <span slot="index" slot-scope="{ index }">{{
+          (page - 1) * size + index + 1
         }}</span>
 
         <!-- 图片 -->
-        <template slot="img" slot-scope="text">
-          <a-space v-if="text.img">
+        <template slot="img" slot-scope="{ record }">
+          <a-space v-if="record.img">
             <img
               class="pre-item"
-              v-for="(v, i) in filterRes(text.img)"
+              v-for="(v, i) in filterRes(record.img)"
               :key="i"
               :src="v"
               @click="handlePreview('img', v)"
@@ -81,10 +71,10 @@
           <span v-else>--</span>
         </template>
         <!-- 视频 -->
-        <template slot="video" slot-scope="text">
-          <a-space v-if="text.video">
+        <template slot="video" slot-scope="{ record }">
+          <a-space v-if="record.video">
             <video
-              v-for="(v, i) in filterRes(text.video)"
+              v-for="(v, i) in filterRes(record.video)"
               :key="i"
               width="50"
               :src="v"
@@ -94,18 +84,22 @@
           <span v-else>--</span>
         </template>
         <!-- 操作 -->
-        <template slot="action" slot-scope="text">
+        <template slot="action" slot-scope="{ record }">
           <a-space size="middle">
-            <span class="primary pointer" @click="handleEdit(text)">编辑</span>
-            <span class="delete pointer" @click="handleDel(text.id)">删除</span>
+            <span class="primary pointer" @click="handleEdit(record)"
+              >编辑</span
+            >
+            <span class="delete pointer" @click="handleDel(record.id)"
+              >删除</span
+            >
           </a-space>
         </template>
-      </a-table>
+      </y-table>
     </div>
     <!-- 新增数据 -->
     <AddData
       ref="AddData"
-      @addSuccess="getDatasetList"
+      @success="getDatasetList"
       :AddVisible.sync="AddVisible"
       :title="title"
     ></AddData>
@@ -119,13 +113,13 @@
 
 <script>
 import AddData from "../modal/AddData.vue";
-import { pageSizeOptions } from "@/config/pageConfig.js";
 import {
   getDatasetList,
   deleteDataset,
   getTempleteList,
 } from "@/services/market";
 import PrevieModal from "@/components/PrevieModal.vue";
+import YTable from "@/components/YTable.vue";
 export default {
   // props: {
   //   // 应用信息
@@ -140,6 +134,7 @@ export default {
   components: {
     AddData,
     PrevieModal,
+    YTable,
   },
   data() {
     return {
@@ -147,10 +142,9 @@ export default {
       api2: process.env.VUE_APP_API_IMG_URL,
       appId: this.$route.query.id,
       loading: false,
-      current: 1,
+      page: 1,
       size: 10,
       total: 0,
-      pageSizeOptions,
       searchVal: "",
       tableData: [],
       AddVisible: false,
@@ -172,7 +166,7 @@ export default {
         title: "序号",
         width: "65px",
         scopedSlots: {
-          customRender: "num",
+          customRender: "index",
         },
       };
       let action = {
@@ -203,7 +197,7 @@ export default {
                 let row = record.appInfoFieldList.find(
                   (item) => item.fieldCode == v.fieldCode
                 );
-                if (row && row.fieldTypeValue && !row.serviceApiParams) {
+                if (row && row.fieldTypeValue && !row.serviceApi) {
                   let fieldTypeValue = JSON.parse(row.fieldTypeValue);
                   return fieldTypeValue[text];
                 } else {
@@ -258,7 +252,7 @@ export default {
       let obj = {};
       let orConditionList = [];
       let form = {
-        page: this.current,
+        page: this.page,
         size: this.size,
         appId: this.appId,
       };
@@ -275,8 +269,8 @@ export default {
       this.loading = false;
       if (res.data.code === 1) {
         let { data, total } = res.data.data;
-        if (!data.length && this.current > 1) {
-          this.current -= 1;
+        if (!data.length && this.page > 1) {
+          this.page -= 1;
           this.getDatasetList();
         }
         data.forEach((v) => {
@@ -301,21 +295,10 @@ export default {
     },
     // 搜索
     onSearch() {
-      this.current = 1;
+      this.page = 1;
       this.selectedRowKeys = [];
       this.getDatasetList();
     },
-    // 翻页
-    handleChange(cur) {
-      this.current = cur;
-      this.getDatasetList();
-    },
-    // 改变每页显示数量
-    showSizeChange(current, size) {
-      this.current = current;
-      this.size = size;
-      this.getDatasetList();
-    },
     // 编辑
     handleEdit(row) {
       this.title = "编辑";

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

@@ -17,44 +17,41 @@
     </div>
     <!-- 表格 -->
     <div class="table-content">
-      <a-table
+      <y-table
+        :columns="columns"
+        :data="tableData"
+        :pageSize.sync="size"
+        :page.sync="page"
+        :total="total"
         :loading="loading"
-        bordered
         :scroll="{ y: 550 }"
-        :columns="columns"
-        :pagination="{
-          showTotal: (total) => `共 ${total} 条`,
-          current: current,
-          total: total,
-          pageSize: size,
-          showSizeChanger: true,
-          showQuickJumper: true,
-          pageSizeOptions: pageSizeOptions,
-          onChange: handleChange,
-          onShowSizeChange: showSizeChange,
-        }"
-        :data-source="tableData"
         :row-selection="{
           selectedRowKeys: selectedRowKeys,
           onChange: onSelectChange,
         }"
-        :rowKey="(record) => record.id"
+        @changePagination="getAppList"
       >
-        <!-- 序号 -->
-        <span slot="num" slot-scope="text, record, index">{{ index + 1 }}</span>
+        <span slot="index" slot-scope="{ index }">{{
+          (page - 1) * size + index + 1
+        }}</span>
+
         <!-- 允许为空 -->
-        <template slot="fieldNull" slot-scope="text">
-          <a-tag v-if="text.fieldNull === 1" color="green"> 是 </a-tag>
+        <template slot="fieldNull" slot-scope="{ record }">
+          <a-tag v-if="record.fieldNull === 1" color="green"> 是 </a-tag>
           <a-tag v-else color="red"> 否 </a-tag>
         </template>
         <!-- 操作 -->
-        <template slot="action" slot-scope="text">
+        <template slot="action" slot-scope="{ record }">
           <a-space size="middle">
-            <span class="primary pointer" @click="handleEdit(text)">编辑</span>
-            <span class="delete pointer" @click="handleDel(text.id)">删除</span>
+            <span class="primary pointer" @click="handleEdit(record)"
+              >编辑</span
+            >
+            <span class="delete pointer" @click="handleDel(record.id)"
+              >删除</span
+            >
           </a-space>
         </template>
-      </a-table>
+      </y-table>
     </div>
     <!-- 新增数据 -->
     <AddField
@@ -69,7 +66,7 @@
 <script>
 import AddField from "../modal/AddField.vue";
 import { getTempleteList, deleteTemplete } from "@/services/market";
-import { pageSizeOptions } from "@/config/pageConfig.js";
+import YTable from "@/components/YTable.vue";
 export default {
   // props: {
   //   // 应用信息
@@ -83,6 +80,7 @@ export default {
   // },
   components: {
     AddField,
+    YTable,
   },
   data() {
     const columns = [
@@ -90,7 +88,7 @@ export default {
         title: "序号",
         width: "65px",
         scopedSlots: {
-          customRender: "num",
+          customRender: "index",
         },
       },
       {
@@ -108,9 +106,7 @@ export default {
       },
       {
         title: "数据类型",
-        customRender: (text) => {
-          return <span>{text.dataType ? text.dataType : "--"}</span>;
-        },
+        dataIndex: "dataType",
       },
       {
         title: "数据长度",
@@ -142,10 +138,9 @@ export default {
       appId: this.$route.query.id,
       columns,
       loading: false,
-      current: 1,
+      page: 1,
       size: 10,
       total: 0,
-      pageSizeOptions,
       searchVal: "",
       tableData: [],
       fieldVisible: false,
@@ -161,7 +156,7 @@ export default {
     async getTempleteList() {
       this.loading = true;
       let res = await getTempleteList({
-        page: this.current,
+        page: this.page,
         size: this.size,
         appId: this.appId,
         fieldName: this.searchVal,
@@ -169,8 +164,8 @@ export default {
       this.loading = false;
       if (res.data.code === 1) {
         let { data, total } = res.data.data;
-        if (!data.length && this.current > 1) {
-          this.current -= 1;
+        if (!data.length && this.page > 1) {
+          this.page -= 1;
           this.getTempleteList();
         }
         this.tableData = data.sort((a, b) => {
@@ -187,21 +182,11 @@ export default {
     },
     // 搜索
     onSearch() {
-      this.current = 1;
+      this.page = 1;
       this.selectedRowKeys = [];
       this.getTempleteList();
     },
-    // 翻页
-    handleChange(cur) {
-      this.current = cur;
-      this.getTempleteList();
-    },
-    // 改变每页显示数量
-    showSizeChange(current, size) {
-      this.current = current;
-      this.size = size;
-      this.getTempleteList();
-    },
+
     // 编辑
     handleEdit(row) {
       this.title = "编辑";

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

@@ -22,91 +22,86 @@
     </div>
     <!-- 表格 -->
     <div class="table-content">
-      <a-table
+      <y-table
+        :columns="columns"
+        :data="tableData"
+        :pageSize.sync="size"
+        :page.sync="page"
+        :total="total"
+        :loading="loading"
+        :scroll="{ y: 560 }"
         :row-selection="{
           selectedRowKeys: selectedRowKeys,
           onChange: onSelectChange,
         }"
-        :loading="loading"
-        bordered
-        :scroll="{ y: 560 }"
-        :columns="columns"
-        :pagination="{
-          showTotal: (total) => `共 ${total} 条`,
-          current: current,
-          total: total,
-          pageSize: size,
-          showSizeChanger: true,
-          showQuickJumper: true,
-          pageSizeOptions: pageSizeOptions,
-          onChange: handleChange,
-          onShowSizeChange: showSizeChange,
-        }"
-        :data-source="tableData"
-        :rowKey="(record) => record.id"
+        @changePagination="getAppList"
       >
-        <!-- 序号 -->
-        <span slot="num" slot-scope="text, record, index">{{
-          (current - 1) * size + index + 1
+        <span slot="index" slot-scope="{ index }">{{
+          (page - 1) * size + index + 1
         }}</span>
+
         <!-- 图标 -->
-        <template slot="appIconPath" slot-scope="text">
+        <template slot="appIconPath" slot-scope="{ record }">
           <img
-            v-if="text.appIconPath"
+            v-if="record.appIconPath"
             class="pointer"
             height="20"
             width="20"
-            :src="text.appIconPath"
-            @click="handlePreview(text.appIconPath)"
+            :src="record.appIconPath"
+            @click="handlePreview(record.appIconPath)"
           />
           <span v-else>--</span>
         </template>
         <!-- 主题类型 -->
-        <template slot="appThemeName" slot-scope="text">
-          {{ filterItems(text.appThemeName) }}
+        <template slot="appThemeName" slot-scope="{ record }">
+          {{ filterItems(record.appThemeName) }}
         </template>
         <!-- 简介 -->
-        <template slot="summary" slot-scope="text">
-          <span :title="text.summary">{{
-            text.summary ? text.summary : "--"
+        <template slot="summary" slot-scope="{ record }">
+          <span :title="record.summary">{{
+            record.summary ? record.summary : "--"
           }}</span>
         </template>
         <!-- 版本 -->
-        <template slot="version" slot-scope="text">
-          {{ text.version || text.version == 0 ? "v" + text.version : "--" }}
+        <template slot="version" slot-scope="{ record }">
+          {{
+            record.version || record.version == 0 ? "v" + record.version : "--"
+          }}
         </template>
         <!-- 类型 -->
-        <template slot="appType" slot-scope="text">
-          {{ text.appType === 1 ? "应用程序" : "URL" }}
+        <template slot="appType" slot-scope="{ record }">
+          {{ record.appType === 1 ? "应用程序" : "URL" }}
         </template>
         <!-- 上下架 -->
-        <template slot="shelves" slot-scope="text">
+        <template slot="shelves" slot-scope="{ record }">
           <YSwitch
             checkedChildren="上架"
             unCheckedChildren="下架"
-            v-model="text.shelves"
-            @change="changeShelves(text)"
+            v-model="record.shelves"
+            @change="changeShelves(record)"
           ></YSwitch>
         </template>
         <!-- 操作 -->
-        <template slot="action" slot-scope="text">
+        <template slot="action" slot-scope="{ record }">
           <a-space size="middle">
-            <span class="primary pointer" @click="handleCloneAppData(text)"
+            <span class="primary pointer" @click="handleCloneAppData(record)"
               >克隆数据</span
             >
-            <span class="primary pointer" @click="handleEdit(text)">编辑</span>
-            <span class="primary pointer" @click="handleCheck(text.id)"
+            <span class="primary pointer" @click="handleEdit(record)"
+              >编辑</span
+            >
+            <span class="primary pointer" @click="handleCheck(record.id)"
               >查看</span
             >
             <span
               class="delete pointer"
-              :class="{ unDelete: userInfo.id != 1 && text.distribute }"
-              @click="handleDel(text.distribute, text.id)"
+              :class="{ unDelete: userInfo.id != 1 && record.distribute }"
+              @click="handleDel(record.distribute, record.id)"
               >删除</span
             >
           </a-space>
         </template>
-      </a-table>
+      </y-table>
     </div>
     <!-- 新增应用 -->
     <AddApp
@@ -141,6 +136,7 @@ import AddApp from "../modal/AddApp.vue";
 import CheckSite from "../modal/CheckSite.vue";
 import ChangeThem from "../modal/ChangeThem.vue";
 import CloneData from "../modal/CloneData.vue";
+import YTable from "@/components/YTable.vue";
 import {
   getAppList,
   deleteApp,
@@ -149,14 +145,12 @@ import {
 } from "@/services/market";
 import local from "@/utils/local";
 import { mapMutations, mapGetters } from "vuex";
-import { pageSizeOptions } from "@/config/pageConfig.js";
 const columns = [
   {
     title: "序号",
-    dataIndex: "num",
     width: "65px",
     scopedSlots: {
-      customRender: "num",
+      customRender: "index",
     },
   },
   {
@@ -206,6 +200,7 @@ export default {
     CheckSite,
     ChangeThem,
     CloneData,
+    YTable,
   },
   data() {
     return {
@@ -215,10 +210,9 @@ export default {
       tableData: [], // 表格数据
       loading: false,
       searchVal: "", // 搜索
-      current: 1,
+      page: 1,
       size: 10,
       total: 0,
-      pageSizeOptions,
       selectedRowKeys: [], // 表格勾选id列表
       selectedAppList: [], // 表格勾选信息列表
       AddVisible: false,
@@ -258,7 +252,7 @@ export default {
     async getAppList() {
       this.loading = true;
       let res = await getAppList({
-        page: this.current,
+        page: this.page,
         size: this.size,
         siteId: this.siteId,
         appName: `%${this.searchVal}%`,
@@ -269,8 +263,8 @@ export default {
       this.dict = dict;
       this.SET_appDict(dict);
       if (res.data.code === 1) {
-        if (!data.length && this.current > 1) {
-          this.current -= 1;
+        if (!data.length && this.page > 1) {
+          this.page -= 1;
           this.getAppList();
         }
         this.tableData = data;
@@ -293,20 +287,12 @@ export default {
     },
     // 搜索
     onSearch() {
-      this.current = 1;
-      this.getAppList();
-    },
-    // 翻页
-    handleChange(cur) {
-      this.current = cur;
-      this.getAppList();
-    },
-    // 改变每页显示数量
-    showSizeChange(current, size) {
-      this.current = current;
-      this.size = size;
+      this.page = 1;
+      this.selectedRowKeys = [];
+      this.selectedAppList = [];
       this.getAppList();
     },
+
     // 勾选表格
     onSelectChange(keys, rows) {
       this.selectedRowKeys = keys;
@@ -381,6 +367,8 @@ export default {
           let { code, msg } = res.data;
           if (code === 1) {
             _this.$message.success(msg);
+            _this.selectedRowKeys = [];
+            _this.selectedAppList = [];
             _this.getAppList();
           }
         },

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

@@ -22,91 +22,86 @@
     </div>
     <!-- 表格 -->
     <div class="table-content">
-      <a-table
+      <y-table
+        :columns="columns"
+        :data="tableData"
+        :pageSize.sync="size"
+        :page.sync="page"
+        :total="total"
+        :loading="loading"
+        :scroll="{ y: 560 }"
         :row-selection="{
           selectedRowKeys: selectedRowKeys,
           onChange: onSelectChange,
         }"
-        :loading="loading"
-        bordered
-        :scroll="{ y: 560 }"
-        :columns="columns"
-        :pagination="{
-          showTotal: (total) => `共 ${total} 条`,
-          current: current,
-          total: total,
-          pageSize: size,
-          showSizeChanger: true,
-          showQuickJumper: true,
-          pageSizeOptions: pageSizeOptions,
-          onChange: handleChange,
-          onShowSizeChange: showSizeChange,
-        }"
-        :data-source="tableData"
-        :rowKey="(record) => record.id"
+        @changePagination="getAppList"
       >
-        <!-- 序号 -->
-        <span slot="num" slot-scope="text, record, index">{{
-          (current - 1) * size + index + 1
+        <span slot="index" slot-scope="{ index }">{{
+          (page - 1) * size + index + 1
         }}</span>
+
         <!-- 图标 -->
-        <template slot="appIconPath" slot-scope="text">
+        <template slot="appIconPath" slot-scope="{ record }">
           <img
-            v-if="text.appIconPath"
+            v-if="record.appIconPath"
             class="pointer"
             height="20"
             width="20"
-            :src="text.appIconPath"
-            @click="handlePreview(text.appIconPath)"
+            :src="record.appIconPath"
+            @click="handlePreview(record.appIconPath)"
           />
           <span v-else>--</span>
         </template>
         <!-- 主题类型 -->
-        <template slot="appThemeName" slot-scope="text">
-          {{ filterItems(text.appThemeName) }}
+        <template slot="appThemeName" slot-scope="{ record }">
+          {{ filterItems(record.appThemeName) }}
         </template>
         <!-- 简介 -->
-        <template slot="summary" slot-scope="text">
-          <span :title="text.summary">{{
-            text.summary ? text.summary : "--"
+        <template slot="summary" slot-scope="{ record }">
+          <span :title="record.summary">{{
+            record.summary ? record.summary : "--"
           }}</span>
         </template>
         <!-- 版本 -->
-        <template slot="version" slot-scope="text">
-          {{ text.version || text.version == 0 ? "v" + text.version : "--" }}
+        <template slot="version" slot-scope="{ record }">
+          {{
+            record.version || record.version == 0 ? "v" + record.version : "--"
+          }}
         </template>
         <!-- 类型 -->
-        <template slot="appType" slot-scope="text">
-          {{ text.appType === 1 ? "应用程序" : "URL" }}
+        <template slot="appType" slot-scope="{ record }">
+          {{ record.appType === 1 ? "应用程序" : "URL" }}
         </template>
         <!-- 上下架 -->
-        <template slot="shelves" slot-scope="text">
+        <template slot="shelves" slot-scope="{ record }">
           <YSwitch
             checkedChildren="上架"
             unCheckedChildren="下架"
-            v-model="text.shelves"
-            @change="changeShelves(text)"
+            v-model="record.shelves"
+            @change="changeShelves(record)"
           ></YSwitch>
         </template>
         <!-- 操作 -->
-        <template slot="action" slot-scope="text">
+        <template slot="action" slot-scope="{ record }">
           <a-space size="middle">
-            <span class="primary pointer" @click="handleCloneAppData(text)"
+            <span class="primary pointer" @click="handleCloneAppData(record)"
               >克隆数据</span
             >
-            <span class="primary pointer" @click="handleEdit(text)">编辑</span>
-            <span class="primary pointer" @click="handleCheck(text.id)"
+            <span class="primary pointer" @click="handleEdit(record)"
+              >编辑</span
+            >
+            <span class="primary pointer" @click="handleCheck(record.id)"
               >查看</span
             >
             <span
               class="delete pointer"
-              :class="{ unDelete: userInfo.id != 1 && text.distribute }"
-              @click="handleDel(text.distribute, text.id)"
+              :class="{ unDelete: userInfo.id != 1 && record.distribute }"
+              @click="handleDel(record.distribute, record.id)"
               >删除</span
             >
           </a-space>
         </template>
-      </a-table>
+      </y-table>
     </div>
     <!-- 新增应用 -->
     <AddApp
@@ -149,14 +144,13 @@ import {
 } from "@/services/market";
 import local from "@/utils/local";
 import { mapMutations, mapGetters } from "vuex";
-import { pageSizeOptions } from "@/config/pageConfig.js";
+import YTable from "@/components/YTable.vue";
 const columns = [
   {
     title: "序号",
-    dataIndex: "num",
     width: "65px",
     scopedSlots: {
-      customRender: "num",
+      customRender: "index",
     },
   },
   {
@@ -206,6 +200,7 @@ export default {
     CheckSite,
     ChangeThem,
     CloneData,
+    YTable,
   },
   data() {
     return {
@@ -215,10 +210,9 @@ export default {
       tableData: [], // 表格数据
       loading: false,
       searchVal: "", // 搜索
-      current: 1,
+      page: 1,
       size: 10,
       total: 0,
-      pageSizeOptions,
       selectedRowKeys: [], // 表格勾选id列表
       selectedAppList: [], // 表格勾选信息列表
       AddVisible: false,
@@ -258,7 +252,7 @@ export default {
     async getAppList() {
       this.loading = true;
       let res = await getAppList({
-        page: this.current,
+        page: this.page,
         size: this.size,
         siteId: this.siteId,
         appName: `%${this.searchVal}%`,
@@ -269,8 +263,8 @@ export default {
       this.dict = dict;
       this.SET_appDict(dict);
       if (res.data.code === 1) {
-        if (!data.length && this.current > 1) {
-          this.current -= 1;
+        if (!data.length && this.page > 1) {
+          this.page -= 1;
           this.getAppList();
         }
         this.tableData = data;
@@ -293,20 +287,12 @@ export default {
     },
     // 搜索
     onSearch() {
-      this.current = 1;
-      this.getAppList();
-    },
-    // 翻页
-    handleChange(cur) {
-      this.current = cur;
-      this.getAppList();
-    },
-    // 改变每页显示数量
-    showSizeChange(current, size) {
-      this.current = current;
-      this.size = size;
+      this.page = 1;
+      this.selectedRowKeys = [];
+      this.selectedAppList = [];
       this.getAppList();
     },
+
     // 勾选表格
     onSelectChange(keys, rows) {
       this.selectedRowKeys = keys;
@@ -382,6 +368,8 @@ export default {
           let { code, msg } = res.data;
           if (code === 1) {
             _this.$message.success(msg);
+            _this.selectedRowKeys = [];
+            _this.selectedAppList = [];
             _this.getAppList();
           }
         },

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

@@ -33,21 +33,12 @@
             </a-select>
           </a-form-model-item>
           <a-form-model-item label="应用图标" prop="appIconPath">
-            <a-upload
-              name="file"
-              list-type="picture-card"
-              :action="api + 'base/file/commonupload'"
-              :file-list="iconFileList"
-              @change="handleChangeIcon"
-              :accept="accept"
-              :before-upload="iconBeforeUpload"
-              @preview="handlePreview"
-            >
-              <div v-if="iconFileList.length < 1">
-                <a-icon type="plus" />
-                <div class="ant-upload-text">选择图标</div>
-              </div>
-            </a-upload>
+            <YUpload
+              accept=".png,.jpg,.jpeg,.svg"
+              :limit="1"
+              v-model="form.appIconPath"
+              listType="picture-card"
+            ></YUpload>
           </a-form-model-item>
           <a-form-model-item label="应用简介" prop="summary">
             <a-textarea
@@ -91,18 +82,16 @@
             prop="filePath"
             v-if="form.appType === 1"
           >
-            <a-upload
-              name="file"
-              :action="api + 'base/file/commonupload'"
-              :multiple="false"
-              :file-list="fileList"
-              @change="handleChangeFile"
-              accept="application/x-zip-compressed"
+            <YUpload
+              accept=".zip"
+              :limit="1"
+              v-model="form.filePath"
+              @onSuccess="appUpload"
             >
               <a-button type="primary">
                 <a-icon type="upload" /> .zip文件
               </a-button>
-            </a-upload>
+            </YUpload>
           </a-form-model-item>
           <a-form-model-item v-else label="应用URL" prop="url">
             <a-input v-model="form.url" placeholder="请输入应用URL" />
@@ -158,10 +147,12 @@ import YSwitch from "../../../../components/yswitch/YSwitch.vue";
 import { saveApp } from "@/services/market";
 import { mapGetters } from "vuex";
 import { checkCodeNumber } from "@/utils/validate";
+import YUpload from "@/components/YUpload.vue";
 // import local from "@/utils/local";
 export default {
   components: {
     YSwitch,
+    YUpload,
   },
   props: {
     title: {
@@ -182,9 +173,7 @@ export default {
   },
   data() {
     return {
-      accept: "image/jpeg,image/png,image/svg+xml",
       api: process.env.VUE_APP_API_BASE_URL + "/",
-      iconFileList: [],
       labelCol: {
         span: 3,
       },
@@ -249,7 +238,6 @@ export default {
           { required: true, message: "请选择是否有更新", trigger: "change" },
         ],
       },
-      fileList: [],
       beFrom: "", // 来自终端还是移动端
     };
   },
@@ -269,14 +257,10 @@ export default {
     // 关闭
     onClose() {
       this.$refs.form.resetFields();
-      this.fileList = [];
-      this.iconFileList = [];
       this.loading = false;
       this.Visible = false;
     },
     resetForm() {
-      this.fileList = [];
-      this.iconFileList = [];
       this.$refs.form.resetFields();
     },
     // 提交
@@ -295,81 +279,7 @@ export default {
         }
       });
     },
-    // 图标上传之前
-    iconBeforeUpload(file) {
-      const isJpgOrPng =
-        file.type === "image/jpeg" ||
-        file.type === "image/png" ||
-        file.type === "image/svg+xml";
-      if (!isJpgOrPng) {
-        this.$message.error("请上传jpeg、png或者svg格式图片!");
-      }
-      const isLt5M = file.size / 1024 / 1024 < 5;
-      if (!isLt5M) {
-        this.$message.error("图片大小不能超过 5MB!");
-      }
-      return isJpgOrPng && isLt5M;
-    },
-    // 上传图标
-    handleChangeIcon({ file, fileList }) {
-      if (
-        file.status &&
-        file.status != "removed" &&
-        file.response &&
-        file.response.code == -1
-      ) {
-        this.$message.error(file.response.msg);
-        fileList = fileList.filter((file) => file.response.code != -1);
-      }
-      this.iconFileList = [...fileList].slice(-1);
-      this.iconFileList = this.iconFileList.map((v) => {
-        if (v.response) {
-          v.url = v.response.url;
-        }
-        return v;
-      });
-      if (this.iconFileList[0]) {
-        this.form.appIconPath = this.iconFileList[0].url;
-      } else {
-        this.form.appIconPath = "";
-      }
-    },
-    // 预览
-    handlePreview(info) {
-      this.$viewerApi({
-        images: [info.url],
-      });
-    },
-    // 上传应用
-    handleChangeFile(info) {
-      if (
-        info.file.status &&
-        info.file.status != "removed" &&
-        info.file.response &&
-        info.file.response.code == -1
-      ) {
-        this.$message.error(info.file.response.msg);
-        info.fileList = info.fileList.filter(
-          (file) => file.response.code != -1
-        );
-      }
-      let fileList = [...info.fileList];
-      fileList = fileList.slice(-1);
-      fileList = fileList.map((file) => {
-        if (file.response) {
-          file.url = file.response.url;
-        }
-        return file;
-      });
-      this.fileList = fileList;
-      if (this.fileList.length) {
-        this.form.fileName = this.fileList[0].name;
-        this.form.filePath = this.fileList[0].url;
-      } else {
-        this.form.filePath = "";
-        this.form.fileName = "";
-      }
-    },
+
     // 新增
     onAdd(type) {
       Object.assign(this.form, this.$options.data().form);
@@ -380,22 +290,6 @@ export default {
     onEdit(data) {
       this.$nextTick(() => {
         this.form = { ...data };
-        this.fileList = [
-          {
-            uid: "-1",
-            name: this.form.fileName,
-            status: "done",
-            url: this.form.filePath,
-          },
-        ];
-        this.iconFileList = [
-          {
-            uid: "-2",
-            name: this.form.appIconPath,
-            status: "done",
-            url: this.form.appIconPath,
-          },
-        ];
       });
     },
 
@@ -411,9 +305,12 @@ export default {
       } else {
         this.form.filePath = "";
         this.form.fileName = "";
-        this.fileList = [];
       }
     },
+    appUpload({ fileList }) {
+      let fileName = fileList[0] ? fileList[0].name : "";
+      this.form.fileName = fileName;
+    },
   },
 };
 </script>

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

@@ -21,21 +21,12 @@
           <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>
+          <YUpload
+            accept=".png,.jpg,.jpeg,.svg"
+            :limit="1"
+            v-model="form.cover"
+            listType="picture-card"
+          ></YUpload>
         </a-form-model-item>
         <a-form-model-item label="排序" prop="sort">
           <a-input-number v-model="form.sort" :min="1" />
@@ -52,6 +43,7 @@
 <script>
 import { saveCategory } from "@/services/market";
 import local from "@/utils/local";
+import YUpload from "@/components/YUpload.vue";
 export default {
   props: {
     addVisile: {
@@ -64,12 +56,11 @@ export default {
       default: "新增分类",
     },
   },
-  components: {},
+  components: {
+    YUpload,
+  },
   data() {
     return {
-      accept: "image/jpeg,image/png",
-      api: process.env.VUE_APP_API_BASE_URL + "/",
-      fileList: [],
       form: {
         siteId: local.getLocal("siteId"), // 站点id
         siteName: local.getLocal("siteName"), // 站点名称
@@ -110,21 +101,10 @@ export default {
     onEdit(data) {
       this.$nextTick(() => {
         this.form = { ...data };
-        if (this.form.cover) {
-          this.fileList = [
-            {
-              uid: "-2",
-              name: this.form.cover,
-              status: "done",
-              url: this.form.cover,
-            },
-          ];
-        }
       });
     },
     // 关闭弹窗
     handleClose() {
-      this.fileList = [];
       this.$refs.form.resetFields();
       this.Visible = false;
     },
@@ -142,52 +122,9 @@ 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({ file, fileList }) {
-      if (
-        file.status &&
-        file.status != "removed" &&
-        file.response &&
-        file.response.code == -1
-      ) {
-        this.$message.error(file.response.msg);
-        fileList = fileList.filter((file) => file.response.code != -1);
-      }
-      this.fileList = [...fileList].slice(-1);
-      this.fileList = this.fileList.map((v) => {
-        if (v.response) {
-          v.url = v.response.url;
-        }
-        return v;
-      });
-      if (this.fileList[0]) {
-        this.form.cover = this.fileList[0].url;
-      } else {
-        this.form.cover = "";
-      }
-    },
-    // 预览
-    handlePreview(info) {
-      this.$viewerApi({
-        images: [info.url],
-      });
-    },
+
     // 重置
     handleReset() {
-      this.fileList = [];
       this.$refs.form.resetFields();
     },
   },