添加数字区间组件

.vscode/settings.json

@@ -123,7 +123,8 @@
   "[vue]": {
     "editor.codeActionsOnSave": {
       "source.fixAll.eslint": false
-    }
+    },
+    "editor.defaultFormatter": "johnsoncodehk.volar"
   },
   "i18n-ally.localesPaths": ["src/locales/lang"],
   "i18n-ally.keystyle": "nested",

src/components/Form/src/componentMap.ts

@@ -22,6 +22,7 @@ import RadioButtonGroup from './components/RadioButtonGroup.vue';
 import MultipleTreeSelect from './components/MultipleTreeSelect.vue';
 import FamilyArrCom from './components/FamilyArrCom.vue';
 import CarArrayCom from './components/CarArrayCom.vue';
+import RangeNumber from './components/RangeNumber.vue';
 import ApiSelect from './components/ApiSelect.vue';
 import { BasicUpload } from '/@/components/Upload';
 import { StrengthMeter } from '/@/components/StrengthMeter';
@@ -34,6 +35,7 @@ componentMap.set('InputPassword', Input.Password);
 componentMap.set('InputSearch', Input.Search);
 componentMap.set('InputTextArea', Input.TextArea);
 componentMap.set('InputNumber', InputNumber);
+componentMap.set('RangeNumber', RangeNumber);
 componentMap.set('AutoComplete', AutoComplete);
 
 componentMap.set('Select', Select);

src/components/Form/src/components/RangeNumber.vue

@@ -0,0 +1,96 @@
+<template>
+  <!-- <BasicTable @register="registerTable" /> -->
+  <div class="arr-wrap">
+    <a-input-group compact>
+      <a-input
+        v-model:value="minValue"
+        @blur="handleMinBlur"
+        style="width: 4.5rem; text-align: center"
+        placeholder="Min"
+      />
+      <a-input style="width: 2rem; border-left: 0; pointer-events: none" placeholder="~" />
+      <a-input
+        v-model:value="maxValue"
+        @blur="handleMaxBlur"
+        style="width: 4.5rem; text-align: center; border-left: 0"
+        placeholder="Max"
+      />
+    </a-input-group>
+  </div>
+</template>
+<script lang="ts">
+  import { defineComponent, ref, watch } from 'vue';
+
+  const props = {
+    value: { type: String, default: '' },
+  };
+  export default defineComponent({
+    name: 'RangeNumber',
+    props,
+    emits: ['change'],
+    setup(props, { emit }) {
+      const minValue = ref<string>('');
+      const maxValue = ref<string>('');
+      const formatMin = (val: string, preVal: string) => {
+        const reg = /^-?\d*(\.\d*)?$/;
+        if ((!isNaN(+val) && reg.test(val)) || val === '' || val === '-') {
+          minValue.value = val;
+        } else {
+          minValue.value = preVal;
+        }
+        if (minValue.value || maxValue.value) {
+          emit('change', [minValue.value, maxValue.value]);
+        } else {
+          emit('change', '');
+        }
+      };
+      const formatMax = (val: string, preVal: string) => {
+        const reg = /^-?\d*(\.\d*)?$/;
+        if ((!isNaN(+val) && reg.test(val)) || val === '' || val === '-') {
+          maxValue.value = val;
+        } else {
+          maxValue.value = preVal;
+        }
+        if (minValue.value || maxValue.value) {
+          emit('change', [minValue.value, maxValue.value]);
+        } else {
+          emit('change', '');
+        }
+      };
+      const handleMinBlur = () => {
+        if (minValue.value.charAt(minValue.value.length - 1) === '.' || minValue.value === '-') {
+          formatMin(minValue.value.slice(0, -1), minValue.value);
+        }
+      };
+      const handleMaxBlur = () => {
+        if (maxValue.value.charAt(maxValue.value.length - 1) === '.' || maxValue.value === '-') {
+          formatMax(maxValue.value.slice(0, -1), maxValue.value);
+        }
+      };
+
+      watch(minValue, (val, preVal) => {
+        formatMin(val, preVal);
+      });
+      watch(
+        () => props.value,
+        (val) => {
+          if (val === '') {
+            minValue.value = '';
+            maxValue.value = '';
+          }
+        },
+        { deep: true }
+      );
+      watch(maxValue, (val, preVal) => {
+        formatMax(val, preVal);
+      });
+
+      return {
+        minValue,
+        maxValue,
+        handleMinBlur,
+        handleMaxBlur,
+      };
+    },
+  });
+</script>

