fix:添加时间筛选控件

src/components/datePicker/index.vue

@@ -0,0 +1,129 @@
+<template>
+  <div>
+    <a-select
+      v-model="timeType"
+      placeholder="请选择时间类型"
+      @change="timeTypeChange"
+      allowClear
+    >
+      <a-select-option
+        v-for="item in timeList"
+        :key="item.value"
+        :label="item.label"
+        :value="item.value"
+      >
+        {{ item.label }}
+      </a-select-option>
+    </a-select>
+    <a-range-picker
+      v-show="timeType == '1'"
+      @change="onChangeTime(1)"
+      v-model="signingTime"
+      value-format="YYYY-MM-DD"
+      style="margin-left: 10px"
+    >
+      <a-icon slot="suffixIcon" type="calendar" />
+    </a-range-picker>
+    <a-range-picker
+      v-show="timeType == '2'"
+      @change="onChangeTime(2)"
+      v-model="enterTime"
+      value-format="YYYY-MM-DD"
+      style="margin-left: 10px"
+    >
+      <a-icon slot="suffixIcon" type="calendar" />
+    </a-range-picker>
+    <a-radio-group
+      default-value="0"
+      button-style="solid"
+      v-model="dateType"
+      @change="getList()"
+      style="margin-left: 10px"
+    >
+      <a-radio-button value="1" @click="clearTime"> 当天 </a-radio-button>
+      <a-radio-button value="2" @click="clearTime"> 近7天 </a-radio-button>
+      <a-radio-button value="3" @click="clearTime"> 近30天 </a-radio-button>
+    </a-radio-group>
+  </div>
+</template>
+
+<script>
+import moment from "moment";
+
+export default {
+  props: {
+    form: {},
+  },
+  data() {
+    return {
+      timeList: [
+        { value: "1", label: "签单时间" },
+        { value: "2", label: "录单时间" },
+      ],
+      timeType: "1",
+      signingTime: [
+        moment().format("YYYY-MM-DD"),
+        moment().format("YYYY-MM-DD"),
+      ],
+      enterTime: [moment().format("YYYY-MM-DD"), moment().format("YYYY-MM-DD")],
+      dateType: undefined,
+    };
+  },
+  created() {},
+  mounted() {},
+  methods: {
+    clearTime() {
+      this.signingTime = [];
+      this.enterTime = [];
+      // (formState.createtimeEnd = '')
+    },
+    getList() {
+      //
+      this.$emit("getList", {
+        dateType: this.dateType,
+        signingTimeStart: "",
+        signingTimeEnd: "",
+        enterTimeStart: "",
+        enterTimeEnd: "",
+      });
+    },
+    onChangeTime(type) {
+      //   123;
+      this.dateType = undefined;
+      if (type == 1) {
+        this.$emit("getList", {
+          dateType: undefined,
+          signingTimeStart: this.signingTime[0],
+          signingTimeEnd: this.signingTime[1],
+        });
+      } else {
+        this.$emit("getList", {
+          dateType: undefined,
+
+          enterTimeStart: this.enterTime[0],
+          enterTimeEnd: this.enterTime[1],
+        });
+      }
+    },
+    timeTypeChange(val) {
+      this.dateType = undefined;
+      if (val == 1) {
+        this.$emit("getList", {
+          dateType: undefined,
+          signingTimeStart: this.signingTime[0],
+          signingTimeEnd: this.signingTime[1],
+        });
+      } else {
+        this.$emit("getList", {
+          dateType: undefined,
+
+          enterTimeStart: this.enterTime[0],
+          enterTimeEnd: this.enterTime[1],
+        });
+      }
+    },
+  },
+};
+</script>
+<style lang='less' scoped>
+</style>

src/pages/business/agent.vue

@@ -101,7 +101,8 @@
         <div class="table-title">
           <h2>代理人</h2>
           <div>
-            <span>时间筛选</span>
+            <datePicker @getList="timeChange"></datePicker>
+            <!-- <span>时间筛选</span>
             <a-range-picker
               @change="onChangeTime"
               v-model="formState.time"
@@ -147,7 +148,7 @@
               >
                 近30天
               </a-radio-button>
-            </a-radio-group>
+            </a-radio-group> -->
           </div>
         </div>
         <a-form
@@ -213,6 +214,7 @@ import StandardTable from "@/components/table/StandardTable";
 // import mixin from "../../minins/mixin";
 import tree from "@/components/tree/agentChanell";
 import moment from "moment";
