centaline-data-driven-v3 0.1.59 → 0.1.60

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "centaline-data-driven-v3",
-  "version": "0.1.59",
+  "version": "0.1.60",
   "private": false,
   "description": "centaline-data-driven-v3",
   "main": "dist/centaline-data-driven-v3.umd.js",

package/src/components/app/FormList.vue

@@ -31,8 +31,8 @@
             </div>
         </template>
         <template v-else>
-            <div v-if="model.title" class="list-title">
-                <h5>{{ model.title }}</h5>
+            <div v-if="model.controlLabel" class="list-title">
+                <h5>{{ model.controlLabel }}</h5>
             </div>
             <div class="list-button">
                 <component v-if="model.selectRouter !== null" :is="model.selectRouter.is" size="small"
@@ -48,24 +48,34 @@
                             <thead ref="tableHead" class="right-no-fixation-th">
                                 <tr class="ct-tr" ref="headTr">
                                     <th class="ct-th th-edit"
-                                        v-if="model.rows[0].edit || model.rows[0].delete || model.buttons.length > 0">
+                                        v-if="model.rows[0].edit || model.rows[0].delete || (model.buttons.length > 0 && model.buttonsShow.length > 0)">
                                         <span>操作</span>
                                     </th>
                                     <template v-for="(column, i) in model.rows[0].field" :key="i">
-                                        <th v-if="column.show" class="ct-th" :rowspan="column.rowspan"
-                                            :colspan="column.colspan">
+                                        <th v-if="column.show" class="ct-th" :class="column.sortAction"
+                                            :rowspan="column.rowspan" :colspan="column.colspan">
                                             <span>{{ column.controlLabel }}</span>
+                                            <span class="caret-wrapper" v-if="column.autoSearch"
+                                                @click="toSort($event, column)"
+                                                @contextmenu.prevent="clearSort($event, column)">
+                                                <i class="sort-caret ascending"
+                                                    @click.left="toSort($event, column, 'asc')"
+                                                    @contextmenu.prevent="clearSort($event, column)"></i>
+                                                <i class="sort-caret descending"
+                                                    @click.left="toSort($event, column, 'desc')"
+                                                    @contextmenu.prevent="clearSort($event, column)"></i>
+                                            </span>
                                         </th>
                                     </template>
                                 </tr>
                             </thead>
                             <!--表体-->
                             <tbody>
-                                <template v-if="model.tableData.length > 0">
-                                    <tr v-for="(row, rowindex) in model.tableData" :key="rowindex"
-                                        :ref="'rows.' + rowindex" class="ct-tr">
+                                <template v-if="renderList.length > 0">
+                                    <tr v-for="(row, rowindex) in renderList" :key="rowindex" :ref="'rows.' + rowindex"
+                                        class="ct-tr">
                                         <template
-                                            v-if="model.rows[0].edit || model.rows[0].delete || model.buttons.length > 0">
+                                            v-if="model.rows[0].edit || model.rows[0].delete || (model.buttons.length > 0 && model.buttonsShow.length > 0)">
                                             <td class="ct-td td-edit" align="center" valign="middle">
                                                 <van-image v-if="row.edit || row.isSet"
                                                     style="cursor: pointer;margin-right: 5px;" width="20" height="20"
@@ -74,7 +84,7 @@
 
                                                 <van-image v-if="row.delete && !row.isSet"
                                                     style="cursor: pointer;margin-right: 5px;" width="20" height="20"
-                                                    @click="deleteRow(rowindex, row.$sourceIndex)"
+                                                    @click="deleteRow(row.$sourceIndex)"
                                                     :src="util.getAssetsImage('btn_del.png')" />
                                             </td>
                                             <template v-for="(b, vi) in model.buttons" :key="vi">
@@ -87,8 +97,14 @@
                                         <template v-for="(column, i) in model.rows[0].field" :key="i">
                                             <td v-if="column.show" class="ct-td" :rowspan="column.rowspan"
                                                 :colspan="column.colspan">