src/components/Form/src/types/index.ts

@@ -87,6 +87,7 @@ export type ComponentType =
   | 'InputSearch'
   | 'InputTextArea'
   | 'InputNumber'
+  | 'RangeNumber'
   | 'InputCountDown'
   | 'Select'
   | 'FamilyArrCom'

src/views/admin/rule/index.vue

@@ -24,11 +24,10 @@
           <a-button color="error" :disabled="disable_btn" @click="deleteBatches"> 删除 </a-button>
         </div>
       </template>
-      <template #action="{ record, column }">
-        <TableAction :actions="createActions(record, column)" stopButtonPropagation />
+      <template #action="{ record }">
+        <TableAction :actions="createActions(record)" stopButtonPropagation />
       </template>
     </BasicTable>
-    <ExpExcelModel @register="register" @success="defaultHeader" />
     <Popup @register="addRegister" :popupData="popupData" @saveData="saveData" />
   </CollapseContainer>
 </template>

src/views/general/attachment/index.vue

@@ -13,8 +13,8 @@
     <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" showTableSetting>
-      <template #action="{ record, column }">
-        <TableAction :actions="createActions(record, column)" stopButtonPropagation />
+      <template #action="{ record }">
+        <TableAction :actions="createActions(record)" stopButtonPropagation />
       </template>
       <template #toolbar>
         <div class="tool-btn-wrap">
@@ -140,6 +140,9 @@
         console.log(`record`, record);
         console.log('删除=====');
       }
+      async function deleteBatches() {
+        console.log('批量删除=====');
+      }
 
       function createActions(record: EditRecordRow): ActionItem[] {
         return [
@@ -164,6 +167,7 @@
         t,
         createActions,
         tableRef,
+        deleteBatches,
         registerTable,
         beforeUpload,
         handleChange,

src/views/member/unit/data.ts

@@ -92,7 +92,7 @@ export const columns: BasicColumn[] = [
 
 export function getFormConfig(): Partial<FormProps> {
   return {
-    labelWidth: 100,
+    labelWidth: 110,
     schemas: [
       {
         field: `id`,
@@ -133,8 +133,9 @@ export function getFormConfig(): Partial<FormProps> {
       {
         field: `foundingtime`,
         label: `成立时间`,
-        component: 'DatePicker',
+        component: 'RangePicker',
         componentProps: {
+          valueFormat: 'YYYY-MM-DD',
           placeholder: '成立时间',
         },
         colProps: {
@@ -219,10 +220,11 @@ export function getFormConfig(): Partial<FormProps> {
       {
         field: `regMoney`,
         label: `注册资金`,
-        component: 'Input',
+        component: 'RangeNumber',
         componentProps: {
           placeholder: '注册资金',
         },
+        defaultValue: '',
         colProps: {
           xl: 12,
           xxl: 8,
@@ -231,10 +233,11 @@ export function getFormConfig(): Partial<FormProps> {
       {
         field: `jobnum`,
         label: `职工人数`,
-        component: 'Input',
+        component: 'RangeNumber',
         componentProps: {
           placeholder: '职工人数',
         },
+        defaultValue: '',
         colProps: {
           xl: 12,
           xxl: 8,

src/views/member/unit/index.vue

@@ -136,11 +136,6 @@
               if (!params.filter) {
                 params.filter = {};
               }
-              if (params.foundingtime) {
-                params.foundingtime = moment(params.foundingtime).format('YYYY-MM-DD');
-              } else {
-                delete params.foundingtime;
-              }
               params.filter[k] = params[k];
               delete params[k];
             }