feat: tag search添加快捷操作

src/components/DateTimePicker/index.vue

@@ -9,9 +9,12 @@
     size="large"
     :clearable="false"
     class="datepicker"
+    :picker-options="pickerOptions"
     value-format="yyyy-MM-ddThh:mm"
     :default-time="['12:00:00', '12:00:00']"
+    v-bind="$attrs"
     @change="handleDateChange"
+    v-on="$listeners"
   />
 </template>
 
@@ -24,7 +27,36 @@ export default {
   components: {},
   data() {
     return {
-      value: [formatDate((new Date().getTime()) - 432000000), formatDate(new Date().getTime())]
+      value: [formatDate((new Date().getTime()) - 432000000), formatDate(new Date().getTime())],
+      pickerOptions: {
+        shortcuts: [
+          {
+            text: this.$t('common.DateLastWeek'),
+            onClick(picker) {
+              const end = new Date()
+              const start = new Date()
+              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
+              picker.$emit('pick', [start, end])
+            }
+          }, {
+            text: this.$t('common.DateLastMonth'),
+            onClick(picker) {
+              const end = new Date()
+              const start = new Date()
+              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
+              picker.$emit('pick', [start, end])
+            }
+          }, {
+            text: this.$t('common.DateLast3Months'),
+            onClick(picker) {
+              const end = new Date()
+              const start = new Date()
+              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
+              picker.$emit('pick', [start, end])
+            }
+          }
+        ]
+      }
     }
   },
   computed: {

src/components/ListTable/TableAction/index.vue

@@ -4,13 +4,13 @@
       <div class="table-header-left-side">
         <LeftSide v-if="hasLeftActions" :selected-rows="selectedRows" :table-url="tableUrl" v-bind="$attrs" v-on="$listeners" />
         <span v-else style="display: flex;flex-direction: row">
-          <DateTimePicker v-if="hasDatePicker" class="datepicker" @dateChange="handleDateChange" />
           <AutoDataSearch v-if="hasSearch" class="right-side-item action-search" :config="searchConfig" :url="tableUrl" @tagSearch="handleTagSearch" />
+          <DateTimePicker v-if="hasDatePicker" class="datepicker" @dateChange="handleDateChange" />
         </span>
       </div>
       <div class="table-action-right-side">
-        <DateTimePicker v-if="hasDatePicker && hasLeftActions" class="datepicker" @dateChange="handleDateChange" />
         <AutoDataSearch v-if="hasLeftActions && hasSearch" class="right-side-item action-search" :config="searchConfig" :url="tableUrl" @tagSearch="handleTagSearch" />
+        <DateTimePicker v-if="hasDatePicker && hasLeftActions" class="datepicker" @dateChange="handleDateChange" />
         <RightSide v-if="hasRightActions" :selected-rows="selectedRows" :table-url="tableUrl" v-bind="$attrs" v-on="$listeners" />
       </div>
     </slot>
@@ -62,6 +62,7 @@ export default {
   data() {
     return {
       keyword: ''
+
     }
   },
   computed: {
@@ -131,7 +132,7 @@ export default {
     padding: 5px 20px;
   }
   .datepicker{
-    margin-right: 15px;
+    margin-left: 10px;
   }
 
 </style>

src/i18n/langs/cn.json

@@ -136,6 +136,9 @@
   "common": {
     "CrontabHelpTips": "eg：每周日 03:05 执行 <5 3 * * 0> <br> 提示： 使用5位 Linux crontab 表达式 <分 时 日 月 星期> （<a href='https://tool.lu/crontab/' target='_blank'>在线工具</a>） <br>注意： 如果同时设置了定期执行和周期执行，优先使用定期执行",
     "BadRequestErrorMsg": "请求错误，请检查填写内容",
+    "DateLastWeek": "最近一周",
+    "DateLastMonth": "最近一个月",
+    "DateLast3Months": "最近三个月",
     "Action": "动作",
     "Actions": "操作",
     "Activate": "激活",

src/i18n/langs/en.json

@@ -135,6 +135,9 @@
   "common": {
     "CrontabHelpTips": "eg: Every Sunday 03:05 run <5 3 * * 0> <br>Tips:Using 5 digits linux crontab expressions<min hour day month week> (<a href='https://tool.lu/crontab/' target='_blank'>Online tools</a>) <br>Note:If both Regularly perform and Cycle perform are set,give priority to Regularly perform",
     "BadRequestErrorMsg" : "Bad request, please check again",
+    "DateLastWeek": "Last week",
+    "DateLastMonth": "Last month",
+    "DateLast3Months": "Last 3 months",
     "Action": "Action",
     "Actions": "Actions",
     "Activate": "Activate",