Przeglądaj źródła

今正总后台新增
-自动打标签
-开启视频资源批量上传缩小悬浮窗功能

lk 1 dzień temu
rodzic
commit
dc9fc7344d

+ 7 - 0
src/api/company/companySmsTemp.js

@@ -58,4 +58,11 @@ export function audit(data) {
     method: 'post',
     data: data
   })
+}
+export function getSmsTempList(query) {
+  return request({
+    url: '/company/companySmsTemp/getSmsTempList',
+    method: 'get',
+    params: query
+  })
 }

+ 7 - 1
src/api/crm/customer.js

@@ -46,7 +46,13 @@ export function updateCustomerSource(data) {
   })
 }
 
-
+export function getCustomerDetails(query) {
+  return request({
+    url: '/crm/customer/getCustomerDetails/',
+    method: 'get',
+    params: query
+  })
+}
 
 // 删除客户
 export function delLineCustomer(customerId) {

+ 53 - 0
src/api/qw/autoTags.js

@@ -0,0 +1,53 @@
+import request from '@/utils/request'
+
+// 查询自动打标签主列表
+export function listTags(query) {
+  return request({
+    url: '/qw/autoTags/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询自动打标签主详细
+export function getTags(id) {
+  return request({
+    url: '/qw/autoTags/' + id,
+    method: 'get'
+  })
+}
+
+// 新增自动打标签主
+export function addTags(data) {
+  return request({
+    url: '/qw/autoTags',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改自动打标签主
+export function updateTags(data) {
+  return request({
+    url: '/qw/autoTags',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除自动打标签主
+export function delTags(id) {
+  return request({
+    url: '/qw/autoTags/' + id,
+    method: 'delete'
+  })
+}
+
+// 导出自动打标签主
+export function exportTags(query) {
+  return request({
+    url: '/qw/autoTags/export',
+    method: 'get',
+    params: query
+  })
+}

+ 53 - 0
src/api/qw/autoTagsLogs.js

@@ -0,0 +1,53 @@
+import request from '@/utils/request'
+
+// 查询自动打标签的日志列表
+export function listAutoTagsLogs(query) {
+  return request({
+    url: '/qw/autoTagsLogs/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询自动打标签的日志详细
+export function getAutoTagsLogs(id) {
+  return request({
+    url: '/qw/autoTagsLogs/' + id,
+    method: 'get'
+  })
+}
+
+// 新增自动打标签的日志
+export function addAutoTagsLogs(data) {
+  return request({
+    url: '/qw/autoTagsLogs',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改自动打标签的日志
+export function updateAutoTagsLogs(data) {
+  return request({
+    url: '/qw/autoTagsLogs',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除自动打标签的日志
+export function delAutoTagsLogs(id) {
+  return request({
+    url: '/qw/autoTagsLogs/' + id,
+    method: 'delete'
+  })
+}
+
+// 导出自动打标签的日志
+export function exportAutoTagsLogs(query) {
+  return request({
+    url: '/qw/autoTagsLogs/export',
+    method: 'get',
+    params: query
+  })
+}

+ 93 - 0
src/api/qw/groupMsg.js

@@ -0,0 +1,93 @@
+import request from '@/utils/request'
+
+// 查询客户群发记录主列表
+export function listGroupMsg(query) {
+  return request({
+    url: '/qw/groupMsg/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询客户群发记录主详细
+export function getGroupMsg(id) {
+  return request({
+    url: '/qw/groupMsg/' + id,
+    method: 'get'
+  })
+}
+
+
+// 新增客户群发记录主
+export function addGroupMsg(data) {
+  return request({
+    url: '/qw/groupMsg',
+    method: 'post',
+    data: data
+  })
+}
+
+/** 统计数据详情,已发送,未发送,已接收,未接收等 */
+export function countGroupMsgUser(groupMsgId){
+  return request({
+    url: '/qw/groupMsg/getCountGroupMsgUser/' + groupMsgId,
+    method: 'get'
+  })
+}
+
+
+/** 统计数据详情,已发送群主,送达群聊,未发送群主,未送达群聊等 */
+export function CountGroupMsgBaseUser(groupMsgId){
+  return request({
+    url: '/qw/groupMsg/getCountGroupMsgBaseUser/' + groupMsgId,
+    method: 'get'
+  })
+}
+
+
+/** 客户群发 发送/接收的数据详情 */
+export function CountGroupMsgUserDetails(query){
+  return request({
+    url: '/qw/groupMsg/getCountGroupMsgUserDetails',
+    method: 'get',
+    params: query
+  })
+}
+
+
+
+/** 提醒成员群发 */
+
+export function remindGroupMsg(query){
+  return request({
+    url: '/qw/groupMsg/remindGroupMsg',
+    method: 'get',
+    params: query
+  })
+}
+
+// 修改客户群发记录主
+export function updateGroupMsg(data) {
+  return request({
+    url: '/qw/groupMsg',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除客户群发记录主
+export function delGroupMsg(id) {
+  return request({
+    url: '/qw/groupMsg/' + id,
+    method: 'delete'
+  })
+}
+
+// 导出客户群发记录主
+export function exportGroupMsg(query) {
+  return request({
+    url: '/qw/groupMsg/export',
+    method: 'get',
+    params: query
+  })
+}

+ 71 - 0
src/api/qw/groupMsgUser.js

@@ -0,0 +1,71 @@
+import request from '@/utils/request'
+
+// 查询群发成员发送任务及执行结果反馈记录列表
+export function listGroupMsgUser(query) {
+  return request({
+    url: '/qw/groupMsgUser/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询群发成员发送任务及执行结果反馈记录详细
+export function getGroupMsgUser(id) {
+  return request({
+    url: '/qw/groupMsgUser/' + id,
+    method: 'get'
+  })
+}
+
+// 新增群发成员发送任务及执行结果反馈记录
+export function addGroupMsgUser(data) {
+  return request({
+    url: '/qw/groupMsgUser',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改群发成员发送任务及执行结果反馈记录
+export function updateGroupMsgUser(data) {
+  return request({
+    url: '/qw/groupMsgUser',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除群发成员发送任务及执行结果反馈记录
+export function delGroupMsgUser(id) {
+  return request({
+    url: '/qw/groupMsgUser/' + id,
+    method: 'delete'
+  })
+}
+
+// 导出群发成员发送任务及执行结果反馈记录
+export function exportGroupMsgUser(query) {
+  return request({
+    url: '/qw/groupMsgUser/export',
+    method: 'get',
+    params: query
+  })
+}
+
+/** 刷新/同步 客户群群发 结果 */
+export function refreshResultsGroupMsgUser(data){
+  return request({
+    url: '/qw/groupMsgUser/refreshResultsGroupMsgUser',
+    method: 'post',
+    data: data
+  })
+}
+
+/** 刷新/同步 客户群发 结果 */
+export function refreshResultsMsgUser(data){
+  return request({
+    url: '/qw/groupMsgUser/refreshResultsMsgUser',
+    method: 'post',
+    data: data
+  })
+}

+ 15 - 0
src/api/qw/tagGroup.js

@@ -73,3 +73,18 @@ export function exportTagGroup(query) {
     params: query
   })
 }
+// 查询企微客户标签列表
+export function listTag(query) {
+  return request({
+    url: '/qw/tag/list',
+    method: 'get',
+    params: query
+  })
+}
+export function searchTags(data) {
+  return request({
+    url: '/qw/tag/searchTags',
+    method: 'post',
+    data: data
+  })
+}

+ 6 - 0
src/api/qw/user.js

@@ -66,6 +66,12 @@ export function getMyQwCompanyListAll() {
     method: 'get'
   })
 }
+export function getCompanyListByCorpId(id) {
+  return request({
+    url: '/company/companyUser/getCompanyList/'+id,
+    method: 'get'
+  })
+}
 
 
 

+ 2 - 2
src/views/course/videoResource/index.vue

@@ -389,7 +389,7 @@
       </div>
     </el-dialog>
     <!-- 批量选择视频弹窗 -->
-    <el-dialog :title="'选择视频'" :visible.sync="batchAddVisible" width="1200px" append-to-body class="batch-dialog"
+    <minimizable-dialog :title="'选择视频'" :visible.sync="batchAddVisible" width="1200px" append-to-body class="batch-dialog"
       :close-on-click-modal="false" :before-close="cancelBeforeBatch" @minimize="hasMinimizableDialog = true"
       @restore="hasMinimizableDialog = false">
       <div class="filter-container">
@@ -650,7 +650,7 @@
         </div>
       </el-dialog>
 
-    </el-dialog>
+    </minimizable-dialog>
 
     <!-- 项目选择弹窗 -->
     <el-dialog

+ 74 - 0
src/views/crm/components/addRemark.vue

@@ -0,0 +1,74 @@
+<template>
+    <div>
+            <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+                <el-form-item label="备注" prop="remark">
+                    <el-input :rows="2" v-model="form.remark" type="textarea" placeholder="请输入内容" />
+                </el-form-item>
+            </el-form>
+            <div  class="footer">
+                <el-button type="primary" @click="submitForm">确 定</el-button>
+            </div>
+    </div>
+</template>
+  
+<script>
+    import { updateCustomer  } from "@/api/crm/customer";
+    export default {
+        name: "remark",
+        data() {
+            return {
+                form: {
+                    customerId:null,
+                    remark:null,
+                 
+                },
+                // 表单校验
+                rules: {
+                    remark: [
+                        { required: true, message: "备注不能为空", trigger: "change" }
+                    ],
+         
+                }
+                 
+            };
+        },
+        created() {
+        },
+        methods: {
+            reset(customer) {
+                this.form.customerId=customer.customerId;
+                this.form.remark=customer.remark;
+            },
+            submitForm() {
+                this.$refs["form"].validate(valid => {
+                    if (valid) {
+                        updateCustomer(this.form).then(response => {
+                            if (response.code === 200) {
+                                this.msgSuccess("操作成功");
+                                
+                                this.$emit('close');
+                            }
+                        });
+                    }
+                });
+            },
+        }
+    };
+</script>
+<style lang="scss" scoped>
+.contents{
+    height: 100%;
+    background-color: #fff;
+    padding: 20px;
+        
+}
+.footer{
+    display: flex;
+    align-items: center;
+    justify-content: flex-end;
+}
+</style>
+
+
+
+ 

+ 143 - 0
src/views/crm/components/addTag.vue

@@ -0,0 +1,143 @@
+<template>
+    <div>
+            <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+                <el-form-item label="标签库" >
+                    <el-select @change="tagChange" v-model="tag" placeholder="请选择" clearable size="small">
+                        <el-option
+                                v-for="item in tagsOptions"
+                                :key="item.dictValue"
+                                :label="item.dictLabel"
+                                :value="item.dictValue"
+                            />
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="标签" prop="tags">
+                    <el-tag
+                        :key="tag"
+                        v-for="tag in tags"
+                        closable
+                        :disable-transitions="false"
+                        @close="handleClose(tag)">
+                        {{tag}}
+                    </el-tag>
+                    <el-input
+                        class="input-new-tag"
+                        v-if="inputVisible"
+                        v-model="inputValue"
+                        ref="saveTagInput"
+                        size="small"
+                        @keyup.enter.native="handleInputConfirm"
+                        @blur="handleInputConfirm"
+                    >
+                    </el-input>
+                    <el-button v-else class="button-new-tag" size="small" @click="showInput">添加标签+</el-button>
+                </el-form-item>
+            </el-form>
+            <div  class="footer">
+                <el-button type="primary" @click="submitForm">确 定</el-button>
+            </div>
+    </div>
+</template>
+  
+<script>
+    import { updateCustomer  } from "@/api/crm/customer";
+    export default {
+        name: "visit",
+        data() {
+            return {
+                tag:null,
+                tagsOptions:[],
+                inputVisible: false,
+                inputValue: '',
+                tags:[],
+                form: {
+                    customerId:null,
+                    tags:null,
+                 
+                },
+                // 表单校验
+                rules: {
+                    tags: [
+                        { required: true, message: "标签不能为空", trigger: "change" }
+                    ],
+         
+                }
+                 
+            };
+        },
+        created() {
+            this.getDicts("crm_customer_tag").then((response) => {
+                this.tagsOptions = response.data;
+            });
+            
+            
+        },
+        methods: {
+            tagChange(e){
+                console.log(e)
+                var v=this.tagsOptions.find(value=>value.dictValue==e);
+                console.log(v)
+                this.tags.push(v.dictLabel);
+                this.form.tags=this.tags.toString();
+
+            },
+            reset(customer) {
+                this.tags= [];
+                this.form.customerId=customer.customerId;
+                this.form.tags=customer.tags;
+                if(this.form.tags!=null){
+                    this.tags=this.form.tags.split(",")
+                }
+            },
+            handleClose(tag) {
+                this.tags.splice(this.tags.indexOf(tag), 1);
+                this.form.tags=this.tags.toString();
+            },
+            showInput() {
+                this.inputVisible = true;
+                this.$nextTick(_ => {
+                    this.$refs.saveTagInput.focus();
+                });
+            },
+            handleInputConfirm() {
+                let inputValue = this.inputValue;
+                if (inputValue) {
+                    this.tags.push(inputValue);
+                }
+                this.inputVisible = false;
+                this.inputValue = '';
+                this.form.tags=this.tags.toString();
+            },
+            submitForm() {
+                this.$refs["form"].validate(valid => {
+                    if (valid) {
+                        updateCustomer(this.form).then(response => {
+                            if (response.code === 200) {
+                                this.msgSuccess("操作成功");
+                                
+                                this.$emit('close');
+                            }
+                        });
+                    }
+                });
+            },
+        }
+    };
+</script>
+<style lang="scss" scoped>
+.contents{
+    height: 100%;
+    background-color: #fff;
+    padding: 20px;
+        
+}
+.footer{
+    display: flex;
+    align-items: center;
+    justify-content: flex-end;
+}
+</style>
+
+
+
+ 

+ 1121 - 0
src/views/qw/autoTags/dayPartingIndex.vue

@@ -0,0 +1,1121 @@
+<template>
+  <div>
+    <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="100px">
+      <el-form-item label="企微公司" prop="corpId">
+        <el-select v-model="queryParams.corpId" placeholder="企微公司" size="small" @change="updateCorpId()">
+          <el-option
+            v-for="dict in myQwCompanyList"
+            :key="dict.dictValue"
+            :label="dict.dictLabel"
+            :value="dict.dictValue"
+          />
+        </el-select>
+      </el-form-item>
+      <!-- <el-form-item label="公司" prop="companyId">
+          <el-select v-model="queryParams.companyId" placeholder="公司"  size="small" @change="updateCompanyId()">
+            <el-option
+              v-for="dict in myCompanyList"
+              :key="dict.companyId"
+              :label="dict.companyName"
+              :value="dict.companyId"
+            />
+          </el-select>
+      </el-form-item> -->
+      <el-form-item label="规则名称:" prop="ruleName">
+        <el-input
+          v-model="queryParams.ruleName"
+          placeholder="请输入规则名称"
+          clearable
+          size="small"
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="生效成员:" prop="appleUserOne">
+        <el-select v-model="queryParams.appleUserOne" filterable clearable placeholder="选择成员" size="small">
+          <el-option
+            v-for="dict in userList"
+            :key="dict.id"
+            :label="dict.qwUserName"
+            :value="dict.id"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">刷新/重置</el-button>
+        <el-button
+          type="primary"
+          size="mini"
+          plain
+          icon="el-icon-plus"
+          @click="handleAdd"
+          v-hasPermi="['qw:autoTags:add']"
+        >添加规则</el-button>
+      </el-form-item>
+
+    </el-form>
+    <!--      <div style="padding:0 0 15px 0">-->
+    <!--        <el-button-->
+    <!--          type="primary"-->
+    <!--          size="small"-->
+    <!--          plain-->
+    <!--          icon="el-icon-plus"-->
+    <!--          @click="handleAdd"-->
+    <!--          v-hasPermi="['shop:tags:add']"-->
+    <!--        >添加规则</el-button>-->
+    <!--      </div>-->
+    <el-table v-loading="loading" :data="dayPartingIndexList" border height="550px" >
+      <el-table-column label="规则名称" align="center" prop="ruleName" />
+      <el-table-column label="已打标签总数" align="center" prop="totalNumTagsCount" />
+      <el-table-column label="生效成员" align="center">
+        <template slot-scope="scope">
+               <span v-for="userId in JSON.parse(scope.row.applyUsers)" :key="userId" style="display: inline;width: 300px">
+                <el-tag :disable-transitions="false"  v-for="list in userList" :key="list.id" style="margin: 3px;" v-if="list.id==userId">{{list.qwUserName}}({{list.nickName}})</el-tag>
+              </span>
+        </template>
+      </el-table-column>
+      <el-table-column label="添加的标签" align="center" prop="tagIdsName">
+        <template slot-scope="scope">
+          <div class="tag-container">
+            <div class="tag-list">
+              <div v-for="name in scope.row.tagIdsName" style="display: inline;">
+                <el-tag type="success">{{ name }}</el-tag>
+              </div>
+            </div>
+          </div>
+        </template>
+      </el-table-column>
+      <el-table-column label="创建时间" align="center" prop="createTime" />
+      <el-table-column label="规则状态" align="center" prop="isApply">
+        <template slot-scope="scope">
+          <el-switch
+            v-model="scope.row.isApply"
+            active-color="#13ce66"
+            inactive-color="#ff4949"
+            active-value="1"
+            inactive-value="2"
+            @change="switchChange(scope.row)">
+          </el-switch>
+          <span v-if="scope.row.isApply == '1'" style="margin-left: 10px;color: #13ce66">已启用</span>
+          <span v-if="scope.row.isApply == '2'" style="margin-left: 10px;color: #ff4949">已关闭</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+        <template slot-scope="scope">
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['qw:autoTags:edit']"
+          >修改成员</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleDetails(scope.row)"
+            v-hasPermi="['qw:autoTags:query']"
+          >详情</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['qw:autoTags:remove']"
+          >删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改自动打标签主对话框 -->
+    <el-dialog :title="title" :visible.sync="open" width="1000px" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-position="left"  label-width="120px">
+        <div class="app-container">
+          <div>
+            <span style="font-size: 15px">规则基础信息</span>
+            <el-divider></el-divider>
+          </div>
+          <el-alert
+            title="根据规则,当客户在设定时间段内成为企业微信客户,将自动被打上标签"
+            type="warning"
+            style="font-size: 15px;margin-bottom: 2%;"
+            :closable="false"
+            show-icon>
+          </el-alert>
+          <el-form-item label="规则名称:" prop="ruleName" style="width: 400px">
+            <el-input v-model="form.ruleName" placeholder="请输入规则名称(内部可见)" />
+          </el-form-item>
+
+          <el-form-item label="生效成员:" prop="applyUsers">
+            <div>
+              <el-button
+                size="medium"
+                icon="el-icon-circle-plus-outline"
+                plain
+                @click="handlelistUser">请选择使用成员</el-button>
+            </div>
+            <div>
+              <el-tag
+                style="margin-left: 5px"
+                size="medium"
+                :key="list.id"
+                v-for="list in userSelectList"
+                closable
+                :disable-transitions="false"
+                @close="handleClosegroupUser(list)">
+                {{list.qwUserName}}({{list.nickName}})
+              </el-tag>
+            </div>
+          </el-form-item>
+          <div style="margin-top: 5%">
+            <span style="font-size: 15px">设置打标签的规则</span>
+            <el-divider></el-divider>
+          </div>
+
+          <div  v-for="(item, index) in form.rulesTags"    :key="index" >
+            <div style="background-color: #fbfbfb;padding: 10px;  border: 1px solid #e6e6e6; margin-bottom: 10px;">
+              <el-form ref="rulesTagsFrom" :rules="rulesTagsRules" :model="item" >
+                <div>
+                  <el-form-item label="执行规则" prop="dayOrWeek" style="width: 500px;margin:5px 0 0 8%">
+                    <el-radio-group v-model="item.dayOrWeek">
+                      <el-radio :label="0">星期</el-radio>
+                      <el-radio :label="1">日期</el-radio>
+                    </el-radio-group>
+                  </el-form-item>
+                  <div style="display: flex; align-items: center; flex-wrap: nowrap;">
+                    <span style="margin-right: 10px;">规则 {{ index + 1 }}:</span>
+                    <el-form-item label="为每:" prop="week" style="flex: 8;margin-bottom: 0" v-if="item.dayOrWeek == 0">
+                      <el-select v-model="item.week" remote multiple placeholder="请选择时间" filterable style="width: 350px;">
+                        <el-option v-for="dict in weekOptions" :key="dict.value" :label="dict.label" :value="dict.value"></el-option>
+                      </el-select>
+                    </el-form-item>
+                    <el-form-item label="为每:" prop="days" style="flex: 8;margin-bottom: 0" v-if="item.dayOrWeek == 1">
+                      <el-date-picker
+                        clearable size="small"
+                        v-model="item.days"
+                        type="daterange"
+                        value-format="yyyy-MM-dd"
+                        start-placeholder="开始日期"
+                        end-placeholder="结束日期">
+                      </el-date-picker>
+                    </el-form-item>
+                    <el-form-item prop="startTime" style="margin:0 5px 0 5px">
+                      <el-time-select style="width: 120px;" placeholder="起始时间" v-model="item.startTime" :picker-options="{
+                              start: '00:00',
+                              step: '00:15',
+                              end: '24:00'
+                            }"></el-time-select>
+                    </el-form-item>
+                    <el-form-item prop="endTime" style="margin:0 5px 0 5px">
+                      <el-time-select style="width: 120px;" placeholder="结束时间" v-model="item.endTime" :picker-options="{
+                              start: '00:00',
+                              step: '00:15',
+                              end: '24:00',
+                              minTime: item.startTime
+                            }"></el-time-select>
+                    </el-form-item>
+                    <div style="display: flex; align-items: center;width: 100px">
+                      <span>添加的客户</span>
+                    </div>
+                  </div>
+
+                  <el-form-item prop="tags" style="width: 500px;margin:5px 0 0 8%">
+                    <div style="display: flex; align-items: center;">
+                      <div style="width: 50px">
+                        <span>打上</span>
+                      </div>
+                      <div @click="handleChangeTags(item,index)" style="cursor: pointer; border: 1px solid #e6e6e6; background-color: white; overflow: hidden; flex-grow: 1;width: 390px">
+                        <div style="min-height: 35px; max-height: 200px; overflow-y: auto;">
+                          <el-tag type="success"
+                                  closable
+                                  :disable-transitions="false"
+                                  v-for="list in tagListFormIndex[index]"
+                                  :key="list.tagId"
+                                  @close="handleCloseTag(list,index)"
+                                  style="margin: 3px;"
+                          >{{list.name}}
+                          </el-tag>
+                        </div>
+                      </div>
+                      <div style="width: 70px">
+                        <span style="margin:0px 10px;">的标签</span>
+                      </div>
+                    </div>
+                  </el-form-item>
+
+                  <el-form-item prop="remark" style="width: 500px;margin:5px 0 0 8%">
+                    <div style="display: flex; align-items: center;margin-top: 1%">
+                      <div style="width: 50px">
+                        <span>并备注</span>
+                      </div>
+                      <el-input v-model="item.remarks" style="width: 300px" placeholder="请输入备注(选填)"></el-input>
+                      <div style="width: 70px">
+                        <el-link v-if="form.rulesTags.length>1" icon="el-icon-delete-solid" @click="delItemList(index)" type="text" style="color: rgb(24, 144, 255);margin-left:10px;height: 40px " ></el-link>
+                      </div>
+                    </div>
+                  </el-form-item>
+                  <el-form-item label="备注日期"   prop="isDay" style="width: 500px;margin:5px 0 0 8%">
+                    <el-switch
+                      v-model="item.isDay"
+                      :active-value="1"
+                      :inactive-value="0"
+                    >
+                    </el-switch>
+                  </el-form-item>
+                </div>
+              </el-form>
+            </div>
+          </div>
+          <div>
+            <el-link type="primary" class="el-icon-plus" :underline="false" @click='addItemList()'>添加其他时段规则(最多7条)</el-link>
+          </div>
+        </div>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
+
+
+    <!-- 选择成员账号弹窗   -->
+    <el-dialog :title="listUser.title" :visible.sync="listUser.open" width="1600px" append-to-body>
+      <qwUserList ref="QwUserList" @selectUserList="selectUserList"></qwUserList>
+    </el-dialog>
+    <!-- 选择成员账号弹窗修改   -->
+    <el-dialog :title="listUserUpdate.title" :visible.sync="listUserUpdate.open" width="1600px" append-to-body>
+      <qwUserList ref="QwUserList" @selectUserList="selectUserListUpdate"></qwUserList>
+    </el-dialog>
+
+    <el-dialog title="添加标签" :visible.sync="tagChange.open" width="800px" append-to-body>
+      <div>搜索标签:
+        <el-input v-model="queryTagParams.name" placeholder="请输入标签名称" clearable size="small" style="width: 200px;margin-right: 10px" />
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleSearchTags">搜索</el-button>
+        <el-button type="primary" icon="el-icon-plus" size="mini" @click="cancelSearchTags">重置</el-button>
+      </div>
+      <div v-for="item in tagGroupList" :key="item.id" >
+        <div style="font-size: 20px;margin-top: 20px;margin-bottom: 20px;">
+          <span class="name-background">{{ item.name }}</span>
+        </div>
+        <!-- 添加外层滚动容器 -->
+        <div class="scroll-wrapper">
+          <div class="tag-container">
+            <a
+              v-for="tagItem in item.tag"
+              class="tag-box"
+              @click="tagSelection(tagItem)"
+              :class="{ 'tag-selected': tagItem.isSelected }"
+            >
+              {{ tagItem.name }}
+            </a>
+          </div>
+        </div>
+      </div>
+      <pagination
+        v-show="tagTotal>0"
+        :total="tagTotal"
+        :page.sync="queryTagParams.pageNum"
+        :limit.sync="queryTagParams.pageSize"
+        @pagination="getPageListTagGroup"
+      />
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="addTagSubmitForm(tagChange.index)">确 定</el-button>
+        <el-button @click="addTagCancel(tagChange.index)">重 置</el-button>
+      </div>
+    </el-dialog>
+
+    <!-- 分时段详   -->
+    <el-drawer :title="detailFrom.title" :visible.sync="detailFrom.open" size="75%" style="font-weight: bolder">
+      <dayPartingIndexDetails :groupIndexFrom="detailListFrom"></dayPartingIndexDetails>
+    </el-drawer>
+
+    <!-- 单独修改员工标签   -->
+    <el-dialog :title="updateUserOpen.title" :visible.sync="updateUserOpen.open" width="500px" append-to-body>
+      <el-form ref="form" :model="form" label-width="100px">
+        <el-form-item label="选择员工" prop="qwUserIds" style="margin-top: 2%">
+          <div>
+            <el-button
+              size="medium"
+              icon="el-icon-circle-plus-outline"
+              plain
+              @click="handlelistUserUpdate">请选择使用成员</el-button>
+          </div>
+          <div>
+            <el-tag
+              style="margin-left: 5px"
+              size="medium"
+              :key="id"
+              v-for="id in updateUserOpen.applyUsersUpdate"
+              closable
+              :disable-transitions="false"
+              @close="handleClosegroupUserUpdate(id)">
+              <span v-for="list in userList" :key="list.qwUserId" v-if="list.id==id">{{list.qwUserName}}({{list.nickName}})</span>
+            </el-tag>
+          </div>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer" >
+        <el-button  type="primary" @click="submitUpdateAutoTags">确 定</el-button>
+        <el-button  @click="cancelAutoTags">取 消</el-button>
+      </div>
+    </el-dialog>
+
+
+  </div>
+</template>
+
+<script>
+import { listTags,delTags, addTags, updateTags } from "../../../api/qw/autoTags";
+import qwUserList from '@/views/qw/user/qwUserList.vue'
+import {listTag, searchTags} from '@/api/qw/tag'
+import dayPartingIndexDetails from '@/views/qw/autoTags/dayPartingIndexDetails.vue'
+import { allListTagGroup } from '@/api/qw/tagGroup'
+import { listUser } from '@/api/qw/user'
+import { getMyQwUserList,getMyQwCompanyListAll } from "../../../api/qw/user";
+export default {
+  name: "autoTags",
+  components: { dayPartingIndexDetails, qwUserList },
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 导出遮罩层
+      exportLoading: false,
+      activeName:'2',
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      tagTotal:0,
+      // 自动打标签主表格数据
+      dayPartingIndexList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      myQwCompanyList:[],
+      //所有的标签组-标签
+      tagGroupList:[],
+
+      //所有标签
+      tagList:[],
+
+      //选择的标签
+      tagListFormIndex:[],
+
+      //成员信息
+      userList:[],
+
+      //标签弹窗选择
+      tagChange:{
+        open:false,
+        index:null,
+      },
+
+      queryTagParams: {
+        pageNum: 1,
+        pageSize: 5,
+        total:0,
+        name:null,
+        corpId:null,
+      },
+      //选择成员列表
+      listUser:{
+        title:"",
+        open:false
+      },
+
+      //选择成员列表 做修改
+      listUserUpdate:{
+        title:"",
+        open:false
+      },
+      //选择成员列表
+      userSelectList:[],
+
+      userSelectListUpdate:[],
+
+      //详情表单参数
+      detailListFrom:{},
+
+
+
+      //生效成员列表
+      updateUserOpen:{
+        title:"修改成员",
+        open:false,
+        id:null,
+        applyUsersUpdate:[],
+      },
+
+
+      //详情抽屉
+      detailFrom:{
+        open:false,
+        title:'',
+      },
+
+      weekOptions: [{
+        value: 1,
+        label: '星期一'
+      }, {
+        value: 2,
+        label: '星期二'
+      }, {
+        value: 3,
+        label: '星期三'
+      }, {
+        value: 4,
+        label: '星期四'
+      }, {
+        value: 5,
+        label: '星期五'
+      }
+        , {
+          value: 6,
+          label: '星期六'
+        }
+        , {
+          value: 7,
+          label: '星期天'
+        }],
+
+
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        type: 3,
+        createName: null,
+        applyUsers: null,
+        appleUserOne:null,
+        ruleName: null,
+        rulesTags: null,
+        totalNumTags: null,
+        numTagsTaday: null,
+        isApply: null,
+        corpId: null,
+        companyId: null
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+        ruleName:[{ required: true, message: "规则名称不能为空", trigger: "blur" }],
+        applyUsers:[{ required: true, message: "成员不能为空", trigger: "blur" }],
+      },
+
+      //规则验证
+      rulesTagsRules:{
+        week: [
+          { required: true, message: '请选择发起时间的星期', trigger: 'submit' }
+        ],
+        startTime: [
+          { required: true, message: '请选择开始时间', trigger: 'submit' },
+        ],
+        endTime: [
+          { required: true, message: '请选择结束时间', trigger: 'submit' },
+
+        ],
+        tags: [
+          { required: true, message: '标签不能为空', trigger: 'submit' }
+        ],
+
+      },
+      //根据企微查出来的公司列表
+      // myCompanyList:[],
+
+    };
+  },
+
+  watch:{
+    // 监听 userSelectList 的变化,并同步更新 form.userIdsSelectList
+    userSelectList(newList) {
+      this.form.applyUsers = newList.map(item => item.id);
+    },
+
+    userSelectListUpdate(newList){
+      this.updateUserOpen.applyUsersUpdate = [...newList]
+    },
+
+    tagListFormIndex: {
+      handler(newList) {
+        // 遍历 tagListFormIndex 并将 tagId 放入对应位置的 tags
+        newList.forEach((tags, index) => {
+          if (!this.form.rulesTags[index]) {
+            this.$set(this.form.rulesTags, index, {tags:[],week:[1,2,3,4,5,6,7],startTime:null,endTime:null,remarks:null,dayOrWeek:0,days:null});
+          }
+
+          // 确保清空原来的 tags 数组
+          this.form.rulesTags[index].tags = [];
+
+          tags.forEach(item => {
+            // 将 tagId 放入对应位置的 rulesTags 中的 tags 数组
+            this.form.rulesTags[index].tags.push(item.tagId);
+          });
+        });
+      },
+      deep: true
+    }
+  },
+  created() {
+
+    getMyQwCompanyListAll().then(response => {
+      this.myQwCompanyList = response.data;
+      if(this.myQwCompanyList!=null){
+        this.queryParams.corpId=this.myQwCompanyList[0].dictValue
+        this.afreshData(this.queryParams.corpId);
+        this.getList();
+      }
+      // this.myQwCompanyList = response.data;
+      //       if(this.myQwCompanyList!=null){
+      //         this.queryParams.corpId=this.myQwCompanyList[0].dictValue;
+      //         getCompanyListByCorpId(this.queryParams.corpId).them(response =>{
+      //           this.myCompanyList = response.data;
+      //         })
+      //         if(this.myCompanyList != null){
+      //           this.queryParams.companyId = this.myCompanyList[0].companyId
+      //           this.afreshData(this.queryParams.corpId)
+      //           this.getList();
+      //         }
+      //       }
+    });
+  },
+  methods: {
+    updateCorpId(){
+//       this.myCompanyList = [];
+// getCompanyListByCorpId(this.queryParams.corpId).them(response =>{
+//                 this.myCompanyList = response.data;
+//               })
+      this.afreshData(this.queryParams.corpId);
+
+      this.getList();
+    },
+    // updateCompanyId(){
+      
+    //   this.afreshData(this.queryParams.corpId)
+    //   this.getList();
+    //  },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset();
+      this.open = true;
+      this.title = "添加规则";
+
+      this.getPageListTagGroup()
+
+      //所有的标签
+      listTag(this.queryTagParams).then(response => {
+        this.tagList = response.rows;
+      });
+
+    },
+
+    /**
+     * 重新获取 部分数据
+     */
+    afreshData(value){
+
+      this.resetSearchQueryTag()
+      this.queryTagParams.corpId=value;
+
+      //所有的员工
+      listUser({corpId:value}).then(res=>{
+        this.userList=res.rows;
+      })
+
+    },
+
+    resetSearchQueryTag(){
+
+      this.queryTagParams= {
+        pageNum: 1,
+        pageSize: 5,
+        total:0,
+        name:null,
+      };
+    },
+
+    //选择群发的企业成员账号
+    handlelistUser(){
+      setTimeout(() => {
+        this.$refs.QwUserList.getDetails(this.queryParams.corpId);
+      }, 1);
+      this.listUser.title="选择企业成员"
+      this.listUser.open=true;
+    },
+
+    //选择群发的企业成员账号做修改
+    handlelistUserUpdate(){
+      setTimeout(() => {
+        this.$refs.QwUserList.getDetails(this.queryParams.corpId);
+      }, 1);
+      this.listUserUpdate.title="选择企业成员"
+      this.listUserUpdate.open=true;
+    },
+
+    //选择的成员账号列表
+    selectUserList(list){
+
+      this.listUser.open=false;
+      //用于显示
+      // this.userSelectList=list;
+
+      list.forEach(obj => {
+        if (!this.form.applyUsers.some(item => item == obj.id)) {
+          this.userSelectList.push(obj);
+        }
+      });
+
+    },
+    //选择的成员账号列表 修改
+    selectUserListUpdate(list){
+
+      this.listUserUpdate.open=false;
+
+      list.forEach(obj => {
+        if (!this.updateUserOpen.applyUsersUpdate.some(item => item == obj.id)) {
+          this.userSelectListUpdate.push(obj.id);
+        }
+      });
+
+    },
+
+    handleSearchTags(){
+
+      if (!this.queryTagParams.name){
+        return this.$message.error("请输入要搜索的标签")
+      }
+      this.queryTagParams.corpId=this.queryParams.corpId;
+      searchTags(this.queryTagParams).then(response => {
+        this.tagGroupList = response.rows;
+        this.tagTotal = response.total;
+      });
+
+    },
+
+    getPageListTagGroup(){
+
+      this.queryTagParams.corpId=this.queryParams.corpId;
+
+      allListTagGroup(this.queryTagParams).then(response => {
+        this.tagGroupList = response.rows;
+        this.tagTotal = response.total;
+      });
+    },
+
+
+
+    cancelSearchTags(){
+      this.afreshData(this.queryParams.corpId)
+    },
+    //删除一些选择了的账号
+    handleClosegroupUser(list){
+
+      // 假设 list 对象具有一个 id 属性
+      const index = this.userSelectList.findIndex(t => t.id === list.id);
+      if (index !== -1) {
+        this.userSelectList.splice(index, 1);
+      }
+    },
+
+    //删除一些选择的标签
+    handleClosegroupUserUpdate(id){
+
+      const index = this.userSelectListUpdate.findIndex(item => item === id)
+      if (index !== -1) {
+        this.userSelectListUpdate.splice(index, 1)
+      }
+    },
+
+    /** 查询自动打标签主列表 */
+    getList() {
+      this.loading = true;
+      listTags(this.queryParams).then(response => {
+
+        this.dayPartingIndexList = response.rows;
+        // this.dayPartingIndexList.forEach(item => {
+        //   const tagsSet = new Set(); // 为每个项目创建一个新的 Set
+        //   try {
+        //     const data = JSON.parse(item.rulesTags); // 将每个 rulesTags JSON 字符串解析为 JavaScript 对象
+        //     data.forEach(entry => {
+        //       entry.tags.forEach(tag => {
+        //         tagsSet.add(tag); // 将每个 tag 添加到 Set 中
+        //       });
+        //     });
+        //   } catch (error) {
+        //     this.$message.error("Error parsing JSON:",error)
+        //   }
+        //   item.tagsSet = Array.from(tagsSet); // 将 Set 转换为数组并添加到当前项目
+        // });
+
+        this.total = response.total;
+        this.loading = false;
+      });
+    },
+    //开关
+    switchChange(row){
+      updateTags(row).then(response => {
+        this.msgSuccess("修改成功");
+      });
+    },
+
+    //添加其他的规则
+    addItemList(){
+      if (this.form.rulesTags.length >=7) {
+        return this.$message.error('当前规则已达上限,无法添加规则');
+      }
+      this.form.rulesTags.push({tags:[],week:[1,2,3,4,5,6,7],startTime:null,endTime:null,remarks:null,dayOrWeek:0,days:null})
+    },
+
+    //选择标签弹窗
+    handleChangeTags(item,index){
+
+      for (let i = 0; i < this.tagGroupList.length; i++) {
+        for (let x = 0; x < this.tagGroupList[i].tag.length; x++) {
+          this.tagGroupList[i].tag[x].isSelected=false;
+        }
+      }
+
+      this.tagChange.open=true;
+      this.tagChange.index=index;
+
+    },
+
+    //标签的选择
+    tagSelection(row){
+      row.isSelected= !row.isSelected;
+      this.$forceUpdate();
+    },
+
+    //选择标签
+    addTagSubmitForm(index){
+
+      for (let i = 0; i < this.tagGroupList.length; i++) {
+        for (let x = 0; x < this.tagGroupList[i].tag.length; x++) {
+          if (this.tagGroupList[i].tag[x].isSelected === true) {
+            if (!this.tagListFormIndex[index]) {
+              this.$set(this.tagListFormIndex, index, []);
+            }
+
+            // 检查当前 tag 是否已经存在于 tagListFormIndex[index] 中
+            let tagExists = this.tagListFormIndex[index].some(
+              tag => tag.id === this.tagGroupList[i].tag[x].id
+            );
+
+            // 如果 tag 不存在于 tagListFormIndex[index] 中,则新增
+            if (!tagExists) {
+              this.tagListFormIndex[index].push(this.tagGroupList[i].tag[x]);
+            }
+          }
+        }
+      }
+      if (!this.tagListFormIndex[index] || this.tagListFormIndex[index].length === 0) {
+        return this.$message('请选择标签');
+      }
+
+      this.tagChange.open = false;
+    },
+    //取消选择标签
+    addTagCancel(index){
+      this.tagChange.open = false;
+      this.tagListFormIndex[index]=[];
+    },
+    //删除一些已经选择了的标签
+    handleCloseTag(list,index){
+
+      // 假设 list 对象具有一个 id 属性
+      const ls = this.tagListFormIndex[index].findIndex(t => t.tagId === list.tagId);
+      if (ls !== -1) {
+        this.tagListFormIndex[index].splice(ls, 1);
+        // 使用 Vue.set 方法
+        this.$set(this.tagListFormIndex, index, [...this.tagListFormIndex[index]]);
+      }
+    },
+
+    //删除某一个规则
+    delItemList(index){
+      this.form.rulesTags.splice(index,1)
+      this.tagListFormIndex.splice(index,1)
+    },
+
+
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        id: null,
+        type: 3,
+        createName: null,
+        applyUsers: null,
+        ruleName: null,
+        rulesTags: [{tags:[],week:[1,2,3,4,5,6,7],startTime:null,endTime:null,remarks:null,dayOrWeek:0,days:null}],
+        totalNumTags: null,
+        numTagsTaday: null,
+        isApply: null,
+        createTime: null,
+        companyId: null,
+        remarks: null
+      };
+      //选择的成员
+      this.userSelectList=[];
+      //选择的标签
+      this.tagListFormIndex=[];
+
+      //规则
+      this.form.rulesTags=[{tags:[],week:[1,2,3,4,5,6,7],startTime:null,endTime:null,remarks:null,dayOrWeek:0,days:null}];
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.queryParams.corpId= this.myQwCompanyList[0].dictValue
+      this.afreshData(this.queryParams.corpId)
+      this.handleQuery();
+    },
+
+    handleUpdate(row){
+
+
+      this.reset();
+
+      //所有的员工
+      listUser({corpId:this.queryParams.corpId}).then(res=>{
+        this.userList=res.rows;
+      })
+
+
+      // 深拷贝表单数据
+      const requestData = { ...row };
+      requestData.applyUsers = JSON.parse(row.applyUsers);
+
+      this.userSelectListUpdate=requestData.applyUsers;
+      this.updateUserOpen.id=requestData.id;
+      this.updateUserOpen.open=true;
+
+
+    },
+
+    submitUpdateAutoTags(){
+      if (this.updateUserOpen.id != null && this.updateUserOpen.applyUsersUpdate.length>0) {
+        updateTags({id:this.updateUserOpen.id,applyUsers:JSON.stringify(this.updateUserOpen.applyUsersUpdate)}).then(response => {
+          this.msgSuccess("修改成功");
+          this.updateUserOpen.open = false;
+          this.getList();
+        });
+      }else {
+        this.msgError("修改失败:成员不能为空 或 未选规则");
+      }
+    },
+    cancelAutoTags(){
+      this.reset();
+      this.updateUserOpen.open=false;
+      this.updateUserOpen.applyUsersUpdate=[];
+      this.updateUserOpen.id=null;
+      this.userSelectListUpdate=[];
+    },
+
+    /** 详情按钮操作 */
+    handleDetails(row) {
+
+      this.reset();
+
+      // 深拷贝表单数据
+      const requestData = { ...row };
+      // 将 `数据` 转为 JSON
+      requestData.rulesTags = JSON.parse(row.rulesTags);
+      requestData.applyUsers = JSON.parse(row.applyUsers);
+
+      this.detailListFrom = requestData;
+      this.detailFrom.open=true;
+      this.detailFrom.title='规则详情';
+    },
+
+
+
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          const itemForms = this.$refs.rulesTagsFrom;
+          if (Array.isArray(itemForms)) {
+            let allValid = true;
+
+            itemForms.forEach((itemFormRef, index) => {
+              itemFormRef.validate((itemValid) => {
+                allValid = itemValid;
+
+                if (index === itemForms.length - 1 && allValid) {
+                  //全表单验证通过
+                  this.commitForm();
+                }
+              });
+            });
+          }
+        }
+      });
+    },
+
+    //提交form表单
+    commitForm(){
+      // 深拷贝表单数据
+      const requestData = { ...this.form };
+      // 将 `form.rulesTags` 转为 JSON 字符串
+      requestData.rulesTags = JSON.stringify(this.form.rulesTags);
+      requestData.applyUsers = JSON.stringify(this.form.applyUsers);
+      requestData.corpId=this.queryParams.corpId;
+      requestData.companyId = this.queryParams.companyId
+      if (this.form.id != null) {
+        updateTags(requestData).then(response => {
+          this.msgSuccess("修改成功");
+          this.open = false;
+          this.getList();
+        });
+      } else {
+        addTags(requestData).then(response => {
+          this.msgSuccess("新增成功");
+          this.open = false;
+          this.getList();
+        });
+      }
+    },
+
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const ids = row.id || this.ids;
+      this.$confirm('是否确认删除自动打标签主编号为"' + ids + '"的数据项?', "警告", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      }).then(function() {
+        return delTags(ids);
+      }).then(() => {
+        this.getList();
+        this.msgSuccess("删除成功");
+      }).catch(() => {});
+    },
+
+  }
+};
+</script>
+<style scoped>
+/* CSS 样式 */
+.tag-container {
+  display: flex;
+  flex-wrap: wrap; /* 超出宽度时自动换行 */
+  gap: 8px; /* 设置标签之间的间距 */
+}
+.name-background {
+  display: inline-block;
+  background-color: #abece6; /* 背景颜色 */
+  padding: 4px 8px; /* 调整内边距,让背景包裹文字 */
+  border-radius: 4px; /* 可选:设置圆角 */
+}
+.tag-box {
+  padding: 8px 12px;
+  border: 1px solid #989797;
+  border-radius: 4px;
+  cursor: pointer;
+  display: inline-block;
+}
+
+.tag-selected {
+  background-color: #00bc98;
+  color: #fff;
+  border-color: #00bc98;
+}
+
+.el-tag + .el-tag {
+  margin-left: 10px;
+}
+
+
+.button-new-tag {
+  margin-left: 10px;
+  height: 32px;
+  line-height: 30px;
+  padding-top: 0;
+  padding-bottom: 0;
+}
+.input-new-tag {
+  width: 90px;
+  margin-left: 10px;
+  vertical-align: bottom;
+}
+.text-container {
+  max-height: 5em; /* 设置最大高度为6行,根据字体大小调整 */
+  overflow-y: auto; /* 内容超出时显示滚动条 */
+  line-height: 1.5em; /* 行高设置,确保每行高度一致 */
+}
+/* 新增的滚动容器样式(不影响原有样式) */
+.scroll-wrapper {
+  max-height: 130px; /* 大约三行的高度 */
+  overflow-y: auto;  /* 垂直滚动 */
+  padding-right: 5px; /* 为滚动条留出空间 */
+}
+
+/* 美化滚动条(可选) */
+.scroll-wrapper::-webkit-scrollbar {
+  width: 6px;
+}
+.scroll-wrapper::-webkit-scrollbar-thumb {
+  background: rgba(0, 0, 0, 0.2);
+  border-radius: 3px;
+}
+ .tag-container {
+   max-height: 300px;
+   overflow-y: auto;
+   padding: 1px;
+   border: 1px solid #ebeef5;
+   border-radius: 1px;
+   background-color: #fafafa;
+ }
+.tag-list {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+}
+.scroll-hint {
+  text-align: center;
+  color: #909399;
+  font-size: 12px;
+  padding: 1px 0;
+}
+.container {
+  max-width: 800px;
+  margin: 0 auto;
+  padding: 10px;
+}
+.title {
+  text-align: center;
+  color: #303133;
+  margin-bottom: 30px;
+}
+.demo-table {
+  width: 100%;
+  margin-bottom: 30px;
+}
+.instructions {
+  background-color: #f5f7fa;
+  padding: 15px;
+  border-radius: 1px;
+  margin-bottom: 20px;
+}
+</style>

+ 457 - 0
src/views/qw/autoTags/dayPartingIndexDetails.vue

@@ -0,0 +1,457 @@
+<template>
+  <div style="background-color:  rgb(240 242 245)">
+    <div style="display: flex;flex-wrap: nowrap;background-color: rgb(240 242 245);height: 500px;">
+      <div style="background-color: #FFFFFF;width: 100%" class="app-container">
+<!--        <span style="font-size: 15px">基础信息</span>-->
+        <div  class="desct">
+          基础信息
+        </div>
+<!--        <el-divider></el-divider>-->
+        <div style="display: flex;flex-wrap: nowrap">
+          <div style="width: 500px">
+            <el-descriptions :column="1" size="medium" >
+              <el-descriptions-item label="规则名称">
+                <span>{{groupIndexFrom.ruleName}}</span>
+              </el-descriptions-item>
+              <el-descriptions-item label="打标签方式">
+                <span>分时段加好友打标签</span>
+              </el-descriptions-item>
+              <el-descriptions-item label="创建者">
+                <span>{{groupIndexFrom.createName}}</span>
+              </el-descriptions-item>
+              <el-descriptions-item label="生效成员">
+              <span v-for="userId in groupIndexFrom.applyUsers" :key="userId" style="display: inline;width: 300px">
+                      <el-tag :disable-transitions="false"  v-for="list in userList" :key="list.id" style="margin: 3px;" v-if="list.id==userId">{{list.nickName}}</el-tag>
+                </span>
+              </el-descriptions-item>
+<!--              <el-descriptions-item label="添加的标签" labelStyle="width: 80px">-->
+<!--                <span v-for="tagId in groupIndexFrom.tagsSet" :key="tagId" style="display: inline;width: 300px">-->
+<!--                      <el-tag :disable-transitions="false"  v-for="list in tagList" :key="list.id" style="margin: 3px;" v-if="list.tagId==tagId">{{list.name}}</el-tag>-->
+<!--                </span>-->
+<!--              </el-descriptions-item>-->
+              <el-descriptions-item label="创建时间">{{groupIndexFrom.createTime}}</el-descriptions-item>
+              <el-descriptions-item label="规则状态">
+                <el-switch
+                  v-model="groupIndexFrom.isApply"
+                  active-color="#13ce66"
+                  inactive-color="#ff4949"
+                  active-value="1"
+                  inactive-value="2"
+                  disabled>
+                </el-switch>
+                <span v-if="groupIndexFrom.isApply == '1'" style="margin-left: 10px;color: #13ce66">已启用</span>
+                <span v-if="groupIndexFrom.isApply == '2'" style="margin-left: 10px;color: #ff4949">已关闭</span>
+              </el-descriptions-item>
+            </el-descriptions>
+          </div>
+          <div style="background-color: #fbfbfb;padding: 10px;  border: 1px solid #e6e6e6; margin-bottom: 20px;;width: 100%;height: 350px;overflow:auto">
+            <div >
+              <span class="spanSize">规则设置:共 {{groupIndexFrom.rulesTags.length}} 条规则</span>
+              <div v-for="(rtList,index) in groupIndexFrom.rulesTags">
+                <div style="margin-left: 10%;margin-top: 1%">
+                  <span class="spanSize">|规则 {{index +1}} </span>
+                  <div class="spanSize">客户在 每
+                    <span v-for="id in rtList.week" :key="id" style="display: inline;" v-if="rtList.dayOrWeek == 0">
+                      <el-tag :disable-transitions="false"  v-for="list in weekOptions" :key="list.value" style="margin: 3px;" v-if="list.value==id">{{list.label}}</el-tag>
+                    </span>
+                    <span style="display: inline;" v-if="rtList.dayOrWeek == 1">
+                      <el-tag>{{rtList.days[0]}}</el-tag> 到 <el-tag>{{rtList.days[1]}}</el-tag>
+                    </span>
+                    <span>【{{rtList.startTime}}~{{rtList.endTime}}】</span>
+                    时,打上标签
+                    <span v-for="tagId in rtList.tags" :key="tagId" style="display: inline;">
+                      <el-tag :disable-transitions="false"  v-for="list in tagList" :key="list.id" style="margin: 3px;" v-if="list.tagId==tagId">{{list.name}}</el-tag>
+                    </span>
+                  </div>
+                  <div class="spanSize">并备注上:
+                    <span>【{{rtList.remarks}}】</span>
+
+                  </div>
+                </div>
+
+              </div>
+            </div >
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div class="contentx">
+      <div class="desct">
+        数据分析
+      </div>
+      <div class="statistics-container">
+        <el-row :gutter="20" type="flex">
+          <el-col :span="6"  >
+            <el-card style="height: 100px">
+              <div class="statistic-item">
+                <h2>{{ groupIndexFrom.totalNumTagsCount }} </h2>
+                <p>打标签总数</p>
+              </div>
+            </el-card>
+          </el-col>
+          <el-col :span="6" >
+            <el-card style="height: 100px">
+              <div class="statistic-item">
+                <h2>{{ groupIndexFrom.numTagsTadayCount }} </h2>
+                <p>今日打标签数</p>
+              </div>
+            </el-card>
+          </el-col>
+        </el-row>
+      </div>
+    </div>
+
+    <div  style="background-color:  rgb(240 242 245);padding-bottom: 15px">
+      <div style="margin: 15px;  padding:15px;  background-color: #fff;">
+          <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="120px">
+            <el-form-item label="所属员工" prop="qwUserid">
+              <el-input
+                v-model="queryParams.qwUserid"
+                placeholder="请输入所属员工名称"
+                clearable
+                size="small"
+                @keyup.enter.native="handleQuery"
+              />
+            </el-form-item>
+            <el-form-item label="搜索客户" prop="externalUserId">
+              <el-input
+                v-model="queryParams.externalUserId"
+                placeholder="请输入客户名称"
+                clearable
+                size="small"
+                @keyup.enter.native="handleQuery"
+              />
+            </el-form-item>
+            <el-form-item label="添加好友时间" prop="addTime">
+              <el-date-picker
+                v-model="queryParams.addTime"
+                type="daterange"
+                align="right"
+                unlink-panels
+                range-separator="至"
+                start-placeholder="开始日期"
+                end-placeholder="结束日期"
+                :picker-options="pickerOptions"
+                :default-time="['00:00:00', '23:59:59']">
+              </el-date-picker>
+            </el-form-item>
+
+
+            <el-form-item>
+              <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+              <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+            </el-form-item>
+          </el-form>
+
+          <el-table v-loading="loading" :data="autoTagsLogsList">
+            <el-table-column label="客户名称" align="center" prop="externalUserName" />
+            <el-table-column label="所属企微员工" align="center" prop="qwUsername" />
+            <el-table-column label="所属销售" align="center" prop="companyName" />
+            <el-table-column label="添加的标签" align="center" prop="tagIdsName" >
+              <template slot-scope="scope">
+                <div v-for="name in scope.row.tagIdsName" style="display: inline;">
+                  <el-tag type="success">{{ name }}</el-tag>
+                </div>
+              </template>
+            </el-table-column>
+            <el-table-column label="添加好友时间" align="center" prop="addTime" width="180"/>
+            <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+              <template slot-scope="scope">
+                <el-button v-if="scope.row.customerId"
+                           size="mini"
+                           type="text"
+                           icon="el-icon-paperclip"
+                           @click="handleShow(scope.row)"
+                >查看客户</el-button>
+                <el-tag  v-else type="danger"  size="mini">未绑定CRM客户</el-tag>
+              </template>
+            </el-table-column>
+          </el-table>
+
+          <pagination
+            v-show="total>0"
+            :total="total"
+            :page.sync="queryParams.pageNum"
+            :limit.sync="queryParams.pageSize"
+            @pagination="getList"
+          />
+        </div>
+
+      </div>
+
+    <!-- <el-drawer size="75%" :title="show.title" :visible.sync="show.open" append-to-body >
+      <customer-details  ref="customerDetails" />
+    </el-drawer> -->
+
+</div>
+
+
+
+</template>
+
+<script>
+import { listAutoTagsLogs, exportAutoTagsLogs } from "@/api/qw/autoTagsLogs";
+// import CustomerGroupDetails from '@/views/qw/groupMsg/customerGroupDetails.vue'
+import { listTag } from '@/api/qw/tag'
+import { listUser } from '@/api/qw/user'
+// import customerDetails from '@/views/qw/externalContact/customerDetails.vue'
+
+export default {
+  name: "AutoTagsLogs",
+  // components: { CustomerGroupDetails ,customerDetails},
+  props:{
+    groupIndexFrom:{},
+  },
+  watch:{
+    groupIndexFrom:{
+      handler(newVal){
+        //当表单发生变化时
+        this.getList(newVal.id)
+      },
+      deep:true
+    }
+  },
+  data() {
+    return {
+      // 遮罩层
+      loading: false,
+      // 导出遮罩层
+      exportLoading: false,
+
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 自动打标签的日志表格数据
+      autoTagsLogsList: [],
+
+      //所有的标签
+      tagList:[],
+
+      //成员信息
+      userList:[],
+
+      weekOptions: [{
+        value: 1,
+        label: '星期一'
+      }, {
+        value: 2,
+        label: '星期二'
+      }, {
+        value: 3,
+        label: '星期三'
+      }, {
+        value: 4,
+        label: '星期四'
+      }, {
+        value: 5,
+        label: '星期五'
+      }
+        , {
+          value: 6,
+          label: '星期六'
+        }
+        , {
+          value: 7,
+          label: '星期天'
+        }],
+
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        autoTagId: null,
+        type: 3,
+        qwUserid: null,
+        externalUserId: null,
+        effectiveRules: null,
+        addTime: [],
+        chatId: null,
+        joinScene: null,
+        companyId: null
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+      },
+      show:{
+        title:"客户详情",
+        open:false,
+      },
+      //日期快捷选择
+      pickerOptions: {
+        shortcuts: [
+          {
+            text: '最近三天',
+            onClick(picker) {
+              const end = new Date();
+              end.setHours(23, 59, 59, 999);
+              const start = new Date();
+              start.setTime(start.getTime() - 3600 * 1000 * 24 * 3);
+              start.setHours(0, 0, 0, 0);
+              picker.$emit('pick', [start, end]);
+            }
+          },{
+            text: '最近一周',
+            onClick(picker) {
+              const end = new Date();
+              end.setHours(23, 59, 59, 999);
+              const start = new Date();
+              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
+              start.setHours(0, 0, 0, 0);
+              picker.$emit('pick', [start, end]);
+            }
+          }, {
+            text: '最近一个月',
+            onClick(picker) {
+              const end = new Date();
+              end.setHours(23, 59, 59, 999);
+              const start = new Date();
+              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
+              start.setHours(0, 0, 0, 0);
+              picker.$emit('pick', [start, end]);
+            }
+          }, {
+            text: '最近三个月',
+            onClick(picker) {
+              const end = new Date();
+              end.setHours(23, 59, 59, 999);
+              const start = new Date();
+              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
+              start.setHours(0, 0, 0, 0);
+              picker.$emit('pick', [start, end]);
+            }
+          }]
+      },
+    };
+  },
+  created() {
+
+    //所有的标签
+    listTag().then(response => {
+      this.tagList = response.rows;
+    });
+    listUser().then(res=>{
+      this.userList=res.rows;
+    })
+
+    this.getList(this.groupIndexFrom);
+  },
+  methods: {
+    /** 查询自动打标签的日志列表 */
+    getList() {
+      this.queryParams.autoTagId =  this.groupIndexFrom.id;
+      this.loading = true;
+
+      listAutoTagsLogs(this.queryParams).then(response => {
+        this.autoTagsLogsList = response.rows;
+
+        this.total = response.total;
+        this.loading = false;
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        id: null,
+        autoTagId: null,
+        type: 3,
+        qwUserid: null,
+        externalUserId: null,
+        effectiveRules: null,
+        addTime: [],
+        chatId: null,
+        joinScene: null,
+        companyId: null
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+
+    /** 查看客户详情 */
+    handleShow(row){
+      this.show.open=true;
+      var that=this;
+      const tab = "visit";
+      setTimeout(() => {
+        that.$refs.customerDetails.getDetails(row.customerId);
+        that.$refs.customerDetails.handleClick(tab);
+      }, 200);
+    },
+
+    /** 导出按钮操作 */
+    handleExport() {
+      const queryParams = this.queryParams;
+      this.$confirm('是否确认导出所有自动打标签的日志数据项?', "警告", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      }).then(() => {
+        this.exportLoading = true;
+        return exportAutoTagsLogs(queryParams);
+      }).then(response => {
+        this.download(response.msg);
+        this.exportLoading = false;
+      }).catch(() => {});
+    }
+  }
+};
+</script>
+<style scoped>
+
+.contentx{
+  height: 100%;
+  background-color: #fff;
+  padding: 0px 20px 20px;
+  margin:0 15px;
+}
+.desct{
+  padding-top: 20px;
+  padding-bottom: 20px;
+  color: #524b4a;
+  font-weight: bold;
+}
+
+.spanSize{
+  font-size: 15px;
+  font-weight: normal;
+}
+.statistics-container {
+  padding: 0 20px;
+}
+.statistic-item {
+  text-align: center;
+  margin-top: 5%;
+}
+.statistic-item h2 {
+  font-size: 15px;
+  margin: 0;
+  font-weight: normal;
+}
+.statistic-item p {
+  margin: 5px 0 0;
+  font-size: 15px;
+  color: #666;
+  font-weight: normal;
+}
+</style>

+ 210 - 0
src/views/qw/autoTags/groupChat.vue

@@ -0,0 +1,210 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="90px">
+      <el-form-item label="群名" prop="name">
+        <el-input
+          v-model="queryParams.name"
+          placeholder="请输入群名"
+          clearable
+          size="small"
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item>
+          <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+          <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">刷新/重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-table v-loading="loading" :data="groupChatList" ref="groupChatList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="群名" align="center" prop="name" >
+        <template slot-scope="scope">
+          <i class="el-icon-s-comment"></i>
+          {{scope.row.name}}
+        </template>
+      </el-table-column>
+      <el-table-column label="群人数" align="center" prop="groupSizeByChartUser"></el-table-column>
+
+
+    </el-table>
+    <div style="margin-top: 30px;display: flex;justify-content: center">
+      <el-button type="warning" icon="el-icon-search" @click="confirmSelect">确定选择</el-button>
+      <el-button icon="el-icon-refresh"  @click="resetSelect">重置选择</el-button>
+    </div>
+
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="handlePaginationChange"
+    />
+
+  </div>
+</template>
+
+<script>
+import {
+  listGroupChat,
+} from '@/api/qw/groupChat'
+
+export default {
+  name: "GroupChat",
+  props:{
+    index:Number
+  },
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 导出遮罩层
+      exportLoading: false,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 客户群详情表格数据
+      groupChatList: [],
+
+      //选择的客户群列表
+      selectGroupChartList:[],
+
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        name: null,
+        owner: null,
+        notice: null,
+        memberVersion: null,
+        status: null,
+        companyId: null,
+        corpId: null,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+      }
+    };
+  },
+  created() {
+
+  },
+  methods: {
+
+    /** 查询客户群列表 */
+    getList() {
+      this.loading = true;
+      listGroupChat(this.queryParams).then(response => {
+        this.groupChatList = response.rows;
+        this.total = response.total;
+        this.loading = false;
+
+      });
+    },
+    getDetails(corpId){
+
+      this.groupChatList = [];
+      this.queryParams.corpId=corpId;
+      this.getList();
+    },
+    handlePaginationChange(row) {
+      this.queryParams.pageNum = row.page;
+      this.queryParams.pageSize = row.limit;
+      this.getList();
+    },
+    //确定选择
+    confirmSelect(){
+      this.$emit("selectGroupChatList",this.selectGroupChartList,this.index);
+      this.resetSelect();
+    },
+    //重置选择
+    resetSelect(){
+      this.$refs.groupChatList.clearSelection();
+
+      this.selectGroupChartList=[];
+
+      //重置
+      this.queryParams={
+        pageNum: 1,
+        pageSize: 10,
+        name: null,
+        owner: null,
+        notice: null,
+        memberVersion: null,
+        status: null,
+        companyId: null,
+        corpId: null,
+      },
+        this.getList();
+    },
+
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        chatId: null,
+        id: null,
+        name: null,
+        owner: null,
+        notice: null,
+        memberVersion: null,
+        status: "0",
+        companyId: null,
+        corpId: null,
+        createTime: null,
+        updateTime: null
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+
+      // 保存当前页的选中项
+      const currentPageSelections = selection.map(item => item.chatId);
+
+      // 合并选中项
+      this.selectGroupChartList = this.selectGroupChartList.filter(item =>
+        this.groupChatList.some(tag => tag.chatId === item.chatId) ? currentPageSelections.includes(item.chatId) : true
+      ).concat(selection.filter(item => !this.selectGroupChartList.some(selected => selected.chatId === item.chatId)));
+
+      // 更新 ids 和 selectTagsList
+      this.ids = this.selectGroupChartList.map(item => item.chatId);
+
+      // 更新 single 和 multiple
+      this.single = this.selectGroupChartList.length !== 1;
+      this.multiple = !this.selectGroupChartList.length;
+
+    },
+  }
+};
+</script>

+ 859 - 0
src/views/qw/autoTags/groupIndex.vue

@@ -0,0 +1,859 @@
+<template>
+  <div class="app-container">
+    <el-tabs v-model="activeName" style="background-color: #fff;" @tab-click="handleClick" type="card">
+<!--      <el-tab-pane label="关键词打标签" name="1"></el-tab-pane>-->
+      <el-tab-pane label="客户入群行为打标签" name="2"></el-tab-pane>
+      <el-tab-pane label="分时段打标签" name="3"></el-tab-pane>
+    </el-tabs>
+
+    <div >
+      <div v-if="activeName==='1'">
+        <keyWordIndex></keyWordIndex>
+      </div>
+      <div v-if="activeName==='2'" >
+
+        <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="100px">
+          <el-form-item label="企微公司" prop="corpId">
+                <el-select v-model="queryParams.corpId" placeholder="企微公司"  size="small" @change="updateCorpId()">
+                  <el-option
+                    v-for="dict in myQwCompanyList"
+                    :key="dict.dictValue"
+                    :label="dict.dictLabel"
+                    :value="dict.dictValue"
+                  />
+                </el-select>
+          </el-form-item>
+          <!-- <el-form-item label="公司" prop="companyId">
+          <el-select v-model="queryParams.companyId" placeholder="公司"  size="small" @change="updateCompanyId()">
+            <el-option
+              v-for="dict in myCompanyList"
+              :key="dict.companyId"
+              :label="dict.companyName"
+              :value="dict.companyId"
+            />
+          </el-select>
+      </el-form-item> -->
+          <el-form-item label="规则名称:" prop="ruleName">
+            <el-input
+              v-model="queryParams.ruleName"
+              placeholder="请输入规则名称"
+              clearable
+              size="small"
+              @keyup.enter.native="handleQuery"
+            />
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+            <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">刷新/重置</el-button>
+            <el-button
+              type="primary"
+              size="mini"
+              plain
+              icon="el-icon-plus"
+              @click="handleAdd"
+              v-hasPermi="['qw:autoTags:add']"
+            >添加规则</el-button>
+          </el-form-item>
+
+        </el-form>
+<!--        <div style="padding:0 0 15px 0">-->
+<!--          <el-button-->
+<!--            type="primary"-->
+<!--            size="small"-->
+<!--            plain-->
+<!--            icon="el-icon-plus"-->
+<!--            @click="handleAdd"-->
+<!--            v-hasPermi="['shop:tags:add']"-->
+<!--          >添加规则</el-button>-->
+<!--        </div>-->
+
+        <el-table v-loading="loading" :data="groupIndexList" border  height="550px">
+          <el-table-column label="规则名称" align="center" prop="ruleName" />
+          <el-table-column label="添加的标签" align="center" prop="tagIdsName" width="300px">
+            <template slot-scope="scope">
+              <div v-for="name in scope.row.tagIdsName" style="display: inline;">
+                <el-tag type="success">{{ name }}</el-tag>
+              </div>
+            </template>
+          </el-table-column>
+          <el-table-column label="已打标签总数" align="center" prop="totalNumTagsCount" />
+          <el-table-column label="规则状态" align="center" prop="isApply">
+            <template slot-scope="scope">
+              <el-switch
+                v-model="scope.row.isApply"
+                active-color="#13ce66"
+                inactive-color="#ff4949"
+                active-value="1"
+                inactive-value="2"
+                @change="switchChange(scope.row)">
+              </el-switch>
+              <span v-if="scope.row.isApply == '1'" style="margin-left: 10px;color: #13ce66">已启用</span>
+              <span v-if="scope.row.isApply == '2'" style="margin-left: 10px;color: #ff4949">已关闭</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+            <template slot-scope="scope">
+              <el-button
+                size="mini"
+                type="text"
+                icon="el-icon-edit"
+                @click="handleDetails(scope.row)"
+                v-hasPermi="['qw:autoTags:query']"
+              >详情</el-button>
+              <el-button
+                size="mini"
+                type="text"
+                icon="el-icon-delete"
+                @click="handleDelete(scope.row)"
+                v-hasPermi="['qw:autoTags:remove']"
+              >删除</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+
+
+        <pagination
+          v-show="total>0"
+          :total="total"
+          :page.sync="queryParams.pageNum"
+          :limit.sync="queryParams.pageSize"
+          @pagination="getList"
+        />
+
+      </div>
+      <div v-if="activeName==='3'">
+        <dayPartingIndex></dayPartingIndex>
+      </div>
+
+
+      <!-- 添加或修改自动打标签主对话框 -->
+      <el-dialog :title="title" :visible.sync="open" width="1200px" append-to-body>
+
+        <el-form  ref="form" :model="form" :rules="rules" label-position="left"  label-width="120px">
+          <div class="app-container">
+            <div>
+              <span style="font-size: 15px">规则基础信息</span>
+              <el-divider></el-divider>
+            </div>
+            <el-alert
+              title="设定规则,当用户加入规则内的群聊,自动给入群客户打标签"
+              type="warning"
+              style="font-size: 15px;margin-bottom: 2%;"
+              :closable="false"
+              show-icon>
+            </el-alert>
+            <el-form-item label="规则名称:" prop="ruleName" style="width: 400px">
+              <el-input v-model="form.ruleName" placeholder="请输入规则名称(内部可见)" />
+            </el-form-item>
+
+            <div style="margin-top: 5%">
+              <span style="font-size: 15px">设置打标签的规则</span>
+              <el-divider></el-divider>
+            </div>
+            <div v-for="(item, index) in form.rulesTags" :key="index">
+              <div style="background-color: #fbfbfb; padding: 10px; border: 1px solid #e6e6e6; margin-bottom: 20px;">
+                <el-form ref="rulesTagsFrom" :rules="rulesTagsRules" :model="item">
+                  <div style="display: flex">
+                    <el-form-item prop="rules" style="width: 500px">
+                      <div style="display: flex; align-items: center;">
+                        <div style="width: 150px">
+                          <span style="margin-right: 10px;">规则 {{ index + 1 }}:用户加入群聊</span>
+                        </div>
+                        <div @click="handleGroupChatList(item,index)" style="cursor: pointer; border: 1px solid #e6e6e6; background-color: white; overflow: hidden; flex-grow: 1;width: 350px">
+                          <div style="min-height: 40px; max-height: 200px; overflow-y: auto;">
+                            <el-tag
+                              style="margin-left: 5px"
+                              size="medium"
+                              :key="list.chatId"
+                              v-for="list in groupChatList[index]"
+                              closable
+                              :disable-transitions="false"
+                              @close="handleClosegroupChat(list,index)">
+                              {{list.name}}
+                            </el-tag>
+                          </div>
+                        </div>
+                      </div>
+                    </el-form-item>
+                    <el-form-item prop="tags" style="width: 500px">
+                      <div style="display: flex; align-items: center;">
+                        <div style="width: 110px">
+                          <span style="margin:0px 10px;">选择的标签:</span>
+                        </div>
+                        <div @click="handleChangeTags(item,index)" style="cursor: pointer; border: 1px solid #e6e6e6; background-color: white; overflow: hidden; flex-grow: 1;width: 390px">
+                          <div style="min-height: 40px; max-height: 200px; overflow-y: auto;">
+                            <el-tag type="success"
+                                    closable
+                                    :disable-transitions="false"
+                                    v-for="list in tagListFormIndex[index]"
+                                    :key="list.tagId"
+                                    @close="handleCloseTag(list,index)"
+                                    style="margin: 3px;"
+                                   >{{list.name}}
+                            </el-tag>
+                          </div>
+                        </div>
+
+                      </div>
+                    </el-form-item>
+                    <el-link v-if="form.rulesTags.length>1" icon="el-icon-delete-solid" @click="delItemList(index)" type="text" style="color: rgb(24, 144, 255);margin-left:10px;height: 40px " ></el-link>
+                  </div>
+                </el-form>
+              </div>
+            </div>
+            <div>
+              <el-link type="primary" class="el-icon-plus" :underline="false" @click='addItemList()'>添加其他规则(最多5条)</el-link>
+            </div>
+
+          </div>
+        </el-form>
+
+
+        <div slot="footer" class="dialog-footer">
+          <el-button type="primary" @click="submitForm">确 定</el-button>
+          <el-button @click="cancel">取 消</el-button>
+        </div>
+      </el-dialog>
+    </div>
+
+    <!-- 选择群聊    -->
+    <el-dialog :title="groupChart.title" :visible.sync="groupChart.open" style="width: 1300px;height: 100%" append-to-body>
+      <GroupChat ref="GroupChat" @selectGroupChatList="selectGroupChatList" :index="groupChart.index"></GroupChat>
+    </el-dialog>
+
+
+    <el-dialog title="添加标签" :visible.sync="tagChange.open" width="800px" append-to-body>
+      <div>搜索标签:
+        <el-input v-model="queryTagParams.name" placeholder="请输入标签名称" clearable size="small" style="width: 200px;margin-right: 10px" />
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleSearchTags">搜索</el-button>
+        <el-button type="primary" icon="el-icon-plus" size="mini" @click="cancelSearchTags">重置</el-button>
+      </div>
+      <div v-for="item in tagGroupList" :key="item.id" >
+        <div style="font-size: 20px;margin-top: 20px;margin-bottom: 20px;">
+          <span class="name-background">{{ item.name }}</span>
+        </div>
+
+        <!-- 添加外层滚动容器 -->
+        <div class="scroll-wrapper">
+          <div class="tag-container">
+            <a
+              v-for="tagItem in item.tag"
+              class="tag-box"
+              @click="tagSelection(tagItem)"
+              :class="{ 'tag-selected': tagItem.isSelected }"
+            >
+              {{ tagItem.name }}
+            </a>
+          </div>
+        </div>
+      </div>
+      <pagination
+        v-show="tagTotal>0"
+        :total="tagTotal"
+        :page.sync="queryTagParams.pageNum"
+        :limit.sync="queryTagParams.pageSize"
+        @pagination="getPageListTagGroup"
+      />
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="addTagSubmitForm(tagChange.index)">确 定</el-button>
+        <el-button @click="addTagCancel(tagChange.index)">重 置</el-button>
+      </div>
+    </el-dialog>
+
+    <!-- 群规则详情    -->
+    <el-drawer :title="detailFrom.title" :visible.sync="detailFrom.open" size="75%" style="font-weight: bolder">
+        <groupIndexDetails :groupIndexFrom="detailListFrom"></groupIndexDetails>
+    </el-drawer>
+
+  </div>
+
+</template>
+
+<script>
+import { listTags, getTags, delTags, addTags, updateTags, exportTags } from "@/api/qw/autoTags";
+import qwUserList from '@/views/qw/user/qwUserList.vue'
+import dayPartingIndex from '@/views/qw/autoTags/dayPartingIndex.vue'
+import keyWordIndex from '@/views/qw/autoTags/keyWordIndex.vue'
+import GroupChat from '@/views/qw/autoTags/groupChat.vue'
+import { allListTagGroup } from '@/api/qw/tagGroup'
+import {listTag, searchTags} from '@/api/qw/tag'
+import groupIndexDetails from '@/views/qw/autoTags/groupIndexDetails.vue'
+import { getMyQwUserList,getMyQwCompanyListAll,getCompanyListByCorpId } from "@/api/qw/user";
+export default {
+  name: "autoTags",
+  components: {GroupChat, qwUserList,dayPartingIndex,keyWordIndex,groupIndexDetails },
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 导出遮罩层
+      exportLoading: false,
+      activeName:'2',
+      myQwCompanyList:[],
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      tagTotal:0,
+      // 自动打标签主表格数据
+      groupIndexList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      //选择群聊
+      groupChart:{
+        title:"",
+        open:false,
+        index:null,
+      },
+
+      //选择的群聊
+      groupChatList:[],
+
+      //所有的标签组-标签
+      tagGroupList:[],
+
+      //所有的标签
+      // tagList:[],
+
+      //选择的标签
+      tagListFormIndex:[],
+
+      //标签弹窗选择
+      tagChange:{
+        open:false,
+        index:null,
+      },
+      //详情抽屉
+      detailFrom:{
+        open:false,
+        title:'',
+      },
+
+      queryTagParams: {
+        pageNum: 1,
+        pageSize: 5,
+        total:0,
+        name:null,
+        corpId:null,
+      },
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        type: 2,
+        createName: null,
+        applyUsers: null,
+        ruleName: null,
+        rulesTags: null,
+        totalNumTags: null,
+        numTagsTaday: null,
+        isApply: null,
+        corpId: null,
+        companyId: null
+      },
+      // 表单参数
+      form: {},
+      //详情表单参数
+      detailListFrom:{},
+      // 表单校验
+      rules: {
+        ruleName:[{ required: true, message: "规则名称不能为空", trigger: "submit" }],
+      },
+      //规则验证
+      rulesTagsRules:{
+        rules: [
+          { required: true, message: '请添加群', trigger: 'blur' }
+        ],
+        tags: [
+          { required: true, message: '请选择标签', trigger: 'blur' }
+        ]
+      },
+      //根据企微查出来的公司列表
+      // myCompanyList:[],
+    };
+  },
+  created() {
+    //所有的标签组-标签
+
+    getMyQwCompanyListAll().then(response => {
+            this.myQwCompanyList = response.data;
+            if(this.myQwCompanyList!=null){
+              this.queryParams.corpId=this.myQwCompanyList[0].dictValue;
+              // getCompanyListByCorpId(this.queryParams.corpId).then(response =>{
+              //   this.myCompanyList = response.data;
+              // })
+              // if(this.myCompanyList != null){
+                // this.queryParams.companyId = this.myCompanyList[0].companyId
+                this.afreshData(this.queryParams.corpId)
+                this.getList();
+              // }
+            }
+    });
+  },
+  watch: {
+    groupChatList: {
+      handler(newList) {
+        // 遍历 groupChatList 并将 chatId 放入对应位置的 rulesTags
+        newList.forEach((group, index) => {
+          if (!this.form.rulesTags[index]) {
+            this.$set(this.form.rulesTags, index, { rules: [], tags: [] });
+          }
+          // 确保清空原来的 tags 数组
+          this.form.rulesTags[index].rules = [];
+          group.forEach(item => {
+            // 将 chatId 放入对应位置的 rulesTags 中的 rules 数组
+            this.form.rulesTags[index].rules.push(item.chatId);
+          });
+        });
+      },
+      deep: true
+    },
+    tagListFormIndex: {
+      handler(newList) {
+        // 遍历 tagListFormIndex 并将 tagId 放入对应位置的 tags
+        newList.forEach((tags, index) => {
+          if (!this.form.rulesTags[index]) {
+            this.$set(this.form.rulesTags, index, { rules: [], tags: [] });
+          }
+
+          // 确保清空原来的 tags 数组
+          this.form.rulesTags[index].tags = [];
+
+          tags.forEach(item => {
+            // 将 tagId 放入对应位置的 rulesTags 中的 tags 数组
+            this.form.rulesTags[index].tags.push(item.tagId);
+          });
+        });
+      },
+      deep: true
+    }
+  },
+
+  methods: {
+    updateCorpId(){
+      // this.myCompanyList = [];
+      // getCompanyListByCorpId(this.queryParams.corpId).them(response =>{
+      //           this.myCompanyList = response.data;
+      //         })
+      this.afreshData(this.queryParams.corpId)
+      this.getList();
+     },
+    //  updateCompanyId(){
+      
+    //   this.afreshData(this.queryParams.corpId)
+    //   this.getList();
+    //  },
+    
+    /**
+     * 重新获取 部分数据
+     */
+    afreshData(value){
+
+      this.resetSearchQueryTag()
+      this.queryTagParams.corpId=value;
+
+    },
+
+    resetSearchQueryTag(){
+
+      this.queryTagParams= {
+        pageNum: 1,
+        pageSize: 5,
+        total:0,
+        name:null,
+      };
+    },
+
+    //选择的标签页
+    handleClick(tab, event) {
+      this.queryParams.type=tab.name
+      this.getList();
+    },
+    //选择群聊弹窗
+    handleGroupChatList(item,index){
+      this.groupChart.title="选择群聊"
+        setTimeout(() => {
+                  this.$refs.GroupChat.getDetails(this.queryParams.corpId);
+             }, 1);
+      this.groupChart.open=true;
+      this.groupChart.index=index
+    },
+
+    //选择群聊赋值
+    selectGroupChatList(list,index){
+
+      this.groupChart.open=false;
+
+      // 如果 this.groupChatList[index] 不存在,则初始化为一个空数组
+      if (!this.groupChatList[index]) {
+        this.$set(this.groupChatList, index, []);
+      }
+
+      // 获取当前 groupChatList[index] 中的值
+      let currentList = this.groupChatList[index];
+
+      // 遍历 list 中的每个值
+      list.forEach(item => {
+        let itemIndex = currentList.findIndex(currentItem => currentItem.chatId === item.chatId);
+
+        if (itemIndex !== -1) {
+          // 如果当前 item 在 currentList 中已经存在,则不管
+        } else {
+          // 如果当前 item 不在 currentList 中,则插入
+          currentList.push(item);
+        }
+      });
+
+      // 更新 groupChatList[index]
+      this.$set(this.groupChatList, index, currentList);
+    },
+
+    //删除一些选择了的群聊
+    handleClosegroupChat(list,index){
+
+      // 假设 list 对象具有一个 id 属性
+      const ls = this.groupChatList[index].findIndex(t => t.chatId === list.chatId);
+      if (ls !== -1) {
+        this.groupChatList[index].splice(ls, 1);
+      }
+    },
+
+    //选择标签弹窗
+    handleChangeTags(item,index){
+
+      for (let i = 0; i < this.tagGroupList.length; i++) {
+        for (let x = 0; x < this.tagGroupList[i].tag.length; x++) {
+          this.tagGroupList[i].tag[x].isSelected=false;
+        }
+      }
+
+      this.tagChange.open=true;
+      this.tagChange.index=index;
+
+    },
+
+    handleSearchTags(){
+
+      if (!this.queryTagParams.name){
+        return this.$message.error("请输入要搜索的标签")
+      }
+
+      this.queryTagParams.corpId=this.queryParams.corpId;
+      searchTags(this.queryTagParams).then(response => {
+        this.tagGroupList = response.rows;
+        this.tagTotal = response.total;
+      });
+
+    },
+
+    getPageListTagGroup(){
+
+      this.queryTagParams.corpId=this.queryParams.corpId;
+
+      allListTagGroup(this.queryTagParams).then(response => {
+        this.tagGroupList = response.rows;
+        this.tagTotal = response.total;
+      });
+    },
+
+
+    cancelSearchTags(){
+      this.afreshData(this.queryParams.corpId)
+    },
+    //标签的选择
+    tagSelection(row){
+      row.isSelected= !row.isSelected;
+      this.$forceUpdate();
+    },
+
+    //选择标签
+    addTagSubmitForm(index){
+
+      for (let i = 0; i < this.tagGroupList.length; i++) {
+        for (let x = 0; x < this.tagGroupList[i].tag.length; x++) {
+          if (this.tagGroupList[i].tag[x].isSelected === true) {
+            if (!this.tagListFormIndex[index]) {
+              this.$set(this.tagListFormIndex, index, []);
+            }
+
+            // 检查当前 tag 是否已经存在于 tagListFormIndex[index] 中
+            let tagExists = this.tagListFormIndex[index].some(
+              tag => tag.id === this.tagGroupList[i].tag[x].id
+            );
+
+            // 如果 tag 不存在于 tagListFormIndex[index] 中,则新增
+            if (!tagExists) {
+              this.tagListFormIndex[index].push(this.tagGroupList[i].tag[x]);
+            }
+          }
+        }
+      }
+      if (!this.tagListFormIndex[index] || this.tagListFormIndex[index].length === 0) {
+        return this.$message('请选择标签');
+      }
+
+      this.tagChange.open = false;
+    },
+
+    //取消选择标签
+    addTagCancel(index){
+      this.tagChange.open = false;
+      this.tagListFormIndex[index]=[];
+    },
+    //删除一些已经选择了的标签
+    handleCloseTag(list,index){
+
+      // 假设 list 对象具有一个 id 属性
+      const ls = this.tagListFormIndex[index].findIndex(t => t.tagId === list.tagId);
+      if (ls !== -1) {
+        this.tagListFormIndex[index].splice(ls, 1);
+        // 使用 Vue.set 方法
+        this.$set(this.tagListFormIndex, index, [...this.tagListFormIndex[index]]);
+      }
+    },
+
+    //删除某一个规则
+    delItemList(index){
+      this.form.rulesTags.splice(index,1)
+      this.tagListFormIndex.splice(index,1)
+      this.groupChatList.splice(index,1)
+    },
+
+    //添加规则
+    addItemList(){
+      if (this.form.rulesTags.length >=5) {
+        return this.$message.error('当前规则已达上限,无法添加规则');
+      }
+      this.form.rulesTags.push({rules:[],tags:[]})
+    },
+
+
+    /** 查询自动打标签主列表 */
+    getList() {
+      this.loading = true;
+      listTags(this.queryParams).then(response => {
+
+        this.groupIndexList = response.rows;
+
+        this.total = response.total;
+        this.loading = false;
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        id: null,
+        type: 2,
+        createName: null,
+        applyUsers: null,
+        ruleName: null,
+        rulesTags: [{rules:[],tags:[]}],
+        totalNumTags: null,
+        numTagsTaday: null,
+        isApply: 1,
+        createTime: null,
+        companyId: null
+      };
+      //选择的群
+      this.groupChatList=[];
+
+      //选择的标签
+      this.tagListFormIndex=[];
+
+      //规则
+      this.form.rulesTags=[{rules:[],tags:[]}];
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.queryParams.corpId= this.myQwCompanyList[0].dictValue
+      this.afreshData(this.queryParams.corpId)
+      this.handleQuery();
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset();
+      this.open = true;
+      this.title = "添加规则";
+
+
+      this.getPageListTagGroup();
+
+      //所有的标签
+      listTag({corpId:this.queryParams.corpId}).then(response => {
+        this.tagList = response.rows;
+      });
+
+    },
+    handleAddThree(){
+
+    },
+
+    /** 详情按钮操作 */
+    handleDetails(row) {
+
+      this.reset();
+
+      // 深拷贝表单数据
+      const requestData = { ...row };
+      // 将 `数据` 转为 JSON
+      requestData.rulesTags = JSON.parse(row.rulesTags);
+
+      this.detailListFrom = requestData;
+      this.detailFrom.open=true;
+      this.detailFrom.title='规则详情';
+
+
+    },
+    /** 提交按钮 */
+    submitForm() {
+
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          this.form.corpId=this.queryParams.corpId;
+          const itemForms = this.$refs.rulesTagsFrom;
+          if (Array.isArray(itemForms)) {
+            let allValid = true;
+
+            itemForms.forEach((itemFormRef, index) => {
+              itemFormRef.validate((itemValid) => {
+                allValid = itemValid;
+
+                if (index === itemForms.length - 1 && allValid) {
+                  //全表单验证通过
+                  this.commitForm();
+                }
+              });
+            });
+          }
+        }
+
+
+      });
+
+    },
+
+    //提交form表单
+    commitForm(){
+
+      // 深拷贝表单数据
+      const requestData = { ...this.form };
+      // 将 `form.rulesTags` 转为 JSON 字符串
+      requestData.rulesTags = JSON.stringify(this.form.rulesTags);
+        requestData.corpId=this.queryParams.corpId;
+        requestData.companyId = this.queryParams.companyId;
+      if (this.form.id != null) {
+        updateTags(requestData).then(response => {
+          this.msgSuccess("修改成功");
+          this.open = false;
+          this.getList();
+        });
+      } else {
+        addTags(requestData).then(response => {
+          this.msgSuccess("新增成功");
+          this.open = false;
+          this.getList();
+        });
+      }
+    },
+
+    //状态开关
+    switchChange(row){
+      updateTags(row).then(response => {
+        this.msgSuccess("修改成功");
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const ids = row.id || this.ids;
+      this.$confirm('是否确认删除自动打标签规则名称为【' + row.ruleName + '】的数据项?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(function() {
+          return delTags(ids);
+        }).then(() => {
+          this.getList();
+          this.msgSuccess("删除成功");
+        }).catch(() => {});
+    },
+
+  }
+};
+</script>
+<style scoped>
+/* CSS 样式 */
+.tag-container {
+  display: flex;
+  flex-wrap: wrap; /* 超出宽度时自动换行 */
+  gap: 8px; /* 设置标签之间的间距 */
+}
+.name-background {
+  display: inline-block;
+  background-color: #abece6; /* 背景颜色 */
+  padding: 4px 8px; /* 调整内边距,让背景包裹文字 */
+  border-radius: 4px; /* 可选:设置圆角 */
+}
+.tag-box {
+  padding: 8px 12px;
+  border: 1px solid #989797;
+  border-radius: 4px;
+  cursor: pointer;
+  display: inline-block;
+}
+
+.tag-selected {
+  background-color: #00bc98;
+  color: #fff;
+  border-color: #00bc98;
+}
+
+.el-tag + .el-tag {
+  margin-left: 10px;
+}
+.button-new-tag {
+  margin-left: 10px;
+  height: 32px;
+  line-height: 30px;
+  padding-top: 0;
+  padding-bottom: 0;
+}
+.input-new-tag {
+  width: 90px;
+  margin-left: 10px;
+  vertical-align: bottom;
+}
+.text-container {
+  max-height: 5em; /* 设置最大高度为6行,根据字体大小调整 */
+  overflow-y: auto; /* 内容超出时显示滚动条 */
+  line-height: 1.5em; /* 行高设置,确保每行高度一致 */
+}
+/* 新增的滚动容器样式(不影响原有样式) */
+.scroll-wrapper {
+  max-height: 130px; /* 大约三行的高度 */
+  overflow-y: auto;  /* 垂直滚动 */
+  padding-right: 5px; /* 为滚动条留出空间 */
+}
+
+/* 美化滚动条(可选) */
+.scroll-wrapper::-webkit-scrollbar {
+  width: 6px;
+}
+.scroll-wrapper::-webkit-scrollbar-thumb {
+  background: rgba(0, 0, 0, 0.2);
+  border-radius: 3px;
+}
+</style>

+ 440 - 0
src/views/qw/autoTags/groupIndexDetails.vue

@@ -0,0 +1,440 @@
+<template>
+  <div style="background-color:  rgb(240 242 245)">
+    <div style="display: flex;flex-wrap: nowrap;background-color: rgb(240 242 245);height: 350px;">
+      <div style="background-color: #FFFFFF;width: 100%" class="app-container">
+<!--        <span style="font-size: 15px">基础信息</span>-->
+<!--        <el-divider></el-divider>-->
+        <div  class="desct">
+          基础信息
+        </div>
+        <div style="display: flex;flex-wrap: nowrap">
+          <div style="width: 400px">
+            <el-descriptions :column="1" size="medium" >
+              <el-descriptions-item label="规则名称:">
+                <span>{{groupIndexFrom.ruleName}}</span>
+              </el-descriptions-item>
+              <el-descriptions-item label="打标签方式:">
+                <span>客户入群打标签</span>
+              </el-descriptions-item>
+              <el-descriptions-item label="创建者:">
+                <span>{{groupIndexFrom.createName}}</span>
+              </el-descriptions-item>
+              <el-descriptions-item label="创建时间:">{{groupIndexFrom.createTime}}</el-descriptions-item>
+              <el-descriptions-item label="规则状态:">
+                <el-switch
+                  v-model="groupIndexFrom.isApply"
+                  active-color="#13ce66"
+                  inactive-color="#ff4949"
+                  active-value="1"
+                  inactive-value="2"
+                  disabled>
+                </el-switch>
+                <span v-if="groupIndexFrom.isApply == '1'" style="margin-left: 10px;color: #13ce66">已启用</span>
+                <span v-if="groupIndexFrom.isApply == '2'" style="margin-left: 10px;color: #ff4949">已关闭</span>
+              </el-descriptions-item>
+            </el-descriptions>
+          </div>
+          <div style="background-color: #fbfbfb;padding: 10px;  border: 1px solid #e6e6e6; margin-bottom: 20px;;width: 100%;height: 220px;overflow:auto">
+            <div >
+              <span class="spanSize">规则设置:共 {{groupIndexFrom.rulesTags.length}} 条规则</span>
+              <div v-for="(rtList,index) in groupIndexFrom.rulesTags">
+                <div style="margin-left: 10%;margin-top: 1%">
+                  <span class="spanSize">|规则 {{index +1}} </span>
+                  <div class="spanSize">用户加入群聊
+                    <span v-for="chatId in rtList.rules" :key="chatId" style="display: inline;">
+                      <el-tag :disable-transitions="false"  v-for="list in groupChatList" :key="list.chatId" style="margin: 3px;" v-if="list.chatId==chatId">{{list.name}}</el-tag>
+                    </span>
+                      时,打上标签
+                    <span v-for="tagId in rtList.tags" :key="tagId" style="display: inline;">
+                      <el-tag :disable-transitions="false"  v-for="list in tagList" :key="list.id" style="margin: 3px;" v-if="list.tagId==tagId">{{list.name}}</el-tag>
+                    </span>
+                  </div>
+                </div>
+
+              </div>
+            </div >
+          </div>
+        </div>
+      </div>
+    </div>
+
+
+    <div class="contentx">
+      <div class="desct">
+        数据分析
+      </div>
+      <div class="statistics-container">
+        <el-row :gutter="20" type="flex">
+          <el-col :span="6"  >
+            <el-card style="height: 100px">
+              <div class="statistic-item">
+                <h2>{{ groupIndexFrom.totalNumTagsCount }} </h2>
+                <p>打标签总数</p>
+              </div>
+            </el-card>
+          </el-col>
+          <el-col :span="6" >
+            <el-card style="height: 100px">
+              <div class="statistic-item">
+                <h2>{{ groupIndexFrom.numTagsTadayCount }} </h2>
+                <p>今日打标签数</p>
+              </div>
+            </el-card>
+          </el-col>
+        </el-row>
+      </div>
+    </div>
+
+    <div  style="background-color:  rgb(240 242 245);padding-bottom: 15px">
+        <div style="margin: 15px;  padding:15px;  background-color: #fff;">
+          <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="120px">
+            <el-form-item label="所属员工" prop="qwUserid">
+              <el-input
+                v-model="queryParams.qwUserid"
+                placeholder="请输入所属员工名称"
+                clearable
+                size="small"
+                @keyup.enter.native="handleQuery"
+              />
+            </el-form-item>
+            <el-form-item label="搜索客户" prop="externalUserId">
+              <el-input
+                v-model="queryParams.externalUserId"
+                placeholder="请输入客户名称"
+                clearable
+                size="small"
+                @keyup.enter.native="handleQuery"
+              />
+            </el-form-item>
+            <el-form-item label="加入群聊时间" prop="addTime">
+              <el-date-picker
+                v-model="queryParams.addTime"
+                type="daterange"
+                align="right"
+                unlink-panels
+                range-separator="至"
+                start-placeholder="开始日期"
+                end-placeholder="结束日期"
+                :picker-options="pickerOptions"
+                :default-time="['00:00:00', '23:59:59']">
+              </el-date-picker>
+            </el-form-item>
+            <el-form-item label="群聊名称" prop="chatId">
+              <el-input
+                v-model="queryParams.chatId"
+                placeholder="请输入群聊"
+                clearable
+                size="small"
+                @keyup.enter.native="handleQuery"
+              />
+            </el-form-item>
+
+            <el-form-item>
+              <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+              <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+            </el-form-item>
+          </el-form>
+          <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+
+          <el-table v-loading="loading" :data="autoTagsLogsList">
+            <el-table-column label="客户名称" align="center" prop="externalUserName" />
+            <el-table-column label="所属员工" align="center" prop="qwUsername" />
+            <el-table-column label="添加的标签" align="center" prop="effectiveRules" >
+              <template slot-scope="scope">
+                   <span v-for="tagId in JSON.parse(scope.row.effectiveRules)" :key="tagId" style="display: inline;">
+                    <el-tag :disable-transitions="false"  v-for="list in tagList" :key="list.id" style="margin: 3px;" v-if="list.tagId==tagId">{{list.name}}</el-tag>
+                  </span>
+              </template>
+            </el-table-column>
+            <el-table-column label="加入的群聊" align="center" prop="chatName" >
+            </el-table-column>
+            <el-table-column label="入群方式" align="center" prop="joinScene" >
+              <template slot-scope="scope">
+                <span v-for="(item,index) in groupChatUserScene" v-if="scope.row.joinScene==item.dictValue">{{item.dictLabel}}</span>
+              </template>
+            </el-table-column>
+            <el-table-column label="加入群聊时间" align="center" prop="addTime" width="180"/>
+            <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+              <template slot-scope="scope">
+
+                <el-button v-if="scope.row.customerId"
+                           size="mini"
+                           type="text"
+                           icon="el-icon-paperclip"
+                           @click="handleShow(scope.row)"
+                >查看客户</el-button>
+                <el-tag  v-else type="danger"  size="mini">未绑定CRM客户</el-tag>
+              </template>
+            </el-table-column>
+          </el-table>
+
+          <pagination
+            v-show="total>0"
+            :total="total"
+            :page.sync="queryParams.pageNum"
+            :limit.sync="queryParams.pageSize"
+            @pagination="getList"
+          />
+
+        </div>
+      </div>
+
+    <!-- <el-drawer size="75%" :title="show.title" :visible.sync="show.open" append-to-body>
+      <customer-details  ref="customerDetails" />
+    </el-drawer> -->
+
+    </div>
+
+
+</template>
+
+<script>
+import { listAutoTagsLogs, exportAutoTagsLogs } from "@/api/qw/autoTagsLogs";
+// import CustomerGroupDetails from '@/views/qw/groupMsg/customerGroupDetails.vue'
+import { listTag } from '@/api/qw/tag'
+import { listGroupChat } from '@/api/qw/groupChat'
+// import customerDetails from '@/views/qw/externalContact/customerDetails.vue'
+
+export default {
+  name: "AutoTagsLogs",
+  // components: { CustomerGroupDetails ,customerDetails},
+  props:{
+    groupIndexFrom:{},
+  },
+  watch:{
+    groupIndexFrom:{
+      handler(newVal){
+        //当表单发生变化时
+        // this.groupIndexList=newVal;
+        // console.log("this.groupIndexList",this.groupIndexList)
+        this.getList(newVal.id)
+      },
+      deep:true
+    }
+  },
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 导出遮罩层
+      exportLoading: false,
+
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 自动打标签的日志表格数据
+      autoTagsLogsList: [],
+
+      //入群方式
+      groupChatUserScene:[],
+
+      //所有的标签
+      tagList:[],
+
+      //所有的群
+      groupChatList:[],
+
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        autoTagId: null,
+        type: 2,
+        qwUserid: null,
+        externalUserId: null,
+        effectiveRules: null,
+        addTime: [],
+        chatId: null,
+        joinScene: null,
+        companyId: null
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+      },
+      show:{
+        title:"客户详情",
+        open:false,
+      },
+      //日期快捷选择
+      pickerOptions: {
+        shortcuts: [
+          {
+            text: '最近三天',
+            onClick(picker) {
+              const end = new Date();
+              end.setHours(23, 59, 59, 999);
+              const start = new Date();
+              start.setTime(start.getTime() - 3600 * 1000 * 24 * 3);
+              start.setHours(0, 0, 0, 0);
+              picker.$emit('pick', [start, end]);
+            }
+          },{
+            text: '最近一周',
+            onClick(picker) {
+              const end = new Date();
+              end.setHours(23, 59, 59, 999);
+              const start = new Date();
+              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
+              start.setHours(0, 0, 0, 0);
+              picker.$emit('pick', [start, end]);
+            }
+          }, {
+            text: '最近一个月',
+            onClick(picker) {
+              const end = new Date();
+              end.setHours(23, 59, 59, 999);
+              const start = new Date();
+              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
+              start.setHours(0, 0, 0, 0);
+              picker.$emit('pick', [start, end]);
+            }
+          }, {
+            text: '最近三个月',
+            onClick(picker) {
+              const end = new Date();
+              end.setHours(23, 59, 59, 999);
+              const start = new Date();
+              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
+              start.setHours(0, 0, 0, 0);
+              picker.$emit('pick', [start, end]);
+            }
+          }]
+      },
+    };
+  },
+  created() {
+
+    //所有的标签
+    listTag().then(response => {
+      this.tagList = response.rows;
+    });
+    //查询所有的群列表
+    listGroupChat().then(res=>{
+      this.groupChatList=res.rows
+    })
+
+    //入群方式字典
+    this.getDicts("sys_qw_groupChat_user_scene").then(response => {
+      this.groupChatUserScene = response.data;
+    });
+
+    this.getList(this.groupIndexFrom);
+  },
+  methods: {
+    /** 查询自动打标签的日志列表 */
+    getList() {
+      this.queryParams.autoTagId = this.groupIndexFrom.id;
+      this.loading = true;
+      listAutoTagsLogs(this.queryParams).then(response => {
+
+        this.autoTagsLogsList = response.rows;
+
+        this.total = response.total;
+        this.loading = false;
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        id: null,
+        autoTagId: null,
+        type: 2,
+        qwUserid: null,
+        externalUserId: null,
+        effectiveRules: null,
+        addTime: [],
+        chatId: null,
+        joinScene: null,
+        companyId: null
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    /** 查看客户详情 */
+    handleShow(row){
+      this.show.open=true;
+      this.loading=false;
+      var that=this;
+      const tab = "visit";
+      setTimeout(() => {
+        // that.$refs.customerDetails.getDetails(row.customerId);
+        // that.$refs.customerDetails.handleClick(tab);
+
+      }, 200);
+    },
+
+    /** 导出按钮操作 */
+    handleExport() {
+      const queryParams = this.queryParams;
+      this.$confirm('是否确认导出所有自动打标签的日志数据项?', "警告", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      }).then(() => {
+        this.exportLoading = true;
+        return exportAutoTagsLogs(queryParams);
+      }).then(response => {
+        this.download(response.msg);
+        this.exportLoading = false;
+      }).catch(() => {});
+    }
+  }
+};
+</script>
+<style scoped>
+.desct{
+  padding-top: 20px;
+  padding-bottom: 20px;
+  color: #524b4a;
+  font-weight: bold;
+}
+.contentx{
+  height: 100%;
+  background-color: #fff;
+  padding: 0px 20px 20px;
+  margin:0 15px;
+}
+.spanSize{
+  font-size: 15px;
+  font-weight: normal;
+}
+.statistics-container {
+  padding: 0 20px;
+}
+.statistic-item {
+  text-align: center;
+  margin-top: 5%;
+}
+.statistic-item h2 {
+  font-size: 15px;
+  margin: 0;
+  font-weight: normal;
+}
+.statistic-item p {
+  margin: 5px 0 0;
+  font-size: 15px;
+  color: #666;
+  font-weight: normal;
+}
+</style>

+ 308 - 0
src/views/qw/autoTags/keyWordIndex.vue

@@ -0,0 +1,308 @@
+<template>
+    <div>
+
+      <el-table v-loading="loading" :data="tagsList" @selection-change="handleSelectionChange">
+        <el-table-column label="创建人" align="center" prop="createName" />
+        <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+          <template slot-scope="scope">
+            <el-button
+              size="mini"
+              type="text"
+              icon="el-icon-edit"
+              @click="handleUpdate(scope.row)"
+              v-hasPermi="['shop:tags:edit']"
+            >修改</el-button>
+            <el-button
+              size="mini"
+              type="text"
+              icon="el-icon-delete"
+              @click="handleDelete(scope.row)"
+              v-hasPermi="['shop:tags:remove']"
+            >删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <pagination
+        v-show="total>0"
+        :total="total"
+        :page.sync="queryParams.pageNum"
+        :limit.sync="queryParams.pageSize"
+        @pagination="getList"
+      />
+
+      <!-- 添加或修改自动打标签主对话框 -->
+      <el-dialog :title="title" :visible.sync="open" width="1000px" append-to-body>
+        <el-form v-if="form.type==='2'" ref="form" :model="form" :rules="rules" label-position="left"  label-width="120px">
+          <div class="app-container">
+            <div>
+              <span style="font-size: 15px">规则基础信息</span>
+              <el-divider></el-divider>
+            </div>
+            <el-alert
+              title="根据规则,当客户在设定时间段内成为企业微信客户,将自动被打上标签"
+              type="warning"
+              style="font-size: 15px;margin-bottom: 2%;"
+              :closable="false"
+              show-icon>
+            </el-alert>
+            <el-form-item label="规则名称:" prop="ruleName" style="width: 400px">
+              <el-input v-model="form.ruleName" placeholder="请输入规则名称(内部可见)" />
+            </el-form-item>
+
+            <div style="margin-top: 5%">
+              <span style="font-size: 15px">设置打标签的规则</span>
+              <el-divider></el-divider>
+            </div>
+            <div style="background-color: #fbfbfb;padding: 10px;  border: 1px solid #e6e6e6; margin-bottom: 20px;">
+              <el-form ref="from"  :rules="rules" :model="form">
+                <div style="display: flex; gap: 10px;">
+                </div>
+              </el-form>
+            </div>
+
+          </div>
+        </el-form>
+        <el-form v-if="form.type==='3'" ref="form" :model="form" :rules="rules" label-width="80px">
+
+          <el-form-item label="规则名称" prop="ruleName">
+            <el-input v-model="form.ruleName" placeholder="请输入规则名称" />
+          </el-form-item>
+          <el-form-item label="生效成员:" prop="applyUsers">
+            <div>
+              <el-button
+                size="mini"
+                icon="el-icon-circle-plus-outline"
+                plain
+                @click="handlelistUser">请选择使用成员</el-button>
+            </div>
+            <div>
+              <el-tag
+                style="margin-left: 5px"
+                size="medium"
+                :key="list.id"
+                v-for="list in userSelectList"
+                closable
+                :disable-transitions="false"
+                @close="handleClosegroupUser(list)">
+                {{list.nickName}}
+              </el-tag>
+            </div>
+          </el-form-item>
+          <el-form-item label="打标签总数" prop="totalNumTags">
+            <el-input v-model="form.totalNumTags" placeholder="请输入打标签总数" />
+          </el-form-item>
+          <el-form-item label="今日打标签数" prop="numTagsTaday">
+            <el-input v-model="form.numTagsTaday" placeholder="请输入今日打标签数" />
+          </el-form-item>
+          <el-form-item label="是否运用规则状态 1启用 2停用" prop="isApply">
+            <el-input v-model="form.isApply" placeholder="请输入是否运用规则状态 1启用 2停用" />
+          </el-form-item>
+          <el-form-item label="公司id" prop="companyId">
+            <el-input v-model="form.companyId" placeholder="请输入公司id" />
+          </el-form-item>
+        </el-form>
+        <div slot="footer" class="dialog-footer">
+          <el-button type="primary" @click="submitForm">确 定</el-button>
+          <el-button @click="cancel">取 消</el-button>
+        </div>
+      </el-dialog>
+
+    <!-- 选择成员账号弹窗   -->
+    <el-dialog :title="listUser.title" :visible.sync="listUser.open" style="width: 1600px;height: 100%" append-to-body>
+      <qwUserList ref="QwUserList" @selectUserList="selectUserList"></qwUserList>
+    </el-dialog>
+  </div>
+
+</template>
+
+<script>
+import { listTags, getTags, delTags, addTags, updateTags, exportTags } from "@/api/qw/autoTags";
+import qwUserList from '@/views/qw/user/qwUserList.vue'
+
+export default {
+  name: "autoTags",
+  components: { qwUserList },
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 导出遮罩层
+      exportLoading: false,
+      activeName:'2',
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 自动打标签主表格数据
+      tagsList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+
+      //选择成员列表
+      listUser:{
+        title:"",
+        open:false
+      },
+      //选择成员列表
+      userSelectList:[],
+
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        type: null,
+        createName: null,
+        applyUsers: null,
+        ruleName: null,
+        rulesTags: null,
+        totalNumTags: null,
+        numTagsTaday: null,
+        isApply: null,
+        companyId: null
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+        ruleName:[{ required: true, message: "规则名称不能为空", trigger: "blur" }],
+      }
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    //选择的标签页
+    handleClick(tab, event) {
+      this.queryParams.type=tab.name
+      this.getList();
+    },
+
+    //选择群发的企业成员账号
+    handlelistUser(){
+      this.listUser.title="选择企业成员"
+      this.listUser.open=true;
+    },
+    //选择的成员账号列表
+    selectUserList(list){
+
+      this.listUser.open=false;
+      //用于显示
+      this.userSelectList=list;
+
+    },
+    //删除一些选择了的账号
+    handleClosegroupUser(list){
+
+      // 假设 list 对象具有一个 id 属性
+      const index = this.userSelectList.findIndex(t => t.id === list.id);
+      if (index !== -1) {
+        this.userSelectList.splice(index, 1);
+      }
+    },
+
+    /** 查询自动打标签主列表 */
+    getList() {
+      this.loading = true;
+      listTags(this.queryParams).then(response => {
+        this.tagsList = response.rows;
+        this.total = response.total;
+        this.loading = false;
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        id: null,
+        type: null,
+        createName: null,
+        applyUsers: null,
+        ruleName: null,
+        rulesTags: [{rules:[],tags:[]}],
+        totalNumTags: null,
+        numTagsTaday: null,
+        isApply: null,
+        createTime: null,
+        companyId: null
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.id)
+      this.single = selection.length!==1
+      this.multiple = !selection.length
+    },
+    /** 新增按钮操作 */
+    handleAdd(row) {
+      this.reset();
+      this.form.type=row
+      this.open = true;
+      this.title = "添加规则";
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset();
+      const id = row.id || this.ids
+      getTags(id).then(response => {
+        this.form = response.data;
+        this.open = true;
+        this.title = "修改自动打标签主";
+      });
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          if (this.form.id != null) {
+            updateTags(this.form).then(response => {
+              this.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            });
+          } else {
+            addTags(this.form).then(response => {
+              this.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            });
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const ids = row.id || this.ids;
+      this.$confirm('是否确认删除自动打标签主编号为"' + ids + '"的数据项?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(function() {
+          return delTags(ids);
+        }).then(() => {
+          this.getList();
+          this.msgSuccess("删除成功");
+        }).catch(() => {});
+    },
+
+  }
+};
+</script>

+ 355 - 0
src/views/qw/groupMsg/customerGroupDetails.vue

@@ -0,0 +1,355 @@
+<template>
+  <div style="background-color: #fff;margin: 15px">
+    <el-card class="box-card">
+      <div  class="desct">
+        数据统计
+      </div>
+      <div class="statistics-container">
+        <el-row :gutter="20" type="flex" justify="space-between">
+          <el-col :span="6" v-for="(item, index) in CountGroupMsgUserList" :key="index">
+            <el-card style="height: 100px">
+              <div class="statistic-item">
+                <h2>{{ item.count }} </h2>
+                <p>{{ item.label }}</p>
+              </div>
+            </el-card>
+          </el-col>
+        </el-row>
+      </div>
+    </el-card>
+
+    <el-card class="box-card" style="margin-top: 10px">
+      <div style="margin-bottom: 2%">
+            <div class="desct">
+              发送接收详情
+            </div>
+            <el-alert
+              title="注意事项"
+              type="warning"
+              description="1、因企业微信接口限制,提醒成员完成群发任务,24小时内每个群发最多触发三次提醒,多点无效噢。2、成员选择客户发送之后,未选择的客户不能再次选择发送了"
+              :closable="false"
+              show-icon>
+            </el-alert>
+          </div>
+          <div>
+            <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="120px">
+              <el-form-item label="成员姓名" prop="nickName">
+                <el-input
+                  v-model="queryParams.nickName"
+                  placeholder="请输入想查询的成员姓名"
+                  clearable
+                  size="small"
+                  @keyup.enter.native="handleQuery"
+                />
+              </el-form-item>
+              <el-form-item label="客户名称" prop="name">
+                <el-input
+                  v-model="queryParams.name"
+                  placeholder="请输入想查询的客户姓名"
+                  clearable
+                  size="small"
+                  @keyup.enter.native="handleQuery"
+                />
+              </el-form-item>
+              <el-form-item label="成员发送状态" prop="status">
+                 <el-select v-model="queryParams.status" placeholder="请选择员工发送状态" >
+                   <el-option v-for="item in groupMsgStatusOptions"
+                              :key="item.dictValue"
+                              :label="item.dictLabel"
+                              :value="item.dictValue">
+                   </el-option>
+                 </el-select>
+              </el-form-item>
+
+              <el-form-item label="客户接收状态" prop="sendStatus">
+                  <el-select v-model="queryParams.sendStatus" placeholder="请选择客户接收状态">
+                    <el-option v-for="item in groupMsgSendStatusOptions"
+                               :key="item.dictValue"
+                               :label="item.dictLabel"
+                               :value="item.dictValue">
+
+                    </el-option>
+                  </el-select>
+              </el-form-item>
+              <el-form-item>
+                <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+                <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置/刷新页面</el-button>
+                <el-button type="warning" icon="el-icon-message-solid" size="mini" @click="triggerRemindGroupMsg">提醒成员发送</el-button>
+                <el-button type="primary" icon="el-icon-refresh" size="mini" plain @click="refreshResults">刷新/获取企微结果</el-button>
+              </el-form-item>
+            </el-form>
+
+            <el-table v-loading="loading" :data="groupMsgUserDetailsList">
+              <el-table-column label="销售" align="center" prop="nickName" />
+              <el-table-column label="成员企微昵称" align="center" prop="qwUserName" />
+              <el-table-column label="成员发送状态" align="center" prop="status">
+                <template slot-scope="scope">
+                  <dict-tag :options="groupMsgStatusOptions" :value="scope.row.status"/>
+                </template>
+              </el-table-column>
+              <el-table-column label="客户" align="center" prop="name" >
+                <template slot-scope="scope">
+                  <el-image
+                    v-if="scope.row.avatar"
+                    style="width: 20px; height: 20px"
+                    :src="scope.row.avatar"
+                    fit="contain"
+                    @click="openImageViewer(scope.row.avatar)"
+                    />
+                  <span>{{scope.row.name}}</span>
+                </template>
+              </el-table-column>
+              <el-table-column label="客户接收状态" align="center" prop="sendStatus" >
+                <template slot-scope="scope">
+                  <dict-tag :options="groupMsgSendStatusOptions" :value="scope.row.sendStatus"/>
+                </template>
+              </el-table-column>
+            </el-table>
+          </div>
+
+      <pagination
+        v-show="total>0"
+        :total="total"
+        :page.sync="queryParams.pageNum"
+        :limit.sync="queryParams.pageSize"
+        @pagination="getUserList"
+      />
+
+    </el-card>
+
+    <!-- 大图预览对话框 -->
+    <el-dialog
+      :visible.sync="dialogVisible"
+      :modal="false"
+      width="1200px"
+      append-to-body>
+      <img
+        :src="this.dialogImageUrl"
+        style="display: block; max-width: 100%; margin: 0 auto"
+      />
+    </el-dialog>
+  </div>
+</template>
+<script>
+
+import { countGroupMsgUser, CountGroupMsgUserDetails, remindGroupMsg } from '@/api/qw/groupMsg'
+import { refreshResultsMsgUser } from '@/api/qw/groupMsgUser'
+
+export default {
+  name: "Customer-group-details",
+  components:{},
+
+  props:{
+    rowDetailFrom:{},
+  },
+
+  watch:{
+    rowDetailFrom:{
+      handler(newVal){
+        // 当formData变化时重新查询
+        this.getUserList(newVal);
+        this.getCountGroupMsgUser(newVal.groupMsgId)
+      },
+      deep: true
+    }
+  },
+  data() {
+    return {
+      //数据统计
+      CountGroupMsgUserList: [],
+
+      //成员详情
+      groupMsgUserDetailsList:[],
+
+      //成员发送状态
+      groupMsgStatusOptions:[],
+
+      //客户接收状态
+      groupMsgSendStatusOptions:[],
+
+
+      //放大图片
+      dialogImageUrl:null,
+      dialogVisible:false,
+
+      // 遮罩层
+      loading: true,
+      // 导出遮罩层
+      exportLoading: false,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+
+
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        qwMsgId:null,
+        msgId:null,
+        nickName:null,
+        name:null,
+        status:null,
+        sendStatus:null,
+        chatType:"single",
+
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+      },
+
+    };
+  },
+  created() {
+      this.getUserList(this.rowDetailFrom)
+      this.getCountGroupMsgUser(this.rowDetailFrom.id)
+
+    //成员发送状态
+    this.getDicts("sys_qw_groupMsg_status").then(response => {
+      this.groupMsgStatusOptions = response.data;
+    });
+
+    //客户接收状态
+    this.getDicts("sys_qw_groupMsg_SendStatus").then(response => {
+      this.groupMsgSendStatusOptions = response.data;
+    });
+
+
+  },
+
+
+  methods: {
+    //获取成员详细
+    getUserList(val){
+      this.queryParams.msgId = val.id || this.rowDetailFrom.id;
+
+      this.loading=false;
+      CountGroupMsgUserDetails(this.queryParams).then(res=>{
+            this.groupMsgUserDetailsList=res.rows
+            this.total = res.total;
+            this.loading = false;
+      })
+
+    },
+
+    /** 提醒成员群发 */
+    triggerRemindGroupMsg(){
+      this.queryParams.qwMsgId=this.rowDetailFrom.msgId
+      remindGroupMsg(this.queryParams).then(res=>{
+        if (res.code==200){
+
+          if (res.data.errcode==0){
+            return this.msgSuccess("提醒成员群发成功")
+          }else if (res.data.errcode==41094){
+            return this.msgWarning("此条记录的每日提醒次数超过限制了噢")
+          }else {
+            return this.msgError(res.data.errmsg)
+          }
+
+        }else {
+          return this.msgError(res.msg)
+        }
+
+      })
+    },
+
+    /** 刷新获取结果 */
+    refreshResults(){
+
+      let params = [];
+      this.loading = true;
+
+      //搞定定时任务导致的问题
+      let ResultsMsgUser={
+          id:this.rowDetailFrom.id,
+          msgId:this.rowDetailFrom.msgId,
+          chatType:this.rowDetailFrom.chatType,
+          timerResultType:1,
+          companyId:this.rowDetailFrom.companyId,
+          corpId:this.rowDetailFrom.corpId,
+      }
+
+      // 根据不同条件选择参数
+      if (this.groupMsgUserDetailsList == 0) {
+        params.push(ResultsMsgUser)
+      } else {
+        params = this.groupMsgUserDetailsList// 如果 `groupMsgUserDetailsList` 是一个对象
+      }
+
+      refreshResultsMsgUser(params).then(res=>{
+        this.loading=false;
+        if (res.code==200){
+          this.handleQuery();
+          return this.msgSuccess(res.msg)
+        }else {
+          this.handleQuery();
+          return this.msgError(res.msg)
+        }
+
+      })
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getUserList(this.rowDetailFrom);
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+
+    openImageViewer(url) {
+      // 打开大图预览对话框
+      this.dialogImageUrl=url
+      this.dialogVisible = true;
+    },
+    //数据详情
+    getCountGroupMsgUser(val){
+      countGroupMsgUser(val).then(res=>{
+        this.CountGroupMsgUserList=Object.keys(res.data).map(key=>{
+          return {label: key,count:res.data[key]}
+        })
+      })
+    },
+
+  }
+};
+</script>
+<style scoped>
+.desct{
+  padding-bottom: 20px;
+  color: #524b4a;
+  font-weight: bold;
+}
+.statistics-container {
+  padding: 20px;
+}
+.statistic-item {
+  text-align: center;
+}
+.statistic-item h2 {
+  font-size: 24px;
+  margin: 0;
+  font-weight: normal;
+}
+.statistic-item p {
+  margin: 5px 0 0;
+  color: #666;
+  font-weight: normal;
+}
+</style>