科室质控列表查询入院日期和出院日期快捷选择

src/views/recordsRoom/qc/components/SearchBox.vue

@@ -7,13 +7,13 @@
           <el-form-item label="出院日期">
             <div style="width: 100%;display: flex;gap: 5px;">
               <el-form-item prop="AAC01_START">
-                <el-date-picker style="width: 94%;" v-model="formData.AAC01_START" type="date" placeholder="请选择开始时间"
-                  value-format="yyyy-MM-dd" format="yyyy-MM-dd">
+                <el-date-picker style="width: 100%" v-model="formData.AAC01_START" type="date" placeholder="出院开始日期"
+                  :picker-options="AAC01PickerOptions" value-format="yyyyMMdd" format="yyyy年MM月dd日">
                 </el-date-picker>
               </el-form-item>
-              <el-form-item prop="AAB01_END">
-                <el-date-picker style="width: 100%;" v-model="formData.AAB01_END" type="date" placeholder="请选择结束时间"
-                  value-format="yyyy-MM-dd" format="yyyy-MM-dd">
+              <el-form-item prop="AAC01_END">
+                <el-date-picker style="width: 100%" v-model="formData.AAC01_END" type="date" placeholder="出院开始日期"
+                  value-format="yyyyMMdd" format="yyyy年MM月dd日">
                 </el-date-picker>
               </el-form-item>
             </div>
@@ -38,13 +38,13 @@
           <el-form-item label="入院日期">
             <div style="width: 100%;display: flex;gap: 5px;">
               <el-form-item prop="AAB01_START">
-                <el-date-picker style="width: 94%;" v-model="formData.AAB01_START" type="date" placeholder="请选择开始时间"
-                  value-format="yyyy-MM-dd" format="yyyy-MM-dd">
+                <el-date-picker style="width: 100%" v-model="formData.AAB01_START" type="date" placeholder="出院开始日期"
+                  :picker-options="AAB01PickerOptions" value-format="yyyyMMdd" format="yyyy年MM月dd日">
                 </el-date-picker>
               </el-form-item>
               <el-form-item prop="AAB01_END">
-                <el-date-picker style="width: 100%;" v-model="formData.AAB01_END" type="date" placeholder="请选择结束时间"
-                  value-format="yyyy-MM-dd" format="yyyy-MM-dd">
+                <el-date-picker style="width: 100%" v-model="formData.AAB01_END" type="date" placeholder="出院开始日期"
+                 value-format="yyyyMMdd" format="yyyy年MM月dd日">
                 </el-date-picker>
               </el-form-item>
             </div>
@@ -71,8 +71,11 @@
   </div>
 </template>
 <script>
