perf: 时间选择器新增默认值功能,高级查询表单交互几处细节优化 @0.9.4-6

BoBoooooo · Apr 29, 2021 · 2c753b9 · 2c753b9
1 parent 758a8bd
commit 2c753b9
Show file tree

Hide file tree

Showing 6 changed files with 15 additions and 9 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "element-pro-crud",
-  "version": "0.9.4-5",
+  "version": "0.9.4-6",
   "author": "BoBo<[email protected]>",
   "main": "lib/pro-crud.js",
   "files": [

diff --git a/src/component/form-designer/src/WidgetConfig.vue b/src/component/form-designer/src/WidgetConfig.vue
@@ -228,6 +228,7 @@
             elementConfig.type == 'color' ||
             elementConfig.type == 'switch' ||
             elementConfig.type == 'date' ||
+            elementConfig.type == 'time' ||
             elementConfig.type == 'select' ||
             elementConfig.type == 'html')
         "
@@ -246,7 +247,7 @@
           >清空</el-button
         >
         <el-color-picker v-if="elementConfig.type == 'color'" v-model="elementConfig.options.defaultValue" :show-alpha="elementConfig.options.showAlpha"></el-color-picker>
-        <el-switch v-if="elementConfig.type == 'switch' || elementConfig.type == 'date'" v-model="elementConfig.options.defaultValue"></el-switch>
+        <el-switch v-else-if="elementConfig.type == 'switch' || elementConfig.type == 'date' || elementConfig.type == 'time'" v-model="elementConfig.options.defaultValue"></el-switch>
       </el-form-item>
       <el-form-item label="最多输入" v-if="elementConfig.options.maxLength !== undefined">
         <el-input v-model="elementConfig.options.maxLength" placeholder="请输入最大长度">

diff --git a/src/component/form-designer/src/componentsConfig.ts b/src/component/form-designer/src/componentsConfig.ts
@@ -163,7 +163,7 @@ export const basicComponents = [
     icon: 'clock',
     options: {
       hiddenLabel: false,
-      defaultValue: '',
+      defaultValue: false,
       readonly: false,
       disabled: false,
       editable: true,
@@ -172,7 +172,7 @@ export const basicComponents = [
       startPlaceholder: '',
       endPlaceholder: '',
       type: 'datetime',
-      format: 'yyyy-MM-dd hh:mm:ss',
+      format: 'hh:mm:ss',
       timestamp: false,
       required: false,
       width: '100%',
@@ -686,4 +686,4 @@ export const elementComponentConfig = {
 };
 
 // 表单类组件枚举
-export const formElement = ['input', 'textarea', 'number', 'radio', 'checkbox', 'date', 'rate', 'color', 'select', 'switch', 'slider', 'cascader', 'treeselect', 'richtext'];
+export const formElement = ['input', 'textarea', 'number', 'radio', 'checkbox', 'date', 'time', 'rate', 'color', 'select', 'switch', 'slider', 'cascader', 'treeselect', 'richtext'];
diff --git a/src/component/pro-form/src/ProForm.vue b/src/component/pro-form/src/ProForm.vue
@@ -34,6 +34,7 @@
 import { Component, Vue, Prop, Watch } from 'vue-property-decorator';
 import { AnyObject } from '@/types/common';
 import { formElement } from '@/component/form-designer/src/componentsConfig';
+import dayjs from 'dayjs';
 import ProLayout from './ProLayout.vue';
 
 @Component({
@@ -280,11 +281,12 @@ export default class ProForm extends Vue {
   // 表单默认值回填单独拉出来封装
   setDefaultValue(config) {
     // 如果时间选择器需要默认值,默认回填当前日期
-    if (config.type === 'date') {
+    if (config.type === 'date' || config.type === 'time') {
       if (config.options.defaultValue) {
         const { format } = config.options;
-        if (format && format !== '') {
-          this.models[config.model] = this.dayjs().format(format.toUpperCase());
+        if (format) {
+          console.log(format);
+          this.models[config.model] = dayjs().format(config.type === 'time' ? format : format.toUpperCase());
         }
       } else {
         this.models[config.model] = null;

diff --git a/src/component/pro-table/src/SearchForm.vue b/src/component/pro-table/src/SearchForm.vue
@@ -105,6 +105,8 @@ export default defineComponent({
           },
         ];
       }
+      // 一键搜需要清空高级查询条件
+      paramsTips.value = [];
       emit('update:searchFormCondition', params);
     };
 
@@ -151,6 +153,7 @@ export default defineComponent({
         operator: item.operator,
         label: seachableColumns.value.find((s) => s.prop === item.field)!.label,
       }));
+      searchContent.value = '';
       emit('update:searchFormCondition', params);
       emit('click');
     };

diff --git a/src/component/pro-table/src/SeniorSearchForm.vue b/src/component/pro-table/src/SeniorSearchForm.vue
@@ -20,7 +20,7 @@
         <span>高级查询</span>
       </div>
       <div>
-        <ProForm ref="generateDialogForm" :data="formDesign" :remote="remoteFuncs" :entity.sync="entity" />
+        <ProForm v-if="visible" ref="generateDialogForm" :data="formDesign" :remote="remoteFuncs" :entity.sync="entity" />
         <div style="float: right">
           <el-button size="small" type="primary" icon="el-icon-search" @click="getSearchFormData()">查询</el-button>
           <el-button size="small" style="margin-right: 10px" icon="el-icon-close" @click="resetForm">关闭</el-button>