-                                                <ct-span v-if="row[column.fieldName1]" :vmodel="row[column.fieldName1]"
-                                                    :rowData="row"></ct-span>
+                                                <span v-if="column.router" :class="'cell'" style="display: flex;">
+                                                    <Tablecurrency :router="column.router"
+                                                        :colValue="row[column.fieldName1].code1" :rowData="row"
+                                                        @click="rolRouterClickHandler">
+                                                    </Tablecurrency>
+                                                </span>
+                                                <ct-span v-else-if="row[column.fieldName1]"
+                                                    :vmodel="row[column.fieldName1]" :rowData="row"></ct-span>
                                             </td>
                                         </template>
                                     </tr>
@@ -96,7 +112,7 @@
                                 <template v-else>
                                     <tr class="ct-tr" ref="headTr">
                                         <td class="ct-td" :colspan="colspansum" style="text-align: center;">
-                                            <span>  {{common.LocalizedString('暂无数据','暫無數據')}}</span>
+                                            <span> {{ common.LocalizedString('暂无数据', '暫無數據') }}</span>
                                         </td>
                                     </tr>
                                 </template>
@@ -135,6 +151,8 @@ import Enum from '../../utils/Enum'
 import common from '../../utils/common'
 import util from '../../utils/pub-use'
 import draggable from "vuedraggable";
