logo修改

src/api/sys/general.ts

@@ -1,6 +1,7 @@
 import { defHttp } from '/@/utils/http/axios';
 import {
   CommonRowModel,
+  AppInfoModel,
   GroupModel,
   AddConfigInfoParams,
   // EditConfigInfoParams,
@@ -10,6 +11,7 @@ import {
 } from './model/generalModel';
 
 enum Api {
+  appUrl = '/general/logo', // 项目title 和 logo
   GroupUrl = '/general/group/', // 系统配置分组
   ConfigUrl = '/general/config/', // 系统配置表
   FileUrl = '/general/file/', // 上传文件
@@ -18,6 +20,15 @@ enum Api {
 }
 
 /**
+ * @description: 获取项目title logo
+ */
+export function getAppInfo() {
+  return defHttp.request<AppInfoModel>({
+    url: Api.appUrl,
+    method: 'GET',
+  });
+}
+/**
  * @description: 获取系统配置分组
  */
 export function getConfigGroup() {

src/api/sys/model/generalModel.ts

@@ -2,13 +2,14 @@
  * @description: Get common information return value
  */
 export interface CommonRowModel {
-  row: {
-    basic: any;
-    dictionary: object;
-    email: object;
-    example: object;
-    user: object;
-  };
+  rows: object[];
+}
+/**
+ * @description: Get app information return value
+ */
+export interface AppInfoModel {
+  name: string;
+  logo: string;
 }
 
 /**

src/components/Upload/src/BasicUpload.vue

@@ -11,12 +11,12 @@
             {{ fileList.length }}
           </template>
         </template>
-        <a-button @click="openPreviewModal">
+        <!-- <a-button @click="openPreviewModal">
           <Icon icon="bi:eye" />
           <template v-if="fileList.length && showPreviewNumber">
             {{ fileList.length }}
           </template>
-        </a-button>
+        </a-button> -->
       </Tooltip>
     </a-button-group>
 
@@ -74,7 +74,6 @@
         const value = { ...attrs, ...props };
         return omit(value, 'onChange');
       });
-      console.log(`props.value---uplaod`, props.value);
       watch(
         () => props.value,
         (value = []) => {

src/components/Upload/src/UploadModal.vue

@@ -250,7 +250,8 @@
         for (const item of fileListRef.value) {
           const { status, responseData } = item;
           if (status === UploadResultStatus.SUCCESS && responseData) {
-            fileList.push(responseData.url);
+            console.log(`responseData`, responseData);
+            fileList.push(responseData.result.url);
           }
         }
         // 存在一个上传成功的即可保存

src/store/modules/app.ts

@@ -10,7 +10,7 @@ import { Persistent } from '/@/utils/cache/persistent';
 import { darkMode } from '/@/settings/designSetting';
 import { resetRouter } from '/@/router';
 import { deepMerge } from '/@/utils';
-import { getConfigInfo } from '/@/api/sys/general';
+import { getAppInfo } from '/@/api/sys/general';
 
 interface AppState {
   darkMode?: ThemeEnum;
@@ -111,10 +111,9 @@ export const useAppStore = defineStore({
       }
     },
     async setAppInfoAction() {
-      const res = await getConfigInfo();
-      const config = res.row.basic.list;
-      this.setAppTitle(config[0].value);
-      this.setAppLogo(config[1].value);
+      const res = await getAppInfo();
+      this.setAppTitle(res.name);
+      this.setAppLogo(res.logo);
     },
   },
 });

src/views/general/attachment/backup.vue

@@ -0,0 +1,355 @@
+<template>
+  <CollapseContainer
+    class="attachment-container"
+    title="附件管理"
+    :canExpan="false"
+    helpMessage="主要用于管理上传到服务器或第三方存储的数据"
+  >
+    <a-button type="default" class="mr-2"> 全部 </a-button>
+    <a-button type="default" class="mr-2"> 图片 </a-button>
+    <a-button type="default" class="mr-2"> 音频 </a-button>
+    <a-button type="default" class="mr-2"> 视频 </a-button>
+    <a-button type="default" class="mr-2"> 文档 </a-button>
+    <a-button type="default" class="mr-2"> 应用 </a-button>
+    <a-button type="default" class="mr-2"> 压缩包 </a-button>
+    <BasicTable ref="tableRef" :canResize="true" @register="registerTable">
+      <template #action="{ record, column }">
+        <TableAction :actions="createActions(record, column)" stopButtonPropagation />
+      </template>
+      <template #toolbar>
+        <a-upload
+          :showUploadList="false"
+          :multiple="false"
+          :before-upload="beforeUpload"
+          @change="handleChange"
+        >
+          <a-button type="primary" :disabled="disabled">
+            {{ t('component.upload.upload') }}
+          </a-button>
+        </a-upload>
+        <a-button color="error" @click="deleteBatches">
+          {{ t('common.delText') }}
+        </a-button>
+      </template>
+      <a-modal :visible="progress_show" :footer="null" :closable="false">
+        <div class="upload-progress">
+          <p><strong>文件上传中</strong></p>
+          <a-progress :percent="percent" />
+        </div>
+      </a-modal>
+    </BasicTable>
+  </CollapseContainer>
+</template>
+<script lang="ts">
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { defineComponent, nextTick, reactive, ref, toRefs, unref } from 'vue';
+  // import Upload from '/@/components/customComponents/upload.vue';
+  import { Upload, Progress, Modal } from 'ant-design-vue';
+  import { CollapseContainer } from '/@/components/Container/index';
+  import { adapt } from '/@/utils/adapt';
+  import { useI18n } from '/@/hooks/web/useI18n';
+  import md5 from 'crypto-js/md5';
+  import {
+    BasicTable,
+    useTable,
+    TableAction,
+    ActionItem,
+    EditRecordRow,
+    TableActionType,
+  } from '/@/components/Table';
+  import { columns } from './data';
+  import { getAttachmentList } from '/@/api/sys/general';
+  import { uploadApi } from '/@/api/sys/upload';
+
+  interface FileItem {
+    uid: string;
+    name?: string;
+    status?: string;
+    response?: string;
+    url?: string;
+    type?: string;
+    size: number;
+    originFileObj: any;
+  }
+
+  export default defineComponent({
+    name: 'Attchment',
+    components: {
+      CollapseContainer,
+      BasicTable,
+      TableAction,
+      [Upload.name]: Upload,
+      [Modal.name]: Modal,
+      [Progress.name]: Progress,
+    },
+    setup() {
+      const { t } = useI18n();
+      const { createMessage } = useMessage();
+      const { success /*, error */ } = createMessage;
+      const tableHeight = adapt().tableHeight;
+      const state = reactive({
+        groupList: [] as object[],
+        group: 'basic',
+        disabled: false,
+        tempThreads: 5,
+        progress_show: false,
+        percent: 0,
+        chunkRetry: 4, // 重试次数限制
+      });
+      const tableRef = ref<Nullable<TableActionType>>(null);
+      const [registerTable] = useTable({
+        columns: columns,
+        maxHeight: tableHeight,
+        afterFetch: afterFetch,
+        api: getAttachmentList,
+        actionColumn: {
+          width: 160,
+          title: '操作',
+          dataIndex: 'action',
+          slots: { customRender: 'action' },
+          fixed: undefined,
+        },
+        showIndexColumn: false,
+        pagination: true,
+      });
+      function afterFetch(res) {
+        console.log(`res`, res);
+      }
+      function getTableAction() {
+        // 获取组件
+        const tableAction = unref(tableRef);
+        if (!tableAction) {
+          throw new Error('tableAction is null');
+        }
+        return tableAction;
+      }
+
+      function getFileMD5(file) {
+        return md5(file.name + file.size + file.lastModifiedDate);
+      }
+
+      async function mergeRequest(fileMd5) {
+        return new Promise((resolve, reject) => {
+          const mergeFormData = new FormData();
+          mergeFormData.append('fileMd5', fileMd5);
+        });
+      }
+
+      function createFileChunk(file, size) {
+        const fileChunkList: object[] = [];
+        let count = 0;
+        let index = 0;
+        while (count < file.size) {
+          fileChunkList.push({
+            file: file.slice(count, count + size),
+            hash: file.name + '-' + index, // 生成切片名称
+          });
+          count += size;
+          index += 1;
+        }
+        return fileChunkList;
+      }
+      // 判断文件是否上传过，获取fileId
+      async function checkFile(file) {
+        const md5 = getFileMD5(file);
+        file.md5 = md5;
+        const formData = new FormData();
+        formData.append('fileMd5', md5);
+        formData.append('fileName', file.name);
+        formData.append('fileSize', file.size);
+        await uploadChunks(file);
+      }
+      async function uploadChunks(file) {
+        // let chunkSize = updateCchunkSize(file);
+        let chunkSize = 64 * 1024;
+        console.log(`chunkSize`, chunkSize);
+        const fileChunkList = createFileChunk(file, chunkSize);
+        console.log(`fileChunkList`, fileChunkList);
+        file.chunkList = fileChunkList.map(({ file, hash }, index) => {
+          console.log(`filessssss`, file);
+          return {
+            index,
+            source: file,
+            hash: hash,
+            size: file.size,
+          };
+        });
+        var chunkData = file.chunkList;
+        console.log(`chunkData`, chunkData);
+        return new Promise((resolve, reject) => {
+          const requestDataList = chunkData.map((value) => {
+            const formData = new FormData();
+            formData.append('fileMd5', file.md5);
+            formData.append('chunk', value.index);
+            formData.append('hash', value.hash);
+            formData.append('file', value.source);
+            console.log(`formData`, formData);
+            return { formData, index: value.index, md5: file.md5, file };
+          });
+          try {
+            console.log(`requestDataList1111`, requestDataList);
+            const ret = sendRequest(requestDataList);
+            // console.log('上传结束,参数:', ret, chunkData, file.md5);
+            resolve(ret);
+          } catch (error) {
+            // reject('sendRequest 失败', error);
+            console.log(`error`, error);
+            reject(error);
+          }
+        }).then(async (res) => {
+          if (res == file.md5) {
+            // console.log('--- ' + file.name + ' 文件开始合并----')
+            await mergeRequest(file.md5);
+          }
+        });
+      }
+
+      function beforeUpload(file: FileItem) {
+        file.status = 'uploading';
+        checkFile(file);
+        return false;
+      }
+      // 根据文件大小，分配上传分片大小
+      function updateCchunkSize(file) {
+        let chunkSize = 0;
+        if (file.size > 2000 * 1024 * 1024) {
+          chunkSize = 1024 * 1024 * 15;
+        } else if (file.size > 1000 * 1024 * 1024) {
+          chunkSize = 1024 * 1024 * 10;
+        } else if (file.size > 500 * 1024 * 1024) {
+          chunkSize = 1024 * 1024 * 8;
+        } else {
+          chunkSize = 2 * 1024 * 1024;
+        }
+        return chunkSize;
+      }
+
+      // 并发，重试请求
+      async function sendRequest(list) {
+        var finished = 0;
+        const retryArr: any[] = []; // retryArr.length代表请求数，值代表重试次数
+        var currentFileInfo;
+        const total = list.length;
+        // 所有请求都存放这个promise中
+        console.log(`list`, list);
+        console.log(`total`, total);
+        state.progress_show = true;
+        return new Promise((resolve, reject) => {
+          const handler = () => {
+            if (list.length) {
+              const formInfo = list.shift();
+              const index = formInfo.index;
+              console.log(`list`, list);
+              console.log(`formInfo`, formInfo);
+              uploadApi(formInfo)
+                .then((res) => {
+                  console.log(`res`, res);
+                  if (res) {
+                    state.percent = parseInt((finished / total) * 100);
+                    currentFileInfo = formInfo;
+                    finished++;
+                    console.log(`finished`, finished);
+                    console.log(`total`, total);
+                    handler();
+                  }
+                  return res;
+                })
+                .catch((err) => {
+                  console.log(`err`, err);
+                  if (typeof retryArr[index] !== 'number') {
+                    retryArr[index] = 1;
+                  }
+                  if (retryArr[index] >= state.chunkRetry) {
+                    return reject(retryArr);
+                  }
+                  retryArr[index]++; // 累加
+                  state.tempThreads++; // 释放当前占用的通道
+                  list.push(formInfo); // 将失败的重新加入队列
+                  handler();
+                });
+            }
+            if (finished >= total) {
+              state.progress_show = false;
+              state.percent = 0;
+              getTableAction().reload();
+              success('文件上传成功');
+              resolve(currentFileInfo.md5); // 输出当前完成上传的文件信息
+            }
+          };
+          // 控制并发
+          for (let i = 0; i < state.tempThreads; i++) {
+            handler();
+          }
+        });
+      }
+
+      function handleChange(info) {
+        console.log(`info`, info);
+      }
+
+      async function handleGroupBtn(group) {
+        await nextTick();
+        getTableAction().reload();
+        state.group = group.toLowerCase();
+      }
+
+      function handleTableReset() {
+        getTableAction().reload();
+      }
+
+      async function handleEdit(record: Recordable) {
+        console.log(`record`, record);
+        console.log('=====编辑');
+      }
+      async function handleDelete(record: Recordable) {
+        console.log(`record`, record);
+        console.log('删除=====');
+      }
+
+      function createActions(record: EditRecordRow): ActionItem[] {
+        return [
+          {
+            label: '编辑',
+            icon: 'ant-design:edit-outlined',
+            color: 'warning',
+            onClick: handleEdit.bind(null, record),
+          },
+          {
+            label: '删除',
+            color: 'error',
+            icon: 'ic:outline-delete-outline',
+            popConfirm: {
+              title: '是否确认删除',
+              confirm: handleDelete.bind(null, record),
+            },
+          },
+        ];
+      }
+      return {
+        t,
+        createActions,
+        tableRef,
+        registerTable,
+        beforeUpload,
+        handleChange,
+        handleGroupBtn,
+        handleTableReset,
+        ...toRefs(state),
+      };
+    },
+  });
+</script>
+<style>
+  .attachment-container {
+    position: relative;
+  }
+
+  .vben-collapse-container__body > .mr-2 {
+    margin-top: 5px;
+    font-weight: 550 !important;
+  }
+
+  .upload-progress {
+    padding: 20px 30px;
+  }
+</style>