+import datePicker from "@/components/datePicker";
 
 const columns = [
   {
@@ -270,6 +272,7 @@ export default {
   components: {
     StandardTable,
     tree,
+    datePicker,
   },
   //   mixins: [mixin],
   data() {
@@ -320,6 +323,11 @@ export default {
     // }, 1000);
   },
   methods: {
+    timeChange(val) {
+      // console.log(val);
+      this.formState = { ...val };
+      this.getList();
+    },
     showTab(val) {
       // console.log(val);
       if (val == 1) {

src/pages/business/channel.vue

@@ -90,7 +90,8 @@
         <div class="table-title">
           <h2>渠道</h2>
           <div>
-            <span>时间筛选</span>
+            <datePicker @getList="timeChange"></datePicker>
+            <!-- <span>时间筛选</span>
             <a-range-picker
               @change="onChangeTime"
               v-model="formState.time"
@@ -136,7 +137,7 @@
               >
                 近30天
               </a-radio-button>
-            </a-radio-group>
+            </a-radio-group> -->
           </div>
         </div>
         <a-form
@@ -205,6 +206,7 @@ import StandardTable from "@/components/table/StandardTable";
 // import mixin from "../../minins/mixin";
 import tree from "@/components/tree/agentChanell";
 import moment from "moment";
+import datePicker from "@/components/datePicker";
 
 const columns = [
   {
@@ -287,6 +289,7 @@ export default {
   components: {
     StandardTable,
     tree,
+    datePicker,
   },
   //   mixins: [mixin],
   data() {
@@ -338,6 +341,11 @@ export default {
     this.getVerification();
   },
   methods: {
+    timeChange(val) {
+      // console.log(val);
+      this.formState = { ...val };
+      this.getList();
+    },
     showTab(val) {
       // console.log(val);
       if (val == 1) {

src/pages/business/message.vue

@@ -67,7 +67,8 @@
         <div class="table-title">
           <h2>保费详情</h2>
           <div>
-            <span>时间筛选</span>
+            <datePicker @getList="timeChange"></datePicker>
+            <!-- <span>时间筛选</span>
             <a-range-picker
               @change="onChangeTime"
               v-model="formState.time"
@@ -113,7 +114,7 @@
               >
                 近30天
               </a-radio-button>
-            </a-radio-group>
+            </a-radio-group> -->
           </div>
         </div>
 
@@ -146,6 +147,7 @@
     <script>
 import StandardTable from "@/components/table/StandardTable";
 // import mixin from "../../minins/mixin";
+import datePicker from "@/components/datePicker";
 
 // import moment from "moment";
 
@@ -186,6 +188,7 @@ const columns = [
 export default {
   components: {
     StandardTable,
+    datePicker,
   },
   //   mixins: [mixin],
   data() {
@@ -249,6 +252,11 @@ export default {
     // this.getVerification();
   },
   methods: {
+    timeChange(val) {
+      // console.log(val);
+      this.formState = { ...val };
+      this.getList();
+    },
     getList() {
       this.pagination.current = 1;
       this.pagination.defaultPageSize = 10;

src/pages/business/sales.vue

@@ -98,7 +98,7 @@
         <div class="table-title">
           <h2>电销</h2>
           <div>
-            <span>时间筛选</span>
+            <!-- <span>时间筛选</span>
             <a-range-picker
               @change="onChangeTime"
               v-model="formState.time"
@@ -106,45 +106,8 @@
               style="margin-left: 10px"
             >
               <a-icon slot="suffixIcon" type="calendar" />
-            </a-range-picker>
-            <a-radio-group
-              default-value="0"
-              button-style="solid"
-              v-model="formState.dateType"
-              @change="getVerification()"
-              style="margin-left: 10px"
-            >
-              <a-radio-button
-                value="1"
-                @click="
-                  (formState.time = []),
-                    (formState.createtimeStart = ''),
-                    (formState.createtimeEnd = '')
-                "
-              >
-                当天
-              </a-radio-button>
-              <a-radio-button
-                value="2"
-                @click="
-                  (formState.time = []),
-                    (formState.createtimeStart = ''),
-                    (formState.createtimeEnd = '')
-                "
-              >
-                近7天
-              </a-radio-button>
-              <a-radio-button
-                value="3"
-                @click="
-                  (formState.time = []),
-                    (formState.createtimeStart = ''),
-                    (formState.createtimeEnd = '')
-                "
-              >
-                近30天
-              </a-radio-button>
-            </a-radio-group>
+            </a-range-picker> -->
+            <datePicker @getList="timeChange"></datePicker>
           </div>
         </div>
         <a-form
@@ -206,7 +169,8 @@
 import StandardTable from "@/components/table/StandardTable";
 // import mixin from "../../minins/mixin";
 import tree from "@/components/tree/userTree";
-import moment from "moment";
+// import moment from "moment";
+import datePicker from "@/components/datePicker";
 
 const columns = [
   {
@@ -260,15 +224,16 @@ export default {
   components: {
     StandardTable,
     tree,
+    datePicker,
   },
   //   mixins: [mixin],
   data() {
     return {
       formState: {
         dateType: undefined,
-        time: [moment().format("YYYY-MM-DD"), moment().format("YYYY-MM-DD")],
-        createtimeStart: moment().format("YYYY-MM-DD"),
-        createtimeEnd: moment().format("YYYY-MM-DD"),
+        // time: [moment().format("YYYY-MM-DD"), moment().format("YYYY-MM-DD")],
+        // createtimeStart: moment().format("YYYY-MM-DD"),
+        // createtimeEnd: moment().format("YYYY-MM-DD"),
         userName: "",
         userId: "",
         treeUserId: "",
@@ -307,6 +272,11 @@ export default {
     // }, 1000);
   },
   methods: {
+    timeChange(val) {
+      // console.log(val);
+      this.formState = { ...val };
+      this.getList();
+    },
     chooseUser(val) {
       this.formState.treeUserId = val;
       this.getVerification();