+import Tablecurrency from './SearchList/Tablecurrency.vue';
+
 const emit = defineEmits(['click', 'input', 'change', 'popupSearchList', 'tableButtonClick'])
 const props = defineProps({
     parameterAction: String,
@@ -149,6 +167,8 @@ const Fields = ref()
 const colspansum = ref(0)
 const sumsList = ref([])
 const itemKey = ref(0)
+const renderList = ref([])
+const sortInfo = ref(null)
 const dragOptions = {
     animation: 200,
     group: model.value.fieldName1,
@@ -167,7 +187,7 @@ function Init() {
     model.value.validExcute = () => {
         var rtn = fieldsValidExcute();
         if (!rtn) {
-            model.value.displayValidMessage = common.LocalizedString('请填写','請填寫')+'[' + model.value.controlLabel + ']'
+            model.value.displayValidMessage = common.LocalizedString('请填写', '請填寫') + '[' + model.value.controlLabel + ']'
         }
         return fieldsValidExcute();
     }
@@ -185,6 +205,26 @@ function Init() {
             colspansum.value++;
         }
     }
+    refreshRenderList()
+
+}
+function refreshRenderList() {
+    // 拷贝一份全新数组，防止sort原地修改原始数据
+    const copyArr = [...model.value.tableData]
+    if (sortInfo.value) {
+        const { prop, order } = sortInfo.value
+        copyArr.sort((a, b) => {
+            const aValue = getLableShow(a[prop])
+            const bValue = getLableShow(b[prop])
+            if (typeof a === 'number') {
+                return order === 'asc' ? aValue - bValue : bValue - aValue
+            } else {
+                const res = aValue.localeCompare(bValue, 'zh-CN')
+                return order === 'asc' ? res : -res
+            }
+        })
+    }
+    renderList.value = copyArr
 }
 function popupSearchListHandle(field) {
     if (field.isSearchPageWithList) {
@@ -204,18 +244,24 @@ function addRow() {
         return
     }
     FormList.addRow(model.value);
+    refreshRenderList()
 }
 //修改
 function editRow(index) {
     FormList.editRow(index, model.value);
+    refreshRenderList()
 }
 //删除
-function deleteRow(index, sourceIndex) {
+function deleteRow(sourceIndex) {
     FormList.deleteRow(sourceIndex, model.value, () => {
-        model.value.tableData.splice(index, 1);
+        const targetIndex = model.value.tableData.findIndex(v => v.$sourceIndex === sourceIndex)
+        if (targetIndex > -1) {
+            model.value.tableData.splice(targetIndex, 1)
+        }
         model.value.onChanged = model.value.formListChange;
         model.value.createText = '';
         model.value.disabled = false;
+        refreshRenderList()
         emit('change', model.value);
     });
 }
@@ -230,7 +276,7 @@ function fieldsValidExcute() {
         if (model.value.form && model.value.form.fields) {
             const currentIndex = model.value.form.fields.findIndex(v => v.fieldName1 === model.value.fieldName1);
             if (currentIndex - 1 >= 0) {
-                if (model.value.form.fields[currentIndex - 1].controlType == Enum.ControlType.Group){
+                if (model.value.form.fields[currentIndex - 1].controlType == Enum.ControlType.Group) {
                     controlLabel = model.value.form.fields[currentIndex - 1].controlLabel;
                 }
             }
@@ -284,11 +330,14 @@ function changeHandler(field, index) {
     model.value.currentEventField = field;
     emit('change', model.value);
 }
+function rolRouterClickHandler(field, rowData, rowindex) {
+    buttonClick(rowData, field);
+}
 
 function buttonClick(row, button) {
     var submitData = {};
     button.submitFormField.forEach((v) => {
-        submitData[v] = row[common.initialsToUpperCase(v)].code1;
+        submitData[v] = common.getDataOfUpperLower(row, v).code1;
     });
     model.value.currentRowIndex = model.value.source.rows.findIndex(v => v.$sourceIndex === row.$sourceIndex);
 
@@ -339,13 +388,18 @@ function getSummaries() {
 function rolRouterCellClickHandler(routerKey, rowindex, sourceIndex) {
     if (routerKey == 'edit') {
         FormList.editRow(sourceIndex, model.value);
+        refreshRenderList()
     }
     else if (routerKey == 'delete') {
         FormList.deleteRow(sourceIndex, model.value, () => {
-            model.value.tableData.splice(rowindex, 1);
+            const targetIndex = model.value.tableData.findIndex(v => v.$sourceIndex === sourceIndex)
+            if (targetIndex > -1) {
+                model.value.tableData.splice(targetIndex, 1)
+            }
             model.value.onChanged = model.value.formListChange;
             model.value.createText = '';
             model.value.disabled = false;
+            refreshRenderList()
             emit('change', model.value);
         });
     } else {
@@ -401,6 +455,107 @@ function delRow(row) {
 function deleteAll() {
     FormList.deleteAll(model.value);
 }
+function toSort(ev, col, action) {
+    model.value.rows[0].field.forEach((v1) => {
+        v1.sortAction = "";
+    });
+    if (sortInfo.value && sortInfo.value.prop == col.fieldName1 && sortInfo.value.order == action) {
+        sortInfo.value = null
+    }
+    else {
+        sortInfo.value = {
+            prop: col.fieldName1,
+            order: action
+        }
+        col.sortAction = action;
+    }
+    refreshRenderList()
+    ev.cancelBubble = true;
+    ev.stopPropagation();
+}
+function getLableShow(data) {
+    let labelShow = data.name1;
+    if (!labelShow) {
+        labelShow = data.code1;
+    }
+    if (labelShow && data.unitName1) {
+        labelShow = labelShow + data.unitName1;
+    }
+    switch (data.controlType) {
+        case Enum.ControlType.Label:
+            if (data.value) {
+                labelShow = data.value;
+            }
+            break;
+        case Enum.ControlType.MultiSelectNoSearch:
+        case Enum.ControlType.MultiSelectWithSearch:
+            labelShow = '';
+            if (data.code1) {
+                JSON.parse(data.code1).forEach((op) => {
+                    if (op.flagDeleted !== 1) {
+                        if (op.flagDeleted != undefined && op.flagDeleted == true) {
+                        }
+                        else {
+                            labelShow += op['name'] + '   ';
+                        }
+                    }
+                });
+            }
+            break;
+        case Enum.ControlType.PhoneNumberText:
+        case Enum.ControlType.EmailText:
+            if (data.code2) {
+                labelShow = data.name1 + data.code2;
+            }
+            break;
+        case Enum.ControlType.NumericRange:
+            if (data.code1 && data.code2) {
+            }
+            else if (data.code1) {
+                labelShow = data.code1 + (data.unitName1 ? data.unitName1 : '') + '以上';
+            }
+            else if (data.code2) {
+                labelShow = data.code2 + (data.unitName1 ? data.unitName1 : '') + '以下';
+            }
+            break;
+        case Enum.ControlType.DateTimeRange:
+        case Enum.ControlType.DateRange:
+            if (data.code1 && data.code2) {
+            }
+            else if (data.code1) {
+                labelShow = data.code1 + (data.unitName1 ? data.unitName1 : '') + '以后';
+            }
+            else if (data.code2) {
+                labelShow = data.code2 + (data.unitName1 ? data.unitName1 : '') + '以前';
+            }
+            break;
+        case Enum.ControlType.Time:
+        case Enum.ControlType.TimeRange:
+            if (data.flagrange) {
+                if (data.code1 && data.code2) {
+                    labelShow = data.code1 + '-' + data.code2;
+                }
+            }
+            else {
+                if (data.code1) {
+                    labelShow = data.code1
+                }
+            }
+            break;
+        case Enum.ControlType.CheckBoxList:
+            labelShow = data.getCheckedName();;
+            break;
+        case Enum.ControlType.Switch:
+            labelShow = data.value ? '开启' : '关闭';
+            break;
+        case Enum.ControlType.CheckBox:
+            labelShow = data.value ? '是' : '否';
+            break;
+        default:
+            break;
+    }
+    return labelShow;
+}
 defineExpose({
     model
 })
@@ -483,4 +638,45 @@ th.th-edit {
     z-index: 1;
     background-color: #ffffff;
 }
+
+.ct-th>.caret-wrapper {
+    display: inline-flex;
+    flex-direction: column;
+    align-items: center;
+    height: 34px;
+    width: 10px;
+    vertical-align: middle;
+    cursor: pointer;
+    overflow: initial;
+    position: relative;
+}
+
+.ct-th>.caret-wrapper>.sort-caret {
+    width: 0;
+    height: 0;
+    border: 5px solid transparent;
+    position: absolute;
+    left: 7px;
+}
+
+.ct-th>.caret-wrapper>.sort-caret.ascending {
+    border-bottom-color: var(--centalinePlaceholder);
+    top: 5px;
+}
+
+.ct-th>.caret-wrapper>.sort-caret.descending {
+    border-top-color: var(--centalinePlaceholder);
+    bottom: 7px;
+}
+
+
+.ct-th.asc>.caret-wrapper>.sort-caret.ascending {
+    border-bottom-color: #409eff;
+    top: 5px;
+}
+
+.ct-th.desc>.caret-wrapper>.sort-caret.descending {
+    border-top-color: #409eff;
+    bottom: 7px;
+}
 </style>

package/src/components/web/File.vue

@@ -166,7 +166,7 @@
   </template>
 </template>
 <script setup lang="ts">
-import { ref, nextTick, computed, onBeforeUnmount } from 'vue'
+import { ref, nextTick, computed, onBeforeUnmount,inject ,watch } from 'vue'
 import { ElMessage, UploadProps } from 'element-plus'
 import common from '../../utils/common'
 import { changeHandler } from '../../utils/mixins';
@@ -623,12 +623,31 @@ function addClass(el, className) {
   newClassName.push(className);
   el.className = newClassName.join(" ");
 }
+ const injectedViewerFileToggle = inject('onViewerFileToggle')
 
 
 //预览文件
 function viewerfile(file) {
-  File.viewerfile(file, model.value)
+
+  File.viewerfile(file, model.value, function (MediaAlbum, groupIndex, index) {
+    injectedViewerFileToggle(true, MediaAlbum, groupIndex, index);
+  })
 }
+ const ChangeFileList = inject('ChangeFileList')
+
+watch(
+  () => model.value?.fileList,  // 直接监听 fileList 数组
+  (newFileList) => {
+    nextTick(() => {
+      if (model.value?.mediaViewPageType === 3) {
+        const { album } = File.buildMediaAlbum(model.value);
+        const MediaAlbum = [album];
+        ChangeFileList(MediaAlbum, 0, 0);
+      }
+    });
+  },
+  { deep: true }  // 深度监听，以便捕获数组内元素属性变化（与原 JSON.stringify 效果一致）
+);
 
 function PasteUpload(event) {
   if (!model.value.locked && !model.value.disableUpload) {