瀏覽代碼

fix: BsUi-附件上传列表新增文件图标

hanxiaohui 1 月之前
父節點
當前提交
b1ad62535f

+ 4 - 1
src/components/BsUi/FileUploadSubTable/index.vue

@@ -78,8 +78,11 @@
           },
           {
             field: 'fileType',
-            width: '150px',
+            width: '100px',
             title: '文件类型',
+            cellRender: {
+              name: 'CellFileType',
+            },
           },
           {
             field: 'fileSize',

+ 1 - 0
src/components/BsUi/Images/file_icon.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1757388088591" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1809" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M0 128a51.2 51.2 0 0 1 51.2-51.2h350.24a51.2 51.2 0 0 1 47.0592 31.0336L473.6 166.4h499.2a51.2 51.2 0 0 1 51.2 51.2v537.6a51.2 51.2 0 0 1-51.2 51.2H51.2a51.2 51.2 0 0 1-51.2-51.2V128z" fill="#FFA000" p-id="1810"></path><path d="M89.6 249.6m51.2 0l742.4 0q51.2 0 51.2 51.2l0 460.8q0 51.2-51.2 51.2l-742.4 0q-51.2 0-51.2-51.2l0-460.8q0-51.2 51.2-51.2Z" fill="#FFFFFF" p-id="1811"></path><path d="M0 332.8m51.2 0l921.6 0q51.2 0 51.2 51.2l0 512q0 51.2-51.2 51.2l-921.6 0q-51.2 0-51.2-51.2l0-512q0-51.2 51.2-51.2Z" fill="#FFCA28" p-id="1812"></path></svg>

File diff suppressed because it is too large
+ 0 - 0
src/components/BsUi/Images/music_icon.svg


+ 1 - 0
src/components/BsUi/Images/pdf_icon.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1757388161828" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2282" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M160 0h512l256 256v704c0 35.3472-28.6528 64-64 64H160c-35.3472 0-64-28.6528-64-64V64c0-35.3472 28.6528-64 64-64z" fill="#FA4E4E" p-id="2283"></path><path d="M678.304 689.632c-34.5536-2.5664-67.8208-15.3984-94.6944-38.496-52.4672 11.5456-102.3808 28.224-152.288 48.7616C391.6544 770.4704 354.5408 806.4 322.5472 806.4c-6.4 0-14.0736-1.28-19.1936-5.1328-14.08-6.4128-21.7536-20.5312-21.7536-34.6432 0-11.552 2.56-43.6288 124.128-96.2432 28.16-51.328 49.9072-103.936 67.8272-159.1104-15.36-30.7968-48.6272-106.5088-25.6-144.9984 7.68-14.1184 23.04-21.8176 39.68-20.5312 12.7936 0 25.5872 6.4128 33.2672 16.6784 16.64 23.0976 15.36 71.8592-6.4 143.7184a386.9056 386.9056 0 0 0 79.3408 102.656c26.88-5.1392 53.7472-8.9856 80.6208-8.9856 60.1472 1.28 69.1072 29.5104 67.8272 46.1952 0 43.6288-42.2336 43.6288-63.9872 43.6288z m-358.3104 79.552l3.84-1.28c17.9136-6.4128 31.9872-19.2448 42.2272-35.9296-19.2 7.6992-34.5536 20.5312-46.0672 37.216z m170.1952-384.9472h-3.84c-1.28 0-3.84 0-5.12 1.28-5.12 21.8112-1.28 44.9088 7.68 65.44 7.68-21.8112 7.68-44.9088 1.28-66.72z m8.96 186.0608l-1.28 2.56-1.28-1.28c-11.52 29.5168-24.32 59.0272-38.3936 87.2576l2.56-1.28v2.56a743.6992 743.6992 0 0 1 87.0208-25.664l-1.28-1.28h3.84c-19.2-19.2512-37.1136-41.0624-51.1872-62.8736z m174.0352 68.0064c-11.52 0-21.7536 0-33.2736 2.56 12.8 6.4192 25.6 8.9856 38.3936 10.272 8.96 1.28 17.92 0 25.5936-2.5664 0-3.8528-5.12-10.2656-30.7136-10.2656z" fill="#FFFFFF" p-id="2284"></path><path d="M672 0l256 256h-192c-35.3472 0-64-28.6528-64-64V0z" fill="#FDB8B8" p-id="2285"></path></svg>

+ 1 - 0
src/components/BsUi/Images/ppt_icon.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1757388053732" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1495" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M160 0h512l256 256v704c0 35.3472-28.6528 64-64 64H160c-35.3472 0-64-28.6528-64-64V64c0-35.3472 28.6528-64 64-64z" fill="#FF9333" p-id="1496"></path><path d="M427.8976 768V610.9568H539.776c87.7952 0 132.224-38.1824 132.224-114.016C672 421.6448 628.1024 384 540.3136 384H384v384h43.8976z m109.7408-195.2256H427.8976v-150.592h109.7408c30.5088 0 52.992 5.92 67.9808 18.8288 14.9888 11.2896 22.4832 30.112 22.4832 55.936 0 25.8112-7.488 44.6336-21.952 57.0048-14.9824 12.3648-37.4656 18.816-68.512 18.816z" fill="#FFFFFF" p-id="1497"></path><path d="M672 0l256 256h-192c-35.3472 0-64-28.6528-64-64V0z" fill="#FFD3AD" p-id="1498"></path></svg>

+ 1 - 0
src/components/BsUi/Images/thumn_icon.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1757388107734" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1965" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M160 0h512l256 256v704c0 35.3472-28.6528 64-64 64H160c-35.3472 0-64-28.6528-64-64V64c0-35.3472 28.6528-64 64-64z" fill="#F6AD00" p-id="1966"></path><path d="M258.528 742.0672L351.8336 604.928a14.5024 14.5024 0 0 1 22.1696-2.1824l61.664 60.416 135.296-212.064a14.5024 14.5024 0 0 1 24.8064 0.5568l168.1024 291.328a14.5024 14.5024 0 0 1-12.5696 21.7664H270.528a14.5024 14.5024 0 0 1-12.0064-22.6816z" fill="#FFF7F7" p-id="1967"></path><path d="M359.616 431.5456m-73.1456 0a73.1456 73.1456 0 1 0 146.2912 0 73.1456 73.1456 0 1 0-146.2912 0Z" fill="#FFFFFF" p-id="1968"></path><path d="M672 0l256 256h-192c-35.3472 0-64-28.6528-64-64V0z" fill="#FBDE99" p-id="1969"></path></svg>

+ 1 - 0
src/components/BsUi/Images/txt_icon.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1757387954430" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1179" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M160 0h512l256 256v704c0 35.3472-28.6528 64-64 64H160c-35.3472 0-64-28.6528-64-64V64c0-35.3472 28.6528-64 64-64z" fill="#8289AD" p-id="1180"></path><path d="M536.9088 768V422.1824H672V384H358.4v38.1824h135.0912V768z" fill="#FFFFFF" p-id="1181"></path><path d="M672 0l256 256h-192c-35.3472 0-64-28.6528-64-64V0z" fill="#CDCFDE" p-id="1182"></path></svg>

+ 1 - 0
src/components/BsUi/Images/undefined_icon.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1757388238729" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2754" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M160 0h512l256 256v704c0 35.3472-28.6528 64-64 64H160c-35.3472 0-64-28.6528-64-64V64c0-35.3472 28.6528-64 64-64z" fill="#CCCCCC" p-id="2755"></path><path d="M672 0l256 256h-192c-35.3472 0-64-28.6528-64-64V0z" fill="#EAEAEA" p-id="2756"></path><path d="M384 499.2c0-25.6 5.12-46.08 10.24-58.88 5.12-12.8 15.36-25.6 28.16-35.84 12.8-12.8 25.6-20.48 43.52-25.6 15.36-5.12 30.72-7.68 48.64-7.68 35.84 0 64 10.24 89.6 30.72C627.2 422.4 640 448 640 481.28c0 15.36-5.12 28.16-10.24 40.96s-17.92 28.16-38.4 46.08-28.16 30.72-35.84 38.4c-7.68 7.68-10.24 17.92-15.36 28.16-5.12 10.24-2.56 17.92-2.56 43.52h-51.2c0-25.6 2.56-38.4 5.12-51.2s7.68-23.04 15.36-33.28 15.36-23.04 33.28-40.96c17.92-17.92 30.72-30.72 35.84-38.4 5.12-7.68 10.24-20.48 10.24-38.4s-7.68-30.72-20.48-43.52-30.72-20.48-53.76-20.48c-51.2 0-76.8 35.84-76.8 87.04h-51.2z m153.6 281.6h-51.2v-51.2h51.2v51.2z" fill="#FFFFFF" p-id="2757"></path></svg>

+ 1 - 0
src/components/BsUi/Images/vedio_icon.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1757388069554" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1653" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M160 0h512l256 256v704c0 35.3472-28.6528 64-64 64H160c-35.3472 0-64-28.6528-64-64V64c0-35.3472 28.6528-64 64-64z" fill="#7C8EEE" p-id="1654"></path><path d="M702.2976 579.2896l-298.5664 177.984c-19.9488 12.0192-45.3312-2.4128-45.3312-25.856v-355.968c0-22.848 25.3824-37.2736 45.3312-25.856l298.56 177.984c19.3408 12.032 19.3408 40.288 0 51.712z" fill="#FFFFFF" p-id="1655"></path><path d="M672 0l256 256h-192c-35.3472 0-64-28.6528-64-64V0z" fill="#CAD1F8" p-id="1656"></path></svg>

+ 1 - 0
src/components/BsUi/Images/word_icon.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1757388181986" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2440" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M160 0h512l256 256v704c0 35.3472-28.6528 64-64 64H160c-35.3472 0-64-28.6528-64-64V64c0-35.3472 28.6528-64 64-64z" fill="#4876F9" p-id="2441"></path><path d="M428.0192 768l77.1072-282.6688h1.4208L583.1808 768h43.0464L723.2 428.8h-43.52l-74.2656 284.5696H603.52L526.8864 428.8h-42.0992L407.68 713.3696h-1.8944L331.52 428.8H288l96.9728 339.2z" fill="#FFFFFF" p-id="2442"></path><path d="M672 0l256 256h-192c-35.3472 0-64-28.6528-64-64V0z" fill="#B5C8FC" p-id="2443"></path></svg>

+ 1 - 0
src/components/BsUi/Images/xls_icon.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1757388015160" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1337" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M160 0h512l256 256v704c0 35.3472-28.6528 64-64 64H160c-35.3472 0-64-28.6528-64-64V64c0-35.3472 28.6528-64 64-64z" fill="#4CB050" p-id="1338"></path><path d="M400.256 768l114.656-164.5696L630.1632 768H684.8L541.4208 568.4736 674.4768 384H619.84L514.912 533.5104 410.496 384h-54.6176l131.9872 184.4736L345.6 768z" fill="#FFFFFF" p-id="1339"></path><path d="M672 0l256 256h-192c-35.3472 0-64-28.6528-64-64V0z" fill="#B7DFB9" p-id="1340"></path></svg>

+ 1 - 0
src/components/BsUi/Images/zip_icon.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1757388134945" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2124" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M160 0h512l256 256v704c0 35.3472-28.6528 64-64 64H160c-35.3472 0-64-28.6528-64-64V64c0-35.3472 28.6528-64 64-64z" fill="#576A95" p-id="2125"></path><path d="M582.4 629.2544v139.0592a34.7328 34.7328 0 0 1-10.208 24.5824 34.8608 34.8608 0 0 1-24.6272 10.1824H476.4352a34.8736 34.8736 0 0 1-24.6272-10.176A34.7328 34.7328 0 0 1 441.6 768.3072V629.2544h140.8z m-34.8352 79.6672H476.4352v69.824h71.1296v-69.824z m33.6704-218.7264v69.824H511.2768v-69.824h69.9584zM512.1472 0v70.4H582.4v70.4H512.1408v65.184H582.4v70.4H512.1472V345.92H582.4v69.536H512.1472v69.5296H441.6V415.4496h70.2528V345.9136H441.6V276.384h70.2528v-70.4H441.6v-70.4h70.2528V70.4H441.6V0h70.5472z" fill="#FFFFFF" p-id="2126"></path><path d="M672 0l256 256h-192c-35.3472 0-64-28.6528-64-64V0z" fill="#BBC3D4" p-id="2127"></path></svg>

+ 18 - 2
src/components/BsUi/Render/cell.jsx

@@ -2,7 +2,7 @@ import { VxeUI } from 'vxe-pc-ui';
 import dayjs from 'dayjs';
 import { get, has, isEmpty, isFunction } from 'lodash';
 import { formatMoney, formatPercentage } from '/@/components/BsUi/uitl.js';
-import { DISPLAY_STATE } from '/@/components/BsUi/constant.js';
+import { DISPLAY_STATE, FILE_TYPE_ICON_MAP } from '/@/components/BsUi/constant.js';
 import { DeleteOutlined, EditOutlined, EyeOutlined, PlusOutlined } from '@ant-design/icons-vue';
 import { h } from 'vue';
 
@@ -50,7 +50,7 @@ VxeUI.renderer.add('CellDict', {
   // 默认显示模板
   renderTableDefault(renderOpts, params) {
     if (isEmpty(getValue(params))) return <></>;
-    return <bs-dic-tag dicts={getValue(params)}></bs-dic-tag>
+    return <bs-dic-tag dicts={getValue(params)}></bs-dic-tag>;
   },
 });
 
@@ -98,3 +98,19 @@ VxeUI.renderer.add('CellOption', {
     );
   },
 });