src/views/general/attachment/customComponents/Image.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="wrap">
-    <a-image class="image" :src="src" :width="width" />
+    <a-image class="image" :src="src" style="width: auto; height: 70px" />
   </div>
 </template>
 <script lang="ts">
@@ -9,7 +9,6 @@
 
   const props = {
     src: { type: String, default: '' },
-    width: { type: String, default: '' },
   };
 
   export default defineComponent({
@@ -27,7 +26,7 @@
     display: flex;
     justify-content: space-around;
     width: 100%;
-    height: 60px;
+    height: 80px;
     align-items: center;
     border: 1px solid #ddd;
     border-radius: 2px;

src/views/general/attachment/data.ts

@@ -15,12 +15,12 @@ export const columns: BasicColumn[] = [
   {
     title: '预览',
     align: 'center',
-    // dataIndex: 'url',
+    dataIndex: 'preview',
     width: 100,
     customRender: ({ record }) => {
       return h(Image, {
-        src: 'http://localhost:8888/' + record.url,
-        height: '50px',
+        src: record.url,
+        height: '80px',
       });
     },
   },
@@ -92,7 +92,7 @@ export const columns: BasicColumn[] = [
       if (!record.createtime) {
         return null;
       }
-      return moment(record.createtime).format('YYYY-MM-DD');
+      return moment(record.createtime * 1000).format('YYYY-MM-DD HH:mm:ss');
     },
   },
 ];

src/views/general/attachment/index.vue

@@ -12,31 +12,27 @@
     <a-button type="default" class="mr-2"> 文档 </a-button>
     <a-button type="default" class="mr-2"> 应用 </a-button>
     <a-button type="default" class="mr-2"> 压缩包 </a-button>
-    <BasicTable ref="tableRef" :canResize="true" @register="registerTable">
+    <BasicTable ref="tableRef" :canResize="true" @register="registerTable" showTableSetting>
       <template #action="{ record, column }">
         <TableAction :actions="createActions(record, column)" stopButtonPropagation />
       </template>
       <template #toolbar>
-        <a-upload
-          :showUploadList="false"
-          :multiple="false"
-          :before-upload="beforeUpload"
-          @change="handleChange"
-        >
-          <a-button type="primary" :disabled="disabled">
-            {{ t('component.upload.upload') }}
+        <div class="tool-btn-wrap">
+          <a-upload
+            :showUploadList="false"
+            :multiple="false"
+            :before-upload="beforeUpload"
+            @change="handleChange"
+          >
+            <a-button type="primary" :disabled="disabled">
+              {{ t('component.upload.upload') }}
+            </a-button>
+          </a-upload>
+          <a-button color="error" @click="deleteBatches">
+            {{ t('common.delText') }}
           </a-button>
-        </a-upload>
-        <a-button color="error" @click="deleteBatches">
-          {{ t('common.delText') }}
-        </a-button>
-      </template>
-      <a-modal :visible="progress_show" :footer="null" :closable="false">
-        <div class="upload-progress">
-          <p><strong>文件上传中</strong></p>
-          <a-progress :percent="percent" />
         </div>
-      </a-modal>
+      </template>
     </BasicTable>
   </CollapseContainer>
 </template>
@@ -48,7 +44,6 @@
   import { CollapseContainer } from '/@/components/Container/index';
   import { adapt } from '/@/utils/adapt';
   import { useI18n } from '/@/hooks/web/useI18n';
-  import md5 from 'crypto-js/md5';
   import {
     BasicTable,
     useTable,
@@ -61,17 +56,6 @@
   import { getAttachmentList } from '/@/api/sys/general';
   import { uploadApi } from '/@/api/sys/upload';
 
-  interface FileItem {
-    uid: string;
-    name?: string;
-    status?: string;
-    response?: string;
-    url?: string;
-    type?: string;
-    size: number;
-    originFileObj: any;
-  }
-
   export default defineComponent({
     name: 'Attchment',
     components: {
@@ -85,16 +69,12 @@
     setup() {
       const { t } = useI18n();
       const { createMessage } = useMessage();
-      const { success /*, error */ } = createMessage;
+      const { success, error } = createMessage;
       const tableHeight = adapt().tableHeight;
       const state = reactive({
         groupList: [] as object[],
         group: 'basic',
         disabled: false,
-        tempThreads: 5,
-        progress_show: false,
-        percent: 0,
-        chunkRetry: 4, // 重试次数限制
       });
       const tableRef = ref<Nullable<TableActionType>>(null);
       const [registerTable] = useTable({
@@ -115,6 +95,19 @@
       function afterFetch(res) {
         console.log(`res`, res);
       }
+      function beforeUpload(file) {
+        uploadApi({ file })
+          .then((res) => {
+            console.log(`res`, res);
+            success('文件上传成功');
+            getTableAction().reload();
+          })
+          .catch((err) => {
+            error('文件上传失败');
+            console.log(`err`, err);
+          });
+      }
+
       function getTableAction() {
         // 获取组件
         const tableAction = unref(tableRef);
@@ -124,165 +117,6 @@
         return tableAction;
       }
 
-      function getFileMD5(file) {
-        return md5(file.name + file.size + file.lastModifiedDate);
-      }
-
-      async function mergeRequest(fileMd5) {
-        return new Promise((resolve, reject) => {
-          const mergeFormData = new FormData();
-          mergeFormData.append('fileMd5', fileMd5);
-        });
-      }
-
-      function createFileChunk(file, size) {
-        const fileChunkList: object[] = [];
-        let count = 0;
-        let index = 0;
-        while (count < file.size) {
-          fileChunkList.push({
-            file: file.slice(count, count + size),
-            hash: file.name + '-' + index, // 生成切片名称
-          });
-          count += size;
-          index += 1;
-        }
-        return fileChunkList;
-      }
-      // 判断文件是否上传过，获取fileId
-      async function checkFile(file) {
-        const md5 = getFileMD5(file);
-        file.md5 = md5;
-        const formData = new FormData();
-        formData.append('fileMd5', md5);
-        formData.append('fileName', file.name);
-        formData.append('fileSize', file.size);
-        await uploadChunks(file);
-      }
-      async function uploadChunks(file) {
-        // let chunkSize = updateCchunkSize(file);
-        let chunkSize = 64 * 1024;
-        console.log(`chunkSize`, chunkSize);
-        const fileChunkList = createFileChunk(file, chunkSize);
-        console.log(`fileChunkList`, fileChunkList);
-        file.chunkList = fileChunkList.map(({ file, hash }, index) => {
-          console.log(`filessssss`, file);
-          return {
-            index,
-            source: file,
-            hash: hash,
-            size: file.size,
-          };
-        });
-        var chunkData = file.chunkList;
-        console.log(`chunkData`, chunkData);
-        return new Promise((resolve, reject) => {
-          const requestDataList = chunkData.map((value) => {
-            const formData = new FormData();
-            formData.append('fileMd5', file.md5);
-            formData.append('chunk', value.index);
-            formData.append('hash', value.hash);
-            formData.append('file', value.source);
-            console.log(`formData`, formData);
-            return { formData, index: value.index, md5: file.md5, file };
-          });
-          try {
-            console.log(`requestDataList1111`, requestDataList);
-            const ret = sendRequest(requestDataList);
-            // console.log('上传结束,参数:', ret, chunkData, file.md5);
-            resolve(ret);
-          } catch (error) {
-            // reject('sendRequest 失败', error);
-            console.log(`error`, error);
-            reject(error);
-          }
-        }).then(async (res) => {
-          if (res == file.md5) {
-            // console.log('--- ' + file.name + ' 文件开始合并----')
-            await mergeRequest(file.md5);
-          }
-        });
-      }
-
-      function beforeUpload(file: FileItem) {
-        file.status = 'uploading';
-        checkFile(file);
-        return false;
-      }
-      // 根据文件大小，分配上传分片大小
-      function updateCchunkSize(file) {
-        let chunkSize = 0;
-        if (file.size > 2000 * 1024 * 1024) {
-          chunkSize = 1024 * 1024 * 15;
-        } else if (file.size > 1000 * 1024 * 1024) {
-          chunkSize = 1024 * 1024 * 10;
-        } else if (file.size > 500 * 1024 * 1024) {
-          chunkSize = 1024 * 1024 * 8;
-        } else {
-          chunkSize = 2 * 1024 * 1024;
-        }
-        return chunkSize;
-      }
-
-      // 并发，重试请求
-      async function sendRequest(list) {
-        var finished = 0;
-        const retryArr: any[] = []; // retryArr.length代表请求数，值代表重试次数
-        var currentFileInfo;
-        const total = list.length;
-        // 所有请求都存放这个promise中
-        console.log(`list`, list);
-        console.log(`total`, total);
-        state.progress_show = true;
-        return new Promise((resolve, reject) => {
-          const handler = () => {
-            if (list.length) {
-              const formInfo = list.shift();
-              const index = formInfo.index;
-              console.log(`list`, list);
-              console.log(`formInfo`, formInfo);
-              uploadApi(formInfo)
-                .then((res) => {
-                  console.log(`res`, res);
-                  if (res) {
-                    state.percent = parseInt((finished / total) * 100);
-                    currentFileInfo = formInfo;
-                    finished++;
-                    console.log(`finished`, finished);
-                    console.log(`total`, total);
-                    handler();
-                  }
-                  return res;
-                })
-                .catch((err) => {
-                  console.log(`err`, err);
-                  if (typeof retryArr[index] !== 'number') {
-                    retryArr[index] = 1;
-                  }
-                  if (retryArr[index] >= state.chunkRetry) {
-                    return reject(retryArr);
-                  }
-                  retryArr[index]++; // 累加
-                  state.tempThreads++; // 释放当前占用的通道
-                  list.push(formInfo); // 将失败的重新加入队列
-                  handler();
-                });
-            }
-            if (finished >= total) {
-              state.progress_show = false;
-              state.percent = 0;
-              getTableAction().reload();
-              success('文件上传成功');
-              resolve(currentFileInfo.md5); // 输出当前完成上传的文件信息
-            }
-          };
-          // 控制并发
-          for (let i = 0; i < state.tempThreads; i++) {
-            handler();
-          }
-        });
-      }
-
       function handleChange(info) {
         console.log(`info`, info);
       }
@@ -349,7 +183,18 @@
     font-weight: 550 !important;
   }
 
-  .upload-progress {
+  /* .upload-progress {
     padding: 20px 30px;
+  } */
+  .vben-basic-table-header__toolbar {
+    justify-content: space-between;
+  }
+
+  .tool-btn-wrap {
+    flex: 1;
+  }
+
+  .tool-btn-wrap button {
+    margin-right: 5px;
   }
 </style>

src/views/general/config/customComponents/ChooseModal.vue

@@ -1,28 +1,17 @@
 <template>
   <BasicModal
     width="800px"
-    :title="t('component.upload.choose')"
+    title="选择图片"
     v-bind="$attrs"
     @register="register"
-    :showOkBtn="false"
     cancelText="关闭"
+    @ok="handleSumbit"
   >
-    <a-button type="primary" preIcon="mdi:reload" iconSize="20" @click="reload" />
-    <a-button
-      v-if="type === 'images'"
-      class="check-btn"
-      :disabled="disable_btn"
-      type="success"
-      preIcon="fa-solid:check"
-      @click="checkedBatches"
-      >{{ t('component.upload.choose') }}</a-button
-    >
     <BasicTable
       ref="tableRef"
-      @register="registerTable"
-      @selectionChange="selectionChange"
-      @rowClick="selectionChange"
       rowKey="id"
+      @register="registerTable"
+      :rowSelection="{ type: type === 'images' ? 'checkbox' : 'radio' }"
     >
       <template #action="{ record, column }">
         <TableAction :actions="createActions(record, column)" />
@@ -31,43 +20,13 @@
   </BasicModal>
 </template>
 <script lang="ts">
-  import { defineComponent, reactive, ref, toRefs, unref } from 'vue';
+  import { defineComponent, onUpdated, ref, toRefs, unref } from 'vue';
   import { BasicModal, useModalInner } from '/@/components/Modal';
-  import { adapt } from '/@/utils/adapt';
-  import { useI18n } from '/@/hooks/web/useI18n';
-  import {
-    BasicTable,
-    useTable,
-    TableAction,
-    ActionItem,
-    EditRecordRow,
-    TableActionType,
-  } from '/@/components/Table';
-  import { columns } from './chooseModalData';
-  interface Btn {
-    disable_btn: boolean;
-  }
-  const fakeData = [
-    {
-      id: 1,
-      imgUrl: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png',
-      imagewidth: 120,
-      imageheight: 120,
-      createtime: '2020-10-20 21:22:22',
-    },
-    {
-      id: 2,
-      imgUrl: 'http://jetbill.cn/uploads/20210713/a05d360766d30868cdb878b4c0aac77d.jpg',
-      imagewidth: 120,
-      imageheight: 120,
-    },
-    {
-      id: 3,
-      imgUrl: 'http://jetbill.cn/uploads/20210712/51ae92cdb0bb22a88d6e73e62bcb1cad.jpg',
-      imagewidth: 120,
-      imageheight: 120,
-    },
-  ];
+  import { BasicTable, useTable, TableAction, TableActionType } from '/@/components/Table';
+  import { columns } from '../../attachment/data';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { getAttachmentList } from '/@/api/sys/general';
+
   const props = {
     value: { type: String, default: '' },
     type: { type: String, default: '' },
@@ -76,30 +35,16 @@
   export default defineComponent({
     components: { BasicModal, BasicTable, TableAction },
     props,
-    emits: ['checked', 'checkedBatches'],
+    emits: ['checked'],
     setup(props, { emit }) {
-      const { t } = useI18n();
+      const { createMessage } = useMessage();
+      const { error } = createMessage;
       const tableRef = ref<Nullable<TableActionType>>(null);
-      const adaptWidth = adapt();
       const [register, { closeModal }] = useModalInner();
-      const btn = reactive<Btn>({
-        disable_btn: true,
-      });
+
       const [registerTable] = useTable({
-        // title: '管理员日志',
-        // titleHelpMessage: '',
-        rowSelection: { type: 'checkbox' },
         columns: columns,
-        // clickToRowSelect: false, // 点击行不勾选
-        // api: getUserList,
-        dataSource: fakeData,
-        actionColumn: {
-          width: 80,
-          title: '操作',
-          dataIndex: 'action',
-          slots: { customRender: 'action' },
-          fixed: undefined,
-        },
+        api: getAttachmentList,
         showIndexColumn: false,
         bordered: true,
       });
@@ -111,54 +56,30 @@
         }
         return tableAction;
       }
-      function reload() {
-        console.log('========reload======');
-      }
 
-      function selectionChange(e) {
-        console.log('==========selelelelele');
-        const keys = getTableAction().getSelectRowKeys();
-        if (keys.length) {
-          btn.disable_btn = false;
+      async function handleSumbit() {
+        const rows = await getTableAction().getSelectRows();
+        if (rows.length) {
+          emit('checked', rows);
+          closeModal();
         } else {
-          btn.disable_btn = true;
+          error('请先选择图片');
         }
-        console.log(`e==`, e)
-        emit('checked', e, closeModal);
-      }
-
-      function handleChecked(record) {
-        console.log(`record`, record);
-        emit('checked', record, closeModal);
-      }
-      async function checkedBatches() {
-        const keys = await getTableAction().getSelectRowKeys();
-        emit('checkedBatches', keys, closeModal);
-      }
-
-      function createActions(record: EditRecordRow): ActionItem[] {
-        return [
-          {
-            label: '选择',
-            icon: 'fa-solid:check',
-            color: 'success',
-            onClick: handleChecked.bind(null, record),
-          },
-        ];
       }
+      onUpdated(() => {
+        document.onkeydown = function (e) {
+          if (e.key === 'Enter') {
+            handleSumbit();
+          }
+        };
+      });
 
       return {
         register,
         tableRef,
         registerTable,
-        adaptWidth,
-        checkedBatches,
-        selectionChange,
-        reload,
-        createActions,
+        handleSumbit,
         getTableAction,
-        t,
-        ...toRefs(btn),
         ...toRefs(props),
       };
     },

src/views/general/config/customComponents/UploadImage.vue

@@ -27,8 +27,8 @@
       <span class="tip-span" v-if="tipShow">{{ tip }}</span>
     </div>
 
-    <div class="image-list" v-if="image_list">
-      <div v-for="(item, index) in image_list" :key="index">
+    <div class="image-list" v-if="file_list">
+      <div v-for="(item, index) in file_list" :key="index">
         <div class="image-item" v-if="imageUrls.split(',').includes(item.url)">
           <div class="image-wrap"> <a-image width="70px" :src="item.url" /></div>
           <div class="dele-image" @click="deleteImage(item.url)">
@@ -37,24 +37,18 @@
         </div>
       </div>
     </div>
-    <ChooseModal
-      :type="type"
-      @register="chooseModalRegister"
-      @checked="checked"
-      @checkedBatches="checkedBatches"
-    />
+    <ChooseModal :type="type" @register="chooseModalRegister" @checked="checked" />
   </div>
 </template>
 <script lang="ts">
   import { defineComponent, reactive, toRefs } from 'vue';
   import { BasicUpload } from '/@/components/Upload';
-  import { useMessage } from '/@/hooks/web/useMessage';
+  // import { useMessage } from '/@/hooks/web/useMessage';
   import { uploadApi } from '/@/api/sys/upload';
   import ChooseModal from './ChooseModal.vue';
   import { useModal } from '/@/components/Modal';
   import { Image, Input } from 'ant-design-vue';
   import Icon from '/@/components/Icon';
-  import { getAttachmentList } from '/@/api/sys/general';
 
   const props = {
     value: { type: String, default: '' },
@@ -68,14 +62,14 @@
     props,
     emits: ['change'],
     setup(props, { emit }) {
-      const { createMessage } = useMessage();
+      // const { createMessage } = useMessage();
       const [chooseModalRegister, { openModal }] = useModal();
       function openChooseModal() {
         openModal(true);
       }
       const state = reactive({
         imageUrls: props.value,
-        image_list: [] as object[],
+        file_list: [] as object[],
         tipShow: false,
       });
 
@@ -87,23 +81,18 @@
         );
         state.imageUrls = arr.toString();
       }
-      function checked(record, closeModal) {
-        console.log('state.imageUrls', state.imageUrls);
-        console.log(`props.type`, props.type);
+      function checked(imgs) {
         if (props.type === 'image') {
-          state.imageUrls = record.imgUrl;
+          state.imageUrls = imgs[0].url;
         } else {
-          state.imageUrls = state.imageUrls + ',' + record.imgUrl;
+          imgs.map((item) => {
+            state.imageUrls += item.url + ',';
+          });
         }
-        closeModal();
-        emit('change');
-      }
-      function checkedBatches(keys, closeModal) {
-        console.log(`keys`, keys);
-        closeModal();
-        console.log('========checkedBatches========');
-        emit('change');
+        emit('change', state.imageUrls);
+        console.log(`imgs`, imgs);
       }
+
       function onInputChange(e) {
         state.imageUrls = e.target.value;
       }
@@ -113,19 +102,16 @@
       function onBlur() {
         state.tipShow = false;
       }
-      getImageList();
-      async function getImageList() {
-        await getAttachmentList().then((res) => {
-          state.image_list = res.rows;
-        });
-      }
 
       return {
         handleChange: (list: string[]) => {
-          console.log(`list`, list);
-          createMessage.info(`已上传文件${JSON.stringify(list)}`);
+          if (props.type === 'image') {
+            state.imageUrls = list[0];
+          } else {
+            state.imageUrls = list.join(',');
+          }
+          emit('change', state.imageUrls);
         },
-        checkedBatches,
         checked,
         openChooseModal,
         deleteImage,

src/views/general/config/customComponents/chooseModalData.ts

@@ -1,48 +0,0 @@
-import { BasicColumn } from '/@/components/Table';
-import Image from '/@/views/general/attachment/customComponents/Image.vue';
-import { h } from 'vue';
-
-export const columns: BasicColumn[] = [
-  {
-    title: 'ID',
-    align: 'center',
-    dataIndex: 'id',
-    width: 80,
-  },
-  {
-    title: '预览',
-    align: 'center',
-    dataIndex: 'imgUrl',
-    width: 100,
-    customRender: ({ record }) => {
-      return h(Image, {
-        src: record.imgUrl,
-        width: '50px',
-      });
-    },
-  },
-  {
-    title: '宽度',
-    align: 'center',
-    dataIndex: 'imagewidth',
-    width: 80,
-  },
-  {
-    title: '高度',
-    align: 'center',
-    dataIndex: 'imageheight',
-    width: 80,
-  },
-  {
-    title: 'Mime类型',
-    align: 'center',
-    dataIndex: 'mimetype',
-    width: 100,
-  },
-  {
-    title: '创建日期',
-    align: 'center',
-    dataIndex: 'createtime',
-    width: 160,
-  },
-];

src/views/general/config/index.vue

@@ -130,6 +130,7 @@
       function afterFetch(result) {
         result = result[state.group].list;
         appStore.setAppTitle(result[0].value);
+        appStore.setAppLogo(result[1].value);
         return result;
       }
       getGroupList();

src/views/money/bill/customCom/popup.vue

@@ -42,12 +42,11 @@
         state.data = data;
       }
       function sendRecord() {
-        console.log('-----------sendRecord---------');
         if (state.data.id !== 0) {
           emit('select', state.data);
           closeModal();
         } else {
-          error('请先选择要添加的数据?!');
+          error('请先选择要添加的数据!');
         }
       }
       onUpdated(() => {