+import moment from 'moment/moment';
+
 export default {
   data() {
+    const that = this
     return {
       formData: {
         AAC01_START: '',
@@ -83,7 +86,143 @@ export default {
         AAC02C: '',
         review_status: '',
       },
-      departments: []
+      departments: [],
+      AAC01PickerOptions: {
+        disabledDate: (time) => {
+          if (that.formData.AAC01_END != "") {
+            return time.getTime() > Date.now();
+          }
+        },
+        shortcuts: [{
+          text: '今天',
+          onClick(picker) {
+            picker.$emit('pick', moment().format('YYYYMMDD'));
+            that.formData.AAC01_END = moment().format('YYYYMMDD')
+          }
+        }, {
+          text: '近7天',
+          onClick(picker) {
+            picker.$emit('pick', moment().subtract(7, 'days').format('YYYYMMDD'));
+            that.formData.AAC01_END = moment().format('YYYYMMDD')
+          }
+        }, {
+          text: '近30天',
+          onClick(picker) {
+            picker.$emit('pick', moment().subtract(30, 'days').format('YYYYMMDD'));
+            that.formData.AAC01_END = moment().format('YYYYMMDD')
+          }
+        }, {
+          text: '一季度',
+          onClick(picker) {
+            picker.$emit('pick', moment().startOf('year').format('YYYYMMDD'));
+            that.formData.AAC01_END = moment().startOf('year').add(3,'M').subtract(1, 'days').format('YYYYMMDD')
+          }
+        },  {
+          text: '二季度',
+          onClick(picker) {
+            picker.$emit('pick', moment().startOf('year').add(3,'M').format('YYYYMMDD'));
+            that.formData.AAC01_END = moment().startOf('year').add(6,'M').subtract(1, 'days').format('YYYYMMDD')
+          }
+        },  {
+          text: '三季度',
+          onClick(picker) {
+            picker.$emit('pick', moment().startOf('year').add(6,'M').format('YYYYMMDD'));
+            that.formData.AAC01_END = moment().startOf('year').add(9,'M').subtract(1, 'days').format('YYYYMMDD')
+          }
+        },  {
+          text: '四季度',
+          onClick(picker) {
+            picker.$emit('pick', moment().startOf('year').add(9,'M').format('YYYYMMDD'));
+            that.formData.AAC01_END = moment().startOf('year').add(12,'M').subtract(1, 'days').format('YYYYMMDD')
+          }
+        }, {
+          text: moment().add(-2,'Y').format("YYYY"),
+          onClick(picker) {
+            picker.$emit('pick', moment().add(-2,'Y').startOf('year').format('YYYYMMDD'));
+            that.formData.AAC01_END = moment().add(-2,'Y').endOf('year').format('YYYYMMDD')
+          }
+        }, {
+          text: moment().add(-1,'Y').format("YYYY"),
+          onClick(picker) {
+            picker.$emit('pick', moment().add(-1,'Y').startOf('year').format('YYYYMMDD'));
+            that.formData.AAC01_END = moment().add(-1,'Y').endOf('year').format('YYYYMMDD')
+          }
+        }, {
+          text: moment().format("YYYY"),
+          onClick(picker) {
+            picker.$emit('pick', moment().startOf('year').format('YYYYMMDD'));
+            that.formData.AAC01_END = moment().endOf('year').format('YYYYMMDD')
+          }
+        }]
+      },
+      AAB01PickerOptions: {
+        disabledDate: (time) => {
+          if (that.formData.AAB01_END != "") {
+            return time.getTime() > Date.now();
+          }
+        },
+        shortcuts: [{
+          text: '今天',
+          onClick(picker) {
+            picker.$emit('pick', moment().format('YYYYMMDD'));
+            that.formData.AAB01_END = moment().format('YYYYMMDD')
+          }
+        }, {
+          text: '近7天',
+          onClick(picker) {
+            picker.$emit('pick', moment().subtract(7, 'days').format('YYYYMMDD'));
+            that.formData.AAB01_END = moment().format('YYYYMMDD')
+          }
+        }, {
+          text: '近30天',
+          onClick(picker) {
+            picker.$emit('pick', moment().subtract(30, 'days').format('YYYYMMDD'));
+            that.formData.AAB01_END = moment().format('YYYYMMDD')
+          }
+        }, {
+          text: '一季度',
+          onClick(picker) {
+            picker.$emit('pick', moment().startOf('year').format('YYYYMMDD'));
+            that.formData.AAB01_END = moment().startOf('year').add(3,'M').subtract(1, 'days').format('YYYYMMDD')
+          }
+        },  {
+          text: '二季度',
+          onClick(picker) {
+            picker.$emit('pick', moment().startOf('year').add(3,'M').format('YYYYMMDD'));
+            that.formData.AAB01_END = moment().startOf('year').add(6,'M').subtract(1, 'days').format('YYYYMMDD')
+          }
+        },  {
+          text: '三季度',
+          onClick(picker) {
+            picker.$emit('pick', moment().startOf('year').add(6,'M').format('YYYYMMDD'));
+            that.formData.AAB01_END = moment().startOf('year').add(9,'M').subtract(1, 'days').format('YYYYMMDD')
+          }
+        },  {
+          text: '四季度',
+          onClick(picker) {
+            picker.$emit('pick', moment().startOf('year').add(9,'M').format('YYYYMMDD'));
+            that.formData.AAB01_END = moment().startOf('year').add(12,'M').subtract(1, 'days').format('YYYYMMDD')
+          }
+        }, {
+          text: moment().add(-2,'Y').format("YYYY"),
+          onClick(picker) {
+            picker.$emit('pick', moment().add(-2,'Y').startOf('year').format('YYYYMMDD'));
+            that.formData.AAB01_END = moment().add(-2,'Y').endOf('year').format('YYYYMMDD')
+          }
+        }, {
+          text: moment().add(-1,'Y').format("YYYY"),
+          onClick(picker) {
+            picker.$emit('pick', moment().add(-1,'Y').startOf('year').format('YYYYMMDD'));
+            that.formData.AAB01_END = moment().add(-1,'Y').endOf('year').format('YYYYMMDD')
+          }
+        }, {
+          text: moment().format("YYYY"),
+          onClick(picker) {
+            picker.$emit('pick', moment().startOf('year').format('YYYYMMDD'));
+            that.formData.AAB01_END = moment().endOf('year').format('YYYYMMDD')
+          }
+        }]
+      },
     }
   },
   created() {