+
+// 文件类型
+VxeUI.renderer.add('CellFileType', {
+  // 默认显示模板
+  renderTableDefault(renderOpts, params) {
+    const { extraProps } = renderOpts;
+    const { row, column } = params;
+    const fileTypeName = row[column.field]?.toUpperCase();
+    const iconName = FILE_TYPE_ICON_MAP[fileTypeName] || 'undefined_icon.svg';
+    column.title = '文件类型';
+    column.width = '80';
+    column.align = 'center';
+
+    return <a-image preview={false} width={30} height={30} src={`/src/components/BsUi/images/${iconName}`}></a-image>;
+  },
+});

+ 3 - 1
src/components/BsUi/SubTableInput/index.vue

@@ -124,6 +124,7 @@
         enable: false,
       },
       pagerConfig: {
+        enable: true,
         pageNum: 1,
         pageSize: 100,
         pageSizeOptions: ['100'],
@@ -255,7 +256,8 @@
   watch(
     () => props.value,
     (val) => {
-      // setValue('gridOptions.data', val);
+      setValue('pagerConfig.enable', !isEmpty(val));
+      setValue('gridOptions.height', isEmpty(val) ? '250px' : '400px');
       refreshTable();
     },
     { immediate: true }

+ 3 - 4
src/components/BsUi/Table/Table.vue

@@ -86,14 +86,14 @@
       </div>
     </template>
 
-    <template #pager>
+    <template #pager v-if="pagerConfig?.enable">
       <div class="pager">
         <Pagination :pagerConfig="pagerConfig" />
       </div>
     </template>
 
     <template #bottom>
-      <slot name="bottom" />
+      <slot name="bottom"></slot>
     </template>
 
     <template #empty>
@@ -107,7 +107,7 @@
 
     <!-- 自定义列插槽 -->
     <template v-for="(name, idx) in slotCols" #[name]="scope" :key="idx">
-      <slot :name="name" v-bind="scope || {}" />
+      <slot :name="name" v-bind="scope || {}"></slot>
     </template>
   </vxe-grid>
 </template>
@@ -130,7 +130,6 @@
 
   const slotCols = ref([]);
 
-
   const handleSetting = () => {
     gridRef.value.openCustom();
   };

+ 1 - 1
src/components/BsUi/Table/index.js

@@ -218,7 +218,7 @@ export const useBsTable = (options, tableRef) => {
     setPageNum(tableOptions?.pagerConfig?.pageNum || PAGE_NUM);
     setPageSize(tableOptions?.pagerConfig?.pageSize || PAGE_SIZE);
     setPageSizeOptions(tableOptions?.pagerConfig?.pageSizeOptions || PAGE_SIZE_OPTIONS);
-    setPagerVisible(tableOptions?.pagerConfig?.enable || true);
+    setPagerVisible(tableOptions?.pagerConfig ? tableOptions?.pagerConfig?.enable : true);
     initPageEvent();
   };
 

+ 17 - 0
src/components/BsUi/constant.js

@@ -27,3 +27,20 @@ export const PAGE_NUM = 1;
 export const PAGE_SIZE = 10;
 
 export const ROW_KEY_FIELD = 'ROW_KEY';
+
+export const FILE_TYPE_ICON_MAP = Object.freeze({
+  PPT: 'ppt_icon.svg',
+  PPTX: 'ppt_icon.svg',
+  DOC: 'word_icon.svg',
+  DOCX: 'word_icon.svg',
+  TXT: 'txt_icon.svg',
+  VEDIO: 'vedio_icon.svg',
+  XLS: 'xls_icon.svg',
+  XLSX: 'xls_icon.svg',
+  ZIP: 'zip_icon.svg',
+  JPEG: 'thumn_icon.svg',
+  JPG: 'thumn_icon.svg',
+  PNG: 'thumn_icon.svg',
+  PDF: 'ppt_icon.svg',
+  MP3: 'music_icon.svg',
+});

Some files were not shown because too many files changed in this diff