组件更新

src/views/put/put-ad-plan.vue

@@ -36,42 +36,46 @@
 
       <template v-if="!!showDropDownBox">
         <div class="tool-bar-item">
-          <p class="label">推广员</p>
-          <!-- <a-select
-            mode="multiple"
-            v-model:value="uids"
-            placeholder="请选择推广员"
+          <p class="label">推广组</p>
+          <a-select
+            v-model:value="groupuids"
+            placeholder="请选择组"
             style="width: 300px"
+            @change="groupChange"
           >
             <a-select-option
-              v-for="user in available_uids"
-              :key="user.id"
-              :value="user.id"
+              v-for="(user, index) in filter_users"
+              :key="user.group_name"
+              :value="user.group_id"
             >
-              {{ user.nickname }}
+              {{ user.group_name }}
+
+              <div style="display:inline-block;float:right">
+                是否全选
+                <a-checkbox
+                  v-model:checked="isCheckoutAll[index]"
+                  @change.native="getCheckoutChange(index, isCheckoutAll)"
+                ></a-checkbox>
+              </div>
             </a-select-option>
-          </a-select> -->
-          <!-- {{ filter_users }} -->
-          <a-cascader
-            v-model:value="getuids"
-            style="width: 100%"
-            mode="multiple"
-            max-tag-count="responsive"
-            :options="options"
-            placeholder="请选择推广员"
-            @change="getPromoteUser"
-            :allowClear="false"
-          ></a-cascader>
+          </a-select>
         </div>
         <div class="tool-bar-item">
+          <p class="label">推广员</p>
           <a-select
-            v-model:value="uidslabel"
-            mode="tags"
-            style="width: 100%"
-            placeholder="推广员"
+            mode="multiple"
+            v-model:value="uids"
+            placeholder="请选择推广员"
+            style="width: 300px"
             allowClear
-            @change="delItems"
           >
+            <a-select-option
+              v-for="user in filter_user_item"
+              :key="user.uid"
+              :value="user.uid"
+            >
+              {{ user.nickname }}
+            </a-select-option>
           </a-select>
         </div>
       </template>
@@ -401,7 +405,7 @@ import {
 import { ADPlanItem, PageOptions, PlanBack } from "#/api";
 import useAuthUser from "@/hooks/composable/useAuthUser";
 import ARow from "ant-design-vue/lib/grid/Row";
-import { any } from "vue-types";
+import { any, arrayOf } from "vue-types";
 const PutAdPlan = defineComponent({
   components: {
     ToolBar,
@@ -488,35 +492,40 @@ const PutAdPlan = defineComponent({
       uids: ref<number[]>([]),
       options: ref<any>([]),
       filter_users: ref<any>([]),
-      getuids: ref<number[]>([]),
-      uidslabel: ref<string[]>([]),
-      uidslabelCurrent: ref<any>([]),
+      groupuids: ref<number>(),
+      filter_user_item: ref<any>([]),
+      checkAllFlag: [],
+      isCheckoutAll: [],
     });
+    const groupChange = (val: any) => {
+      state.isCheckoutAll = [];
+      state.groupuids = val;
+      state.filter_users.map((item: any) => {
+        if (item.group_id == val) {
+          state.filter_user_item = item.users;
+        }
+      });
+      state.uids = unique(state.uids) as any;
+    };
+    const getCheckoutChange = (index: any, ischeckList: any) => {
+      state.checkAllFlag = ischeckList;
+      if (state.checkAllFlag[index]) {
+        state.checkAllFlag.map((item: any) => {
+          if (item) {
+            state.filter_user_item.map((item: any) => {
+              state.uids.push(item.uid);
+            });
+          }
+        });
+      }
+      state.uids = unique(state.uids) as any;
+      state.checkAllFlag = [];
+    };
     const groupHandle = () => {
       getAuthorUser().then((res) => {
         state.filter_users = res.data.filter_users;
-        let arr = [] as any;
-        state.filter_users.map((item: any, useIndex: any) => {
-          arr.push({
-            value: item.group_id,
-            label: item.group_name,
-            children: [],
-          });
-          arr.map((a: any, index: any) => {
-            item.users.forEach((i: any, indexi: any) => {
-              if (index == useIndex) {
-                a.children.push({
-                  value: i.uid,
-                  label: i.nickname,
-                });
-              }
-            });
-          });
-        });
-        state.options = arr;
       });
     };
-
     groupHandle();
     if (
       route.query &&
@@ -570,7 +579,13 @@ const PutAdPlan = defineComponent({
         state.inSearching = false;
       }
     };
-
+    const unique = (arr: any) => {
+      if (!Array.isArray(arr)) {
+        console.log("type error!");
+        return;
+      }
+      return Array.from(new Set(arr));
+    };
     const switchDate = (date: any, dateString: any[]) => {
       if (Array.isArray(dateString) && dateString.join("")) {
         store.commit(MutationType.setSelectTime, dateString);
@@ -604,6 +619,7 @@ const PutAdPlan = defineComponent({
           uids: state.uids.toString(),
         }
       );
+
       const { data } = await getADPlanlist(datas);
       const { data: taotals } = await getadDataSum(datas);
       let newList: any[] = data.list.map((item) => {
@@ -743,38 +759,31 @@ const PutAdPlan = defineComponent({
         width: 230,
       });
     });
-    const getPromoteUser = (val: any, selectedOptions: any) => {
-      if (val) {
-        state.uids.push(val.slice(-1));
-        state.uidslabelCurrent.push(selectedOptions[1]);
-        state.uidslabel.push(selectedOptions[1].label);
-      }
-      console.log(state.uids, "state.uids");
-    };
+    // const getPromoteUser = (val: any, selectedOptions: any) => {
+    //   if (val) {
+    //     state.uids.push(val.slice(-1));
+    //     state.uidslabelCurrent.push(selectedOptions[1]);
+    //     state.uidslabel.push(selectedOptions[1].label);
+    //   }
+    //   console.log(state.uids, "state.uids");
+    // };
     //删除监听
-    const delItems = (value: any) => {
-      if (!value[0]) {
-        state.uids = [];
-      }
-      let arr = [] as any;
-      state.uidslabelCurrent.map((item: any) =>
-        value.map((i: any) => {
-          if (i == item.label) {
-            console.log(item.value);
-            arr.push(item.value);
-          }
-        })
-      );
-      state.uids = unique(arr) as any;
-    };
+    // const delItems = (value: any) => {
+    //   if (!value[0]) {
+    //     state.uids = [];
+    //   }
+    //   let arr = [] as any;
+    //   state.uidslabelCurrent.map((item: any) =>
+    //     value.map((i: any) => {
+    //       if (i == item.label) {
+    //         console.log(item.value);
+    //         arr.push(item.value);
+    //       }
+    //     })
+    //   );
+    //   state.uids = unique(arr) as any;
+    // };
     //去重
-    const unique = (arr: any) => {
-      if (!Array.isArray(arr)) {
-        console.log("type error!");
-        return;
-      }
-      return Array.from(new Set(arr));
-    };
 
     const setSateSwitch = (val: string, name: string) => {
       state.cost_order = 0;
@@ -834,8 +843,8 @@ const PutAdPlan = defineComponent({
       handleTableChange,
       onSearch,
       switchDate,
-      getPromoteUser,
-      delItems,
+      getCheckoutChange,
+      groupChange,
     };
   },
   mounted() {