|
|
@@ -0,0 +1,1400 @@
|
|
|
+<template>
|
|
|
+ <div class="app-container">
|
|
|
+ <el-alert
|
|
|
+ title="注意事项"
|
|
|
+ type="warning"
|
|
|
+ :closable="false"
|
|
|
+ show-icon>
|
|
|
+ <template #title>
|
|
|
+ <span style="font-size: 20px; line-height: 1.5;">
|
|
|
+ 搜索【客户备注】【标签】【进线时间】 只能搜索/筛选出 【当前页】的数据）【可以用客户id来搜（客户id来源-》企微/我的企微客户-》列表的企微客户ID）】
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-alert>
|
|
|
+ <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="100px">
|
|
|
+ <!-- <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="externalUserName">
|
|
|
+ <el-input
|
|
|
+ v-model="queryParams.externalUserName"
|
|
|
+ placeholder="请输入客户名称"
|
|
|
+ clearable
|
|
|
+ size="small"
|
|
|
+ @keyup.enter.native="handleQuery"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="客户备注" prop="remark">
|
|
|
+ <el-input
|
|
|
+ v-model="queryParams.remark"
|
|
|
+ placeholder="请输入客户备注"
|
|
|
+ clearable
|
|
|
+ size="small"
|
|
|
+ @keyup.enter.native="handleQuery"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="客户id" prop="externalId">
|
|
|
+ <el-input
|
|
|
+ v-model="queryParams.externalId"
|
|
|
+ placeholder="请输入企微客户id"
|
|
|
+ clearable
|
|
|
+ size="small"
|
|
|
+ @keyup.enter.native="handleQuery"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+<!-- <el-form-item label="进线时间" prop="entryTime" v-if="queryParams.filterMode == 1">-->
|
|
|
+<!-- <el-date-picker clearable size="small"-->
|
|
|
+<!-- v-model="queryParams.entryTime"-->
|
|
|
+<!-- type="date"-->
|
|
|
+<!-- value-format="yyyy-MM-dd"-->
|
|
|
+<!-- placeholder="选择营期时间">-->
|
|
|
+<!-- </el-date-picker>-->
|
|
|
+<!-- </el-form-item>-->
|
|
|
+
|
|
|
+ <el-form-item label="进线时间" prop="entryTime" v-if="queryParams.filterMode == 1">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="scheduleEntryTime"
|
|
|
+ type="datetimerange"
|
|
|
+ size="small"
|
|
|
+ style="width: 350px"
|
|
|
+ value-format="yyyy-MM-dd HH:mm:ss"
|
|
|
+ range-separator="-"
|
|
|
+ start-placeholder="开始日期"
|
|
|
+ end-placeholder="结束日期"
|
|
|
+ @change="handleScheduleTimeChange">
|
|
|
+ </el-date-picker>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="标签" prop="tagIds">
|
|
|
+ <!-- <el-select v-model="selectTags" remote multiple placeholder="请选择" filterable style="width: 100%;">-->
|
|
|
+ <!-- <el-option-->
|
|
|
+ <!-- v-for="dict in tagList"-->
|
|
|
+ <!-- :label="dict.name"-->
|
|
|
+ <!-- :value="dict.tagId">-->
|
|
|
+ <!-- </el-option>-->
|
|
|
+ <!-- </el-select>-->
|
|
|
+
|
|
|
+ <div @click="hangleChangeTags()" style="cursor: pointer; border: 1px solid #e6e6e6; background-color: white; overflow: hidden; flex-grow: 1;width: 250px">
|
|
|
+ <div style="min-height: 35px; max-height: 200px; overflow-y: auto;">
|
|
|
+ <el-tag type="success"
|
|
|
+ closable
|
|
|
+ :disable-transitions="false"
|
|
|
+ v-for="list in this.selectTags"
|
|
|
+ :key="list.tagId"
|
|
|
+ @close="handleCloseTags(list)"
|
|
|
+ style="margin: 3px;"
|
|
|
+ >{{list.name}}
|
|
|
+ </el-tag>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </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-row :gutter="10" class="mb8" v-if="queryParams.filterMode == 1">
|
|
|
+ <el-col :span="1.5">
|
|
|
+ <el-button
|
|
|
+ type="warning"
|
|
|
+ icon="el-icon-s-promotion"
|
|
|
+ size="medium"
|
|
|
+ :disabled="multiple"
|
|
|
+ @click="handleSendMsg"
|
|
|
+ v-hasPermi="['qw:sopUserLogsInfo:msg']"
|
|
|
+ >一键群发</el-button>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="1.5">
|
|
|
+ <el-button
|
|
|
+ type="danger"
|
|
|
+ plain
|
|
|
+ icon="el-icon-delete"
|
|
|
+ size="medium"
|
|
|
+ :disabled="multiple"
|
|
|
+ @click="handleUpdate"
|
|
|
+ v-hasPermi="['qw:sopUserLogsInfo:edit']"
|
|
|
+ >批量修改客户营期</el-button>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <div style="color: #999;font-size: 14px;display: flex;align-items: center;margin-bottom: 5px" v-if="queryParams.filterMode == 1">
|
|
|
+ <i class="el-icon-info"></i>
|
|
|
+ 【一键群发】：用于给 选中的 客户 发送插件信息
|
|
|
+ </div>
|
|
|
+ <div style="color: #999;font-size: 14px;display: flex;align-items: center;margin-bottom: 5px" v-if="queryParams.filterMode == 1">
|
|
|
+ <i class="el-icon-info"></i>
|
|
|
+ 【批量修改客户营期】：选中 相应的客户 修改到 想进的相应的营期
|
|
|
+ </div>
|
|
|
+ <div style="color: #999;font-size: 14px;display: flex;align-items: center;margin-bottom: 5px" v-if="queryParams.filterMode == 1">
|
|
|
+ <i class="el-icon-info"></i>
|
|
|
+ 【官方群发许可】：只有这里显示为【是】的，才能通过模板中的 官方群发 来发送（允许条件是 客户点击过【非官方群发】发送的课程！）
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <el-table border v-loading="loading" :data="sopUserLogsInfoList" @selection-change="handleSelectionChange" v-if="queryParams.filterMode == 1">
|
|
|
+ <el-table-column type="selection" width="55" align="center" />
|
|
|
+ <el-table-column label="编号" align="center" prop="id" width="100"/>
|
|
|
+ <!-- <el-table-column label="企微员工账号" align="center" prop="qwUserId" width="100"/>-->
|
|
|
+ <el-table-column label="客户ID" align="center" prop="externalId" width="100"/>
|
|
|
+ <!-- <el-table-column label="客户小程序id" align="center" prop="fsUserId" width="100">-->
|
|
|
+ <!-- <template slot-scope="scope">-->
|
|
|
+ <!-- <el-tag type="success">-->
|
|
|
+ <!-- {{ scope.row.fsUserId === 0 || scope.row.fsUserId === null ? '无' : scope.row.fsUserId }}-->
|
|
|
+ <!-- </el-tag>-->
|
|
|
+ <!-- </template>-->
|
|
|
+ <!-- </el-table-column>-->
|
|
|
+ <el-table-column label="客户名称" align="center" prop="externalUserName" />
|
|
|
+ <el-table-column label="备注" align="center" prop="remark" />
|
|
|
+ <el-table-column label="客户标签" align="center" prop="tagIdsName" width="250px">
|
|
|
+ <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="inComTime" width="180"/>
|
|
|
+ <el-table-column label="添加日期" align="center" prop="createTime" width="180"/>
|
|
|
+ <el-table-column label="添加时间" align="center" prop="crtTime" width="180"/>
|
|
|
+ <el-table-column label="修改时间" align="center" prop="updateTime" width="180"/>
|
|
|
+ <!-- <el-table-column label="官方群发许可" align="center" prop="fsUserId" width="70">-->
|
|
|
+ <!-- <template slot-scope="scope">-->
|
|
|
+ <!-- <el-tag v-if="scope.row.fsUserId > 0" type="success">是</el-tag>-->
|
|
|
+ <!-- <el-tag v-else type="danger">否</el-tag>-->
|
|
|
+ <!-- </template>-->
|
|
|
+ <!-- </el-table-column>-->
|
|
|
+ <el-table-column label="官方群发许可" align="center" prop="fsUserId" width="70">
|
|
|
+ <!-- 表头提示 -->
|
|
|
+ <template slot="header">
|
|
|
+ <el-tooltip effect="dark" content="即点过小程序链接的,通过插件助手发过一次课,且客户观看了的" placement="top">
|
|
|
+ <span>官方群发许可</span>
|
|
|
+ </el-tooltip>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <!-- 单元格提示 -->
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-tooltip
|
|
|
+ effect="dark"
|
|
|
+ :content="`通过插件助手发过一次课,且客户观看了的`"
|
|
|
+ placement="top"
|
|
|
+ >
|
|
|
+ <el-tag v-if="scope.row.fsUserId > 0" type="success">是</el-tag>
|
|
|
+ <el-tag v-else type="danger">否</el-tag>
|
|
|
+ </el-tooltip>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="120" fixed="right">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <!-- <el-button-->
|
|
|
+ <!-- size="mini"-->
|
|
|
+ <!-- type="text"-->
|
|
|
+ <!-- icon="el-icon-edit"-->
|
|
|
+ <!-- @click="handleUpdate(scope.row)"-->
|
|
|
+ <!-- v-hasPermi="['qw:sopUserLogsInfo:edit']"-->
|
|
|
+ <!-- >修改客户营期</el-button>-->
|
|
|
+ <el-button
|
|
|
+ size="mini"
|
|
|
+ type="text"
|
|
|
+ icon="el-icon-delete"
|
|
|
+ @click="handleDelete(scope.row)"
|
|
|
+ v-hasPermi="['qw:sopUserLogsInfo:remove']"
|
|
|
+ >删除客户营期</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+
|
|
|
+ <el-table border v-loading="loading" :data="sopUserLogsInfoList" @selection-change="handleSelectionChange" v-if="queryParams.filterMode == 2">
|
|
|
+ <el-table-column type="selection" width="55" align="center" />
|
|
|
+ <el-table-column label="编号" align="center" prop="id" width="100"/>
|
|
|
+ <el-table-column label="客户名称" align="center" prop="name" />
|
|
|
+ <el-table-column label="备注" align="center" prop="remark" />
|
|
|
+ <el-table-column label="客户标签" align="center" prop="tagIdsName" width="250px">
|
|
|
+ <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="joinTime" width="180"/>
|
|
|
+ <!-- <el-table-column label="进线时间" align="center" prop="inComTime" width="180"/>-->
|
|
|
+ </el-table>
|
|
|
+
|
|
|
+ <pagination-more
|
|
|
+ v-show="total>0"
|
|
|
+ :total="total"
|
|
|
+ :page.sync="queryParams.pageNum"
|
|
|
+ :limit.sync="queryParams.pageSize"
|
|
|
+ @pagination="getList"
|
|
|
+ />
|
|
|
+
|
|
|
+ <el-dialog :title="sendMsgOpen.title" :visible.sync="sendMsgOpen.open" width="1000px" append-to-body>
|
|
|
+ <el-form ref="msgForm" :model="msgForm" :rules="msgRules" label-width="100px">
|
|
|
+ <el-form-item label="选择课程">
|
|
|
+ <el-select v-model="msgForm.courseId" placeholder="请选择课程" style=" margin-right: 10px;" size="mini" remote filterable @change="courseChange()">
|
|
|
+ <el-option
|
|
|
+ v-for="dict in courseList"
|
|
|
+ :key="dict.dictValue"
|
|
|
+ :label="dict.dictLabel"
|
|
|
+ :value="parseInt(dict.dictValue)"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ <el-select v-model="msgForm.videoId" placeholder="请选择小节" size="mini" style=" margin-right: 10px;" remote filterable @change="videoIdChange()" >
|
|
|
+ <el-option
|
|
|
+ v-for="dict in videoList"
|
|
|
+ :key="dict.dictValue"
|
|
|
+ :label="dict.dictLabel"
|
|
|
+ :value="parseInt(dict.dictValue)"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ <el-select v-model="msgForm.courseType" placeholder="请选择消息类型" size="mini" style=" margin-right: 10px;">
|
|
|
+ <el-option
|
|
|
+ v-for="dict in sysFsSopWatchStatus"
|
|
|
+ :key="dict.dictValue"
|
|
|
+ :label="dict.dictLabel"
|
|
|
+ :value="parseInt(dict.dictValue)"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="规则" prop="setting" >
|
|
|
+ <div v-for="(item, index) in setting" :key="index" style="background-color: #fdfdfd; border: 1px solid #e6e6e6; margin-bottom: 20px;">
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="22">
|
|
|
+ <el-form :model="item" label-width="70px">
|
|
|
+ <el-form-item label="内容类别" style="margin: 2%">
|
|
|
+ <el-radio-group v-model="item.contentType">
|
|
|
+ <el-radio :label="item.dictValue" v-for="item in sysQwSopAiContentType" @change="handleContentTypeChange()">{{item.dictLabel}}</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="内容" style="margin-bottom: 2%" >
|
|
|
+ <el-input
|
|
|
+ v-if="item.contentType == 1"
|
|
|
+ v-model="item.value"
|
|
|
+ type="textarea"
|
|
|
+ :rows="3"
|
|
|
+ placeholder="内容"
|
|
|
+ style="width: 90%; margin-top: 10px;"
|
|
|
+ @keydown.native="handleKeydown($event, index)"
|
|
|
+ :ref="`textarea-${index}`"
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
+ <el-link
|
|
|
+ v-if="item.contentType == 1"
|
|
|
+ type="primary"
|
|
|
+ @click="toggleSalesCall(index)"
|
|
|
+ style="margin-top: 10px;"
|
|
|
+ >
|
|
|
+ {{ item.isSalesCallAdded ? '移除#销售称呼#' : '添加#销售称呼#' }}
|
|
|
+ </el-link>
|
|
|
+ <el-link
|
|
|
+ v-if="item.contentType == 1"
|
|
|
+ type="primary"
|
|
|
+ @click="toggleSalesCallCustomer(index)"
|
|
|
+ style="margin-top: 10px;margin-left: 2%"
|
|
|
+ >
|
|
|
+ {{ item.isSalesCallCustomerAdded ? '移除#客户称呼#' : '添加#客户称呼#' }}
|
|
|
+ </el-link>
|
|
|
+
|
|
|
+
|
|
|
+ <ImageUpload v-if="item.contentType == 2 " v-model="item.imgUrl" type="image" :num="1" :width="150" :height="150" />
|
|
|
+
|
|
|
+ <div v-if="item.contentType == 3 || item.contentType ==9 ">
|
|
|
+ <el-card class="box-card">
|
|
|
+ <el-form-item label="链接标题:" label-width="100px">
|
|
|
+ <el-input v-model="item.linkTitle" placeholder="请输入链接标题" style="width: 90%;"/>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="链接描述:" label-width="100px" >
|
|
|
+ <el-input type="textarea" :rows="3" v-model="item.linkDescribe" placeholder="请输入链接描述" style="width: 90%;margin-top: 1%;"/>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="链接封面:" label-width="100px">
|
|
|
+ <ImageUpload v-model="item.linkImageUrl" type="image" :num="1" :file-size="2" :width="150" :height="150" style="margin-top: 1%;" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="链接地址:" label-width="100px" >
|
|
|
+ <el-tag type="warning" v-model="item.isBindUrl=1">选择的课程小节 即为卡片链接地址</el-tag>
|
|
|
+ </el-form-item>
|
|
|
+ </el-card>
|
|
|
+ </div>
|
|
|
+ <div v-if="item.contentType == 4 || item.contentType == 10">
|
|
|
+ <el-card class="box-card">
|
|
|
+ <el-form-item label="标题" prop="miniprogramTitle">
|
|
|
+ <el-input v-model="item.miniprogramTitle" placeholder="请输入小程序消息标题，最长为64字" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="封面" prop="miniprogramPicUrl">
|
|
|
+ <ImageUpload v-model="item.miniprogramPicUrl" type="image" :num="10" :width="150" :height="150" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="appid" prop="miniprogramAppid" v-show="false" >
|
|
|
+ <el-input v-model="item.miniprogramAppid='wx73f85f8d62769119' " disabled />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="page路径" prop="miniprogramPage" v-show="item.contentType == 10" label-width="100px" style="margin-left: -30px" >
|
|
|
+ <el-input v-model="item.miniprogramPage" placeholder="小程序消息打开后的路径" type="textarea" :rows="3" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-card>
|
|
|
+ </div>
|
|
|
+ <div v-if="item.contentType == 5 ">
|
|
|
+
|
|
|
+ <el-form-item label="上传文件:" prop="fileUrl" label-width="100px">
|
|
|
+ <el-upload
|
|
|
+ v-model="item.fileUrl"
|
|
|
+ class="avatar-uploader"
|
|
|
+ :action="uploadUrl"
|
|
|
+ :show-file-list="false"
|
|
|
+ :on-success="(res, file) => handleAvatarSuccessFile(res, file, item)"
|
|
|
+ :before-upload="beforeAvatarUploadFile">
|
|
|
+ <i class="el-icon-plus avatar-uploader-icon"></i>
|
|
|
+ </el-upload>
|
|
|
+ <el-link v-if="item.fileUrl" type="primary" :href="downloadUrl(item.fileUrl)" download>
|
|
|
+ {{item.fileUrl}}
|
|
|
+ </el-link>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div v-if="item.contentType == 6 ">
|
|
|
+ <el-form-item label="上传视频：" prop="videoUrl" label-width="100px">
|
|
|
+ <el-upload
|
|
|
+ v-model="item.videoUrl"
|
|
|
+ class="avatar-uploader"
|
|
|
+ :action="uploadUrl"
|
|
|
+ :show-file-list="false"
|
|
|
+ :on-success="(res, file) => handleAvatarSuccessVideo(res, file, item)"
|
|
|
+ :before-upload="beforeAvatarUploadVideo">
|
|
|
+ <i class="el-icon-plus avatar-uploader-icon"></i>
|
|
|
+ </el-upload>
|
|
|
+ <video v-if="item.videoUrl"
|
|
|
+ :src="item.videoUrl"
|
|
|
+ controls style="width: 200px;height: 100px">
|
|
|
+ </video>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ <div v-if="item.contentType == 7 ">
|
|
|
+ <el-input
|
|
|
+ v-model="item.value"
|
|
|
+ type="textarea" :rows="3" maxlength="66" show-word-limit
|
|
|
+ placeholder="输入要转为语音的内容" style="width: 90%;margin-top: 10px;"
|
|
|
+ @input="handleInputVideoText(item.value,item)"/>
|
|
|
+ </div>
|
|
|
+ <div v-if="item.contentType == 8">
|
|
|
+
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <el-form-item label="添加短链" v-if="item.contentType == 1 " >
|
|
|
+ <el-tooltip content="请先根据课程选定课程小节之后再添加" effect="dark" :disabled="!!msgForm.videoId">
|
|
|
+ <el-switch
|
|
|
+ v-model="item.isBindUrl"
|
|
|
+ :disabled="!msgForm.videoId"
|
|
|
+ active-color="#13ce66"
|
|
|
+ inactive-color="#DCDFE6"
|
|
|
+ active-value="1"
|
|
|
+ inactive-value="2">
|
|
|
+ </el-switch>
|
|
|
+ </el-tooltip>
|
|
|
+
|
|
|
+ <span v-if="item.isBindUrl == '1'" style="margin-left: 10px; color: #13ce66">添加URL</span>
|
|
|
+ <span v-if="item.isBindUrl == '2'" style="margin-left: 10px; color: #b1b4ba">不加URL</span>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="课节过期时间" v-if="item.isBindUrl == '1'
|
|
|
+ && item.contentType != 2
|
|
|
+ && item.contentType != 5
|
|
|
+ && item.contentType != 6
|
|
|
+ && item.contentType != 8"
|
|
|
+ style="margin-top: 1%" label-width="100px">
|
|
|
+ <el-row>
|
|
|
+ <el-input-number v-model="item.expiresDays" :min="1" :max="100" ></el-input-number>
|
|
|
+ （天）
|
|
|
+ </el-row>
|
|
|
+ <el-row>
|
|
|
+ <span class="tip">填写0或不填时，默认为系统配置的默认时间</span>
|
|
|
+ </el-row>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="1" :offset="1">
|
|
|
+ <i class="el-icon-delete" @click="delSetList(index)" style="margin-top: 20px;" v-if="setting.length>1"></i>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ <el-link type="primary" class="el-icon-plus" :underline="false" @click='addSetList()' >添加内容</el-link>
|
|
|
+
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <div slot="footer" class="dialog-footer">
|
|
|
+ <el-button type="primary" @click="submitMsgForm">确 定</el-button>
|
|
|
+ <el-button @click="cancelMsgForm">取 消</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ <!-- 添加或修改sopUserLogsInfo对话框 -->
|
|
|
+ <el-dialog title="批量修改客户营期" :visible.sync="updateOpen" width="500px" append-to-body>
|
|
|
+ <el-form ref="updateLogsInfoFrom" :model="updateLogsInfoFrom" :rules="batchRules" label-width="120px">
|
|
|
+ <el-form-item label="选择营期时间" prop="paramTime">
|
|
|
+ <el-date-picker clearable size="small"
|
|
|
+ v-model="updateLogsInfoFrom.paramTime"
|
|
|
+ type="date"
|
|
|
+ value-format="yyyy-MM-dd"
|
|
|
+ placeholder="选择营期时间">
|
|
|
+ </el-date-picker>
|
|
|
+ </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="changeTagDialog.title" :visible.sync="changeTagDialog.open" style="width:100%;height: 100%" 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(queryTagParams.name)">搜索</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="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>
|
|
|
+
|
|
|
+ <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="tagSubmitForm()">确 定</el-button>
|
|
|
+ <el-button @click="tagCancel()">取消</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import {
|
|
|
+ listSopUserLogsInfo,
|
|
|
+ delSopUserLogsInfo,
|
|
|
+ addSopUserLogsInfo,
|
|
|
+ updateSopUserLogsInfo,
|
|
|
+ exportSopUserLogsInfo,
|
|
|
+ sendMsgSop, batchUpdateSopUserLogsInfoToTime
|
|
|
+} from "@/api/qw/sopUserLogsInfo";
|
|
|
+import ImageUpload from "@/views/qw/sop/ImageUpload.vue";
|
|
|
+import {courseList, videoList} from "@/api/qw/sop";
|
|
|
+import {addCourseFinishTemp, updateCourseFinishTemp} from "@/api/course/courseFinishTemp";
|
|
|
+import {allListTagGroup} from "@/api/qw/tagGroup";
|
|
|
+import {listTag} from "@/api/qw/tag";
|
|
|
+import {searchTags} from "../../../api/qw/tag";
|
|
|
+import PaginationMore from '@/components/PaginationMore/index.vue'
|
|
|
+
|
|
|
+export default {
|
|
|
+ name: "sopUserLogsInfoDetails",
|
|
|
+ components: { PaginationMore, ImageUpload},
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ //上传语音的遮罩层
|
|
|
+ voiceLoading :false,
|
|
|
+ uploadUrl:process.env.VUE_APP_BASE_API+"/common/uploadOSS2",
|
|
|
+ uploadUrlByVoice:process.env.VUE_APP_BASE_API+"/common/uploadOSSByHOOKVoice",
|
|
|
+ // 遮罩层
|
|
|
+ loading: true,
|
|
|
+ // 导出遮罩层
|
|
|
+ exportLoading: false,
|
|
|
+ // 选中数组
|
|
|
+ ids: [],
|
|
|
+ // 非单个禁用
|
|
|
+ single: true,
|
|
|
+ // 非多个禁用
|
|
|
+ multiple: true,
|
|
|
+ // 显示搜索条件
|
|
|
+ showSearch: true,
|
|
|
+ // 总条数
|
|
|
+ total: 0,
|
|
|
+ // sopUserLogsInfo表格数据
|
|
|
+ sopUserLogsInfoList: [],
|
|
|
+ sysFsSopWatchStatus: [],
|
|
|
+ isSalesCallAdded:false,
|
|
|
+ isSalesCallCustomerAdded:false,
|
|
|
+ selectTags:[],
|
|
|
+ // 弹出层标题
|
|
|
+ title: "",
|
|
|
+ // 是否显示弹出层
|
|
|
+ open: false,
|
|
|
+ updateOpen:false,
|
|
|
+ // 查询参数
|
|
|
+
|
|
|
+ scheduleEntryTime:null,
|
|
|
+
|
|
|
+ queryParams: {
|
|
|
+ pageNum: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ tagIds:null,
|
|
|
+ remark:null,
|
|
|
+ sopId: null,
|
|
|
+ userLogsId: null,
|
|
|
+ userIdParam:null,
|
|
|
+ startTimeParam:null,
|
|
|
+ externalContactId: null,
|
|
|
+ qwUserId: null,
|
|
|
+ corpId: null,
|
|
|
+ externalId: null,
|
|
|
+ fsUserId: null,
|
|
|
+ externalUserName: null,
|
|
|
+ createTime: null,
|
|
|
+ entryTime: null,
|
|
|
+ inComingSTime: null,
|
|
|
+ inComingETime: null,
|
|
|
+ },
|
|
|
+
|
|
|
+ tagGroupList: [],
|
|
|
+
|
|
|
+ tagTotal:0,
|
|
|
+
|
|
|
+ //标签
|
|
|
+ changeTagDialog:{
|
|
|
+ title:"",
|
|
|
+ open:false,
|
|
|
+ },
|
|
|
+
|
|
|
+ queryTagParams:{
|
|
|
+ pageNum: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ total:0,
|
|
|
+ name:null,
|
|
|
+ corpId:null,
|
|
|
+ },
|
|
|
+
|
|
|
+ courseList:[],
|
|
|
+ videoList:[],
|
|
|
+ //插件版
|
|
|
+ sysQwSopAiContentType:[],
|
|
|
+
|
|
|
+ sendMsgOpen:{
|
|
|
+ title:'一键批量群发',
|
|
|
+ open:false,
|
|
|
+ ids:null,
|
|
|
+ },
|
|
|
+ // 表单参数
|
|
|
+ form: {},
|
|
|
+ updateLogsInfoFrom:{},
|
|
|
+ setting:[{contentType:'1', value: '',}],
|
|
|
+ msgForm:{
|
|
|
+ videoId:null,
|
|
|
+ courseId:null,
|
|
|
+ courseType:null,
|
|
|
+ userIdParam:null,
|
|
|
+ setting:null,
|
|
|
+ ids:null,
|
|
|
+ sopId: null,
|
|
|
+ startTime: null,
|
|
|
+ },
|
|
|
+ // 表单校验
|
|
|
+ rules: {},
|
|
|
+ batchRules:{
|
|
|
+ paramTime: [
|
|
|
+ { required: true, message: '选择的时间不能为空', trigger: 'blur' }
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ msgRules:{},
|
|
|
+ };
|
|
|
+ },
|
|
|
+
|
|
|
+ created() {
|
|
|
+ this.getDicts("sys_qwSopAi_contentType").then(response => {
|
|
|
+ this.sysQwSopAiContentType = response.data;
|
|
|
+ });
|
|
|
+ this.getDicts("sys_fs_sop_watch_status").then(response => {
|
|
|
+ this.sysFsSopWatchStatus = response.data;
|
|
|
+ });
|
|
|
+
|
|
|
+ courseList().then(response => {
|
|
|
+ this.courseList = response.list;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+
|
|
|
+ selectSopUserLogsInfo(val,externalUserName){
|
|
|
+
|
|
|
+ this.loading = true;
|
|
|
+ this.queryParams.sopId=val.sopId;
|
|
|
+ this.queryParams.filterMode=val.filterMode;
|
|
|
+ this.queryParams.userLogsId=val.id;
|
|
|
+ this.queryParams.chatId=val.chatId;
|
|
|
+ if (externalUserName!=null){
|
|
|
+ this.queryParams.externalUserName = externalUserName;
|
|
|
+ }
|
|
|
+
|
|
|
+ listSopUserLogsInfo(this.queryParams).then(response => {
|
|
|
+ this.sopUserLogsInfoList = response.rows;
|
|
|
+ this.total = response.total;
|
|
|
+ this.loading = false;
|
|
|
+ });
|
|
|
+
|
|
|
+
|
|
|
+ this.queryParams.qwUserId=val.qwUserId;
|
|
|
+ this.queryParams.corpId=val.corpId;
|
|
|
+ //用于一键群发
|
|
|
+ this.queryParams.userIdParam=val.userId;
|
|
|
+ this.queryParams.startTimeParam=val.startTime;
|
|
|
+ this.queryParams.corpIdParam=val.corpId;
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ //搜索的标签
|
|
|
+ hangleChangeTags(){
|
|
|
+
|
|
|
+ this.changeTagDialog.title="搜索的标签"
|
|
|
+ this.changeTagDialog.open=true;
|
|
|
+
|
|
|
+ // 获取 tagListFormIndex 中的所有 tagId，用于快速查找
|
|
|
+ const selectedTagIds = new Set(
|
|
|
+ (this.selectTags || []).map(tagItem => tagItem?.tagId)
|
|
|
+ );
|
|
|
+
|
|
|
+ this.queryTagParams.name=null;
|
|
|
+ this.getPageListTagGroup();
|
|
|
+
|
|
|
+ setTimeout(() => {
|
|
|
+ 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 = selectedTagIds.has(this.tagGroupList[i].tag[x].tagId);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }, 200);
|
|
|
+
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ tagSelection(row){
|
|
|
+
|
|
|
+ row.isSelected= !row.isSelected;
|
|
|
+ this.$forceUpdate();
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+ //确定选择标签
|
|
|
+ tagSubmitForm(){
|
|
|
+
|
|
|
+ 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.selectTags) {
|
|
|
+ this.selectTags = [];
|
|
|
+ }
|
|
|
+
|
|
|
+ // 检查当前 tag 是否已经存在于 tagListFormIndex[index] 中
|
|
|
+ let tagExists = this.selectTags.some(
|
|
|
+ tag => tag.id === this.tagGroupList[i].tag[x].id
|
|
|
+ );
|
|
|
+
|
|
|
+ // 如果 tag 不存在于 tagListFormIndex[index] 中，则新增
|
|
|
+ if (!tagExists) {
|
|
|
+ this.selectTags.push(this.tagGroupList[i].tag[x]);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (!this.selectTags || this.selectTags.length === 0) {
|
|
|
+ return this.$message('请选择标签');
|
|
|
+ }
|
|
|
+
|
|
|
+ this.changeTagDialog.open = false;
|
|
|
+ },
|
|
|
+
|
|
|
+ //取消选择标签
|
|
|
+ tagCancel(){
|
|
|
+ this.changeTagDialog.open = false;
|
|
|
+ },
|
|
|
+
|
|
|
+ //删除一些选择的标签
|
|
|
+ handleCloseTags(list){
|
|
|
+ const ls = this.selectTags.findIndex(t => t.tagId === list.tagId);
|
|
|
+ if (ls !== -1) {
|
|
|
+ this.selectTags.splice(ls, 1);
|
|
|
+ this.selectTags = [...this.selectTags];
|
|
|
+ }
|
|
|
+
|
|
|
+ if (this.selectTags!=null && this.selectTags.length>0){
|
|
|
+ // 确保 this.form.tags 是数组
|
|
|
+ if (!this.queryParams.tagIds) {
|
|
|
+ this.queryParams.tagIds = []; // 如果未定义，初始化
|
|
|
+ } else {
|
|
|
+ this.queryParams.tagIds = []; // 清空已有数据
|
|
|
+ }
|
|
|
+
|
|
|
+ // 遍历并添加 tagId
|
|
|
+ this.selectTags.forEach(tag => {
|
|
|
+ if (tag.tagId) { // 确保 tagId 存在
|
|
|
+ this.queryParams.tagIds.push(tag.tagId);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ this.queryParams.tagIds=this.queryParams.tagIds.join(",");
|
|
|
+ }else {
|
|
|
+ this.queryParams.tagIds=null;
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ handleSearchTags(name){
|
|
|
+
|
|
|
+ searchTags({name:name,corpId:this.queryParams.corpId}).then(response => {
|
|
|
+ this.tagGroupList = response.rows;
|
|
|
+ });
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+ cancelSearchTags(){
|
|
|
+
|
|
|
+ this.resetSearchQueryTag()
|
|
|
+
|
|
|
+ this.getPageListTagGroup();
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ getPageListTagGroup(){
|
|
|
+ this.queryTagParams.corpId=this.queryParams.corpId
|
|
|
+ allListTagGroup(this.queryTagParams).then(response => {
|
|
|
+ this.tagGroupList = response.rows;
|
|
|
+ this.tagTotal = response.total;
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ resetSearchQueryTag(){
|
|
|
+
|
|
|
+ this.queryTagParams= {
|
|
|
+ pageNum: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ total:0,
|
|
|
+ name:null,
|
|
|
+ };
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+ courseChange() {
|
|
|
+ if (this.msgForm.courseId != null ) {
|
|
|
+ const selectedCourse = this.courseList.find(course => parseInt(course.dictValue) === this.msgForm.courseId);
|
|
|
+ for (let i = 0; i < this.setting.length; i++) {
|
|
|
+ //响应式直接给链接的标题/封面上值
|
|
|
+ if (selectedCourse && this.msgForm.courseId != null) {
|
|
|
+ if ( this.setting[i].contentType == 3 || this.setting[i].contentType == 9 ){
|
|
|
+ this.$set(this.setting[i], 'linkTitle', selectedCourse.dictLabel);
|
|
|
+ this.$set(this.setting[i], 'linkImageUrl', selectedCourse.dictImgUrl);
|
|
|
+ }
|
|
|
+
|
|
|
+ if ( this.setting[i].contentType == 4 || this.setting[i].contentType == 10 ){
|
|
|
+ this.$set(this.setting[i], 'miniprogramPicUrl', selectedCourse.dictImgUrl);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ videoList(this.msgForm.courseId).then(response => {
|
|
|
+ this.videoList=response.list;
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ videoIdChange() {
|
|
|
+ if (this.msgForm.videoId != null ) {
|
|
|
+ // 查找选中的课节对应的 label
|
|
|
+ const selectedVideo = this.videoList.find(course => parseInt(course.dictValue) === this.msgForm.videoId);
|
|
|
+
|
|
|
+ for (let i = 0; i < this.setting.length; i++) {
|
|
|
+ //响应式直接给链接的描述上值
|
|
|
+ if (selectedVideo && this.msgForm.videoId != null) {
|
|
|
+ if (this.setting[i].contentType == 3 || this.setting[i].contentType == 9 ){
|
|
|
+ this.$set(this.setting[i], 'linkDescribe', selectedVideo.dictLabel);
|
|
|
+ }
|
|
|
+
|
|
|
+ if (this.setting[i].contentType == 4 || this.setting[i].contentType == 10){
|
|
|
+ this.$set(this.setting[i], 'miniprogramTitle', selectedVideo.dictLabel);
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ handleAvatarSuccessFile(res, file, item) {
|
|
|
+ if (res.code === 200) {
|
|
|
+ // 使用 $set 确保响应式更新
|
|
|
+ this.$set(item, 'fileUrl', res.url);
|
|
|
+ } else {
|
|
|
+ this.msgError(res.msg);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ beforeAvatarUploadFile(file){
|
|
|
+ const isLt1M = file.size / 1024 / 1024 < 10;
|
|
|
+ if (!isLt1M) {
|
|
|
+ this.$message.error('上传大小不能超过 10MB!');
|
|
|
+ }
|
|
|
+ return isLt1M;
|
|
|
+ },
|
|
|
+ //下载文件
|
|
|
+ downloadUrl(materialUrl) {
|
|
|
+ // 直接返回文件 URL
|
|
|
+ return materialUrl;
|
|
|
+ },
|
|
|
+
|
|
|
+ handleAvatarSuccessVideo(res, file, item) {
|
|
|
+ if(res.code==200){
|
|
|
+ // 使用 $set 确保响应式更新
|
|
|
+ this.$set(item, 'videoUrl', res.url);
|
|
|
+ }
|
|
|
+ else{
|
|
|
+ this.msgError(res.msg);
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ beforeAvatarUploadVideo(file){
|
|
|
+ const isLt30M = file.size / 1024 / 1024 < 10;
|
|
|
+ const isMP4 = file.type === 'video/mp4';
|
|
|
+
|
|
|
+ if (!isMP4) {
|
|
|
+ this.$message.error('仅支持上传 MP4 格式的视频文件!');
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+
|
|
|
+ if (!isLt30M) {
|
|
|
+ this.$message.error('上传大小不能超过 10MB!');
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+
|
|
|
+ return true;
|
|
|
+ },
|
|
|
+
|
|
|
+ handleInputVideoText(value,content){
|
|
|
+ // 允许的字符：中文、英文（大小写）、数字和指定标点符号（，。！？）
|
|
|
+ const regex = /^[\u4e00-\u9fa5，。！？,!?]+$/;
|
|
|
+
|
|
|
+ // 删除不符合条件的字符
|
|
|
+ const filteredValue = value.split('').filter(char => regex.test(char)).join('');
|
|
|
+
|
|
|
+ this.$set(content, 'value', filteredValue);
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ delSetList(index){
|
|
|
+ this.setting.splice(index,1)
|
|
|
+ },
|
|
|
+ addSetList(){
|
|
|
+ const newSetting = {
|
|
|
+ contentType:'1',
|
|
|
+ value: '',
|
|
|
+ };
|
|
|
+ // 将新设置项添加到 content.setting 数组中
|
|
|
+ this.setting.push(newSetting);
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+ handleKeydown(event, index) {
|
|
|
+ const item = this.setting[index];
|
|
|
+ const textarea = this.$refs[`textarea-${index}`][0].$refs.textarea;
|
|
|
+ const cursorPosition = textarea.selectionStart;
|
|
|
+
|
|
|
+ // 检查是否按下了 Backspace 或 Delete 键
|
|
|
+ if (event.key === 'Backspace' || event.key === 'Delete') {
|
|
|
+ const tags = ['#销售称呼#', '#客户称呼#']; // 需要检查的标签
|
|
|
+ const value = item.value;
|
|
|
+
|
|
|
+ // 遍历标签，检查是否需要删除
|
|
|
+ for (const tag of tags) {
|
|
|
+ let start, end;
|
|
|
+
|
|
|
+ if (event.key === 'Backspace') {
|
|
|
+ // 检查光标前是否是当前标签的一部分
|
|
|
+ start = cursorPosition - tag.length;
|
|
|
+ if (start >= 0 && value.slice(start, cursorPosition) === tag) {
|
|
|
+ // 删除整个标签
|
|
|
+ item.value = value.slice(0, start) + value.slice(cursorPosition);
|
|
|
+ // 更新光标位置
|
|
|
+ this.$nextTick(() => {
|
|
|
+ textarea.setSelectionRange(start, start);
|
|
|
+ });
|
|
|
+ // 更新状态
|
|
|
+ if (tag === '#销售称呼#') item.isSalesCallAdded = false;
|
|
|
+ if (tag === '#客户称呼#') item.isSalesCallCustomerAdded = false;
|
|
|
+ event.preventDefault(); // 阻止默认删除行为
|
|
|
+ break; // 找到匹配的标签后退出循环
|
|
|
+ }
|
|
|
+ } else if (event.key === 'Delete') {
|
|
|
+ // 检查光标后是否是当前标签的一部分
|
|
|
+ end = cursorPosition + tag.length;
|
|
|
+ if (end <= value.length && value.slice(cursorPosition, end) === tag) {
|
|
|
+ // 删除整个标签
|
|
|
+ item.value = value.slice(0, cursorPosition) + value.slice(end);
|
|
|
+ // 更新状态
|
|
|
+ if (tag === '#销售称呼#') item.isSalesCallAdded = false;
|
|
|
+ if (tag === '#客户称呼#') item.isSalesCallCustomerAdded = false;
|
|
|
+ event.preventDefault(); // 阻止默认删除行为
|
|
|
+ break; // 找到匹配的标签后退出循环
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 检查光标是否位于标签的中间
|
|
|
+ for (let i = 0; i <= tag.length; i++) {
|
|
|
+ const tagStart = cursorPosition - i;
|
|
|
+ const tagEnd = tagStart + tag.length;
|
|
|
+ if (
|
|
|
+ tagStart >= 0 &&
|
|
|
+ tagEnd <= value.length &&
|
|
|
+ value.slice(tagStart, tagEnd) === tag
|
|
|
+ ) {
|
|
|
+ // 删除整个标签
|
|
|
+ item.value = value.slice(0, tagStart) + value.slice(tagEnd);
|
|
|
+ // 更新光标位置
|
|
|
+ this.$nextTick(() => {
|
|
|
+ textarea.setSelectionRange(tagStart, tagStart);
|
|
|
+ });
|
|
|
+ // 更新状态
|
|
|
+ if (tag === '#销售称呼#') item.isSalesCallAdded = false;
|
|
|
+ if (tag === '#客户称呼#') item.isSalesCallCustomerAdded = false;
|
|
|
+ event.preventDefault(); // 阻止默认删除行为
|
|
|
+ break; // 找到匹配的标签后退出循环
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ // 切换添加销售称呼按钮点击事件
|
|
|
+ toggleSalesCall(index) {
|
|
|
+ const item = this.setting[index];
|
|
|
+ const salesCall = '#销售称呼#';
|
|
|
+ const textarea = this.$refs[`textarea-${index}`][0].$refs.textarea;
|
|
|
+
|
|
|
+ // 获取当前光标位置
|
|
|
+ const cursorPosition = textarea.selectionStart;
|
|
|
+
|
|
|
+ if (item.isSalesCallAdded) {
|
|
|
+ // 移除所有的 #销售称呼#
|
|
|
+ item.value = item.value.replace(new RegExp(salesCall, 'g'), '');
|
|
|
+ } else {
|
|
|
+ // 添加 #销售称呼#
|
|
|
+ item.value = item.value.slice(0, cursorPosition) + salesCall + item.value.slice(cursorPosition);
|
|
|
+ }
|
|
|
+
|
|
|
+ // 切换状态
|
|
|
+ item.isSalesCallAdded = !item.isSalesCallAdded;
|
|
|
+
|
|
|
+ // 保持光标位置
|
|
|
+ this.$nextTick(() => {
|
|
|
+ textarea.setSelectionRange(cursorPosition, cursorPosition);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ toggleSalesCallCustomer(index) {
|
|
|
+ const item = this.setting[index];
|
|
|
+ const salesCall = '#客户称呼#';
|
|
|
+ const textarea = this.$refs[`textarea-${index}`][0].$refs.textarea;
|
|
|
+
|
|
|
+ // 获取当前光标位置
|
|
|
+ const cursorPosition = textarea.selectionStart;
|
|
|
+
|
|
|
+ if (item.isSalesCallCustomerAdded) {
|
|
|
+ // 移除所有的 #销售称呼#
|
|
|
+ item.value = item.value.replace(new RegExp(salesCall, 'g'), '');
|
|
|
+ } else {
|
|
|
+ // 添加 #客户称呼#
|
|
|
+ item.value = item.value.slice(0, cursorPosition) + salesCall + item.value.slice(cursorPosition);
|
|
|
+ }
|
|
|
+
|
|
|
+ // 切换状态
|
|
|
+ item.isSalesCallCustomerAdded = !item.isSalesCallCustomerAdded;
|
|
|
+
|
|
|
+ // 保持光标位置
|
|
|
+ this.$nextTick(() => {
|
|
|
+ textarea.setSelectionRange(cursorPosition, cursorPosition);
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ handleContentTypeChange() {
|
|
|
+
|
|
|
+ //如果是链接的才上
|
|
|
+ if (this.msgForm.courseId != null ) {
|
|
|
+ const selectedCourse = this.courseList.find(course => parseInt(course.dictValue) === this.msgForm.courseId);
|
|
|
+ for (let i = 0; i < this.setting.length; i++) {
|
|
|
+ //响应式直接给链接的标题/封面上值
|
|
|
+ if (selectedCourse && this.msgForm.courseId != null) {
|
|
|
+
|
|
|
+ if (this.setting[i].contentType == 3 || this.setting[i].contentType == 9){
|
|
|
+ this.$set(this.setting[i], 'linkTitle', selectedCourse.dictLabel);
|
|
|
+ this.$set(this.setting[i], 'linkImageUrl', selectedCourse.dictImgUrl);
|
|
|
+ }
|
|
|
+ if (this.setting[i].contentType == 4 || this.setting[i].contentType == 10){
|
|
|
+ this.$set(this.setting[i], 'miniprogramPicUrl', selectedCourse.dictImgUrl);
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ if (this.msgForm.videoId != null ) {
|
|
|
+ // 查找选中的课节对应的 label
|
|
|
+ const selectedVideo = this.videoList.find(course => parseInt(course.dictValue) === this.msgForm.videoId);
|
|
|
+
|
|
|
+ for (let i = 0; i < this.setting.length; i++) {
|
|
|
+ //响应式直接给链接的描述上值
|
|
|
+ if (selectedVideo && this.msgForm.videoId != null) {
|
|
|
+
|
|
|
+ if (this.setting[i].contentType == 3 || this.setting[i].contentType == 9){
|
|
|
+ this.$set(this.setting[i], 'linkDescribe', selectedVideo.dictLabel);
|
|
|
+ }
|
|
|
+ if (this.setting[i].contentType == 4 || this.setting[i].contentType == 10){
|
|
|
+ this.$set(this.setting[i], 'miniprogramTitle', selectedVideo.dictLabel);
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+ /** 查询sopUserLogsInfo列表 */
|
|
|
+ getList() {
|
|
|
+ this.loading = true;
|
|
|
+ listSopUserLogsInfo(this.queryParams).then(response => {
|
|
|
+ this.sopUserLogsInfoList = response.rows;
|
|
|
+ this.total = response.total;
|
|
|
+ this.loading = false;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 取消按钮
|
|
|
+ cancel() {
|
|
|
+ this.updateOpen = false;
|
|
|
+ this.reset();
|
|
|
+ },
|
|
|
+ // 表单重置
|
|
|
+ reset() {
|
|
|
+ this.form = {
|
|
|
+ id: null,
|
|
|
+ sopId: null,
|
|
|
+ userLogsId: null,
|
|
|
+ externalContactId: null,
|
|
|
+ qwUserId: null,
|
|
|
+ corpId: null,
|
|
|
+ externalId: null,
|
|
|
+ fsUserId: null,
|
|
|
+ externalUserName: null,
|
|
|
+ createTime: null,
|
|
|
+ crtTime: null,
|
|
|
+ updateTime: null
|
|
|
+ };
|
|
|
+ this.resetForm("form");
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+ resetSendMsgSop() {
|
|
|
+ this.msgForm = {
|
|
|
+ videoId:null,
|
|
|
+ courseId:null,
|
|
|
+ courseType:null,
|
|
|
+ setting:null,
|
|
|
+ ids:null,
|
|
|
+ };
|
|
|
+ this.resetForm("msgForm");
|
|
|
+ },
|
|
|
+
|
|
|
+ handleScheduleTimeChange(val) {
|
|
|
+ if (val) {
|
|
|
+ this.queryParams.inComingSTime = val[0];
|
|
|
+ this.queryParams.inComingETime = val[1];
|
|
|
+ } else {
|
|
|
+ this.queryParams.inComingSTime = null;
|
|
|
+ this.queryParams.inComingETime = null;
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ /** 搜索按钮操作 */
|
|
|
+ handleQuery() {
|
|
|
+
|
|
|
+ if (this.selectTags!=null && this.selectTags.length>0){
|
|
|
+ // 确保 this.form.tags 是数组
|
|
|
+ if (!this.queryParams.tagIds) {
|
|
|
+ this.queryParams.tagIds = []; // 如果未定义，初始化
|
|
|
+ } else {
|
|
|
+ this.queryParams.tagIds = []; // 清空已有数据
|
|
|
+ }
|
|
|
+
|
|
|
+ // 遍历并添加 tagId
|
|
|
+ this.selectTags.forEach(tag => {
|
|
|
+ if (tag.tagId) { // 确保 tagId 存在
|
|
|
+ this.queryParams.tagIds.push(tag.tagId);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ this.queryParams.tagIds=this.queryParams.tagIds.join(",");
|
|
|
+ }else {
|
|
|
+ this.queryParams.tagIds=null;
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+ /** 重置按钮操作 */
|
|
|
+ resetQuery() {
|
|
|
+ this.selectTags=[];
|
|
|
+ this.scheduleEntryTime=null;
|
|
|
+ this.queryParams.inComingSTime=null;
|
|
|
+ this.queryParams.inComingETime=null;
|
|
|
+ this.resetForm("queryForm");
|
|
|
+ this.handleQuery();
|
|
|
+ },
|
|
|
+ // 多选框选中数据
|
|
|
+ handleSelectionChange(selection) {
|
|
|
+ this.ids = selection.map(item => item.id)
|
|
|
+ this.single = selection.length!==1
|
|
|
+ this.multiple = !selection.length
|
|
|
+ },
|
|
|
+ /** 新增按钮操作 */
|
|
|
+ handleAdd() {
|
|
|
+ this.reset();
|
|
|
+ this.open = true;
|
|
|
+ this.title = "添加客户营期";
|
|
|
+ },
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 一键群发
|
|
|
+ */
|
|
|
+ handleSendMsg(){
|
|
|
+ this.sendMsgOpen.open=true;
|
|
|
+ this.sendMsgOpen.ids=this.ids;
|
|
|
+ },
|
|
|
+
|
|
|
+ /** 修改按钮操作 */
|
|
|
+ handleUpdate() {
|
|
|
+ this.updateOpen= true;
|
|
|
+ },
|
|
|
+ submitMsgForm(){
|
|
|
+ this.$refs["msgForm"].validate(valid => {
|
|
|
+ if (valid) {
|
|
|
+
|
|
|
+ this.msgForm.setting=JSON.stringify(this.setting)
|
|
|
+ this.msgForm.ids=this.ids;
|
|
|
+ this.msgForm.sopId=this.queryParams.sopId;
|
|
|
+ this.msgForm.userIdParam=this.queryParams.userIdParam;
|
|
|
+ this.msgForm.startTime=this.queryParams.startTimeParam;
|
|
|
+ this.msgForm.corpId=this.queryParams.corpIdParam;
|
|
|
+ this.msgForm.filterMode=this.queryParams.filterMode;
|
|
|
+
|
|
|
+ if (this.setting.length <= 0) {
|
|
|
+ return this.$message.error("请添加规则")
|
|
|
+ }
|
|
|
+ if (this.msgForm.courseId===null || this.msgForm.courseId===''){
|
|
|
+ return this.$message.error("课程不能为空")
|
|
|
+ }
|
|
|
+
|
|
|
+ if (this.msgForm.videoId===null || this.msgForm.videoId===''){
|
|
|
+ return this.$message.error("课节不能为空")
|
|
|
+ }
|
|
|
+
|
|
|
+ if (this.msgForm.courseType===null || this.msgForm.courseType===''){
|
|
|
+ return this.$message.error("消息类型不能为空")
|
|
|
+ }
|
|
|
+
|
|
|
+ for (let i = 0; i < this.setting.length; i++) {
|
|
|
+ if (this.setting[i].contentType == 1 && (this.setting[i].value == null || this.setting[i].value == "")) {
|
|
|
+ return this.$message.error("内容不能为空")
|
|
|
+ }
|
|
|
+ if (this.setting[i].contentType == 2 && (this.setting[i].imgUrl == null || this.setting[i].imgUrl == "")) {
|
|
|
+ return this.$message.error("图片不能为空")
|
|
|
+ }
|
|
|
+ if ((this.setting[i].contentType == 3 || this.setting[i].contentType == 9 ) && (this.setting[i].linkTitle == null || this.setting[i].linkTitle == "")) {
|
|
|
+ return this.$message.error("链接标题不能为空")
|
|
|
+ }
|
|
|
+ if ((this.setting[i].contentType == 3 || this.setting[i].contentType == 9 ) && (this.setting[i].linkDescribe == null || this.setting[i].linkDescribe == "")) {
|
|
|
+ return this.$message.error("链接描述不能为空")
|
|
|
+ }
|
|
|
+ if ((this.setting[i].contentType == 3 || this.setting[i].contentType == 9 ) && (this.setting[i].linkImageUrl == null || this.setting[i].linkImageUrl == "")) {
|
|
|
+ return this.$message.error("链接图片不能为空")
|
|
|
+ }
|
|
|
+ if ((this.setting[i].contentType == 3 || this.setting[i].contentType == 9 )&& this.setting[i].type == 1 && (this.setting[i].linkUrl == null || this.setting[i].linkUrl == "")) {
|
|
|
+ return this.$message.error("链接地址不能为空")
|
|
|
+ }
|
|
|
+
|
|
|
+ if ((this.setting[i].contentType == 4 || this.setting[i].contentType == 10 ) && (this.setting[i].miniprogramTitle == null || this.setting[i].miniprogramTitle == "")) {
|
|
|
+ return this.$message.error("小程序消息标题不能为空")
|
|
|
+ }
|
|
|
+ if ((this.setting[i].contentType == 4 || this.setting[i].contentType == 10 ) && (this.setting[i].miniprogramPicUrl == null || this.setting[i].miniprogramPicUrl == "")) {
|
|
|
+ return this.$message.error("小程序封面地址不能为空")
|
|
|
+ }
|
|
|
+
|
|
|
+ if (this.setting[i].contentType == 10 && (this.setting[i].miniprogramPage == null || this.setting[i].miniprogramPage == "")) {
|
|
|
+ return this.$message.error("小程序page地址不能为空")
|
|
|
+ }
|
|
|
+
|
|
|
+ if (this.setting[i].contentType == 5 && (this.setting[i].fileUrl == null || this.setting[i].fileUrl == "")) {
|
|
|
+ return this.$message.error("文件不能为空")
|
|
|
+ }
|
|
|
+ if (this.setting[i].contentType == 6 && (this.setting[i].videoUrl == null || this.setting[i].videoUrl == "")) {
|
|
|
+ return this.$message.error("视频不能为空")
|
|
|
+ }
|
|
|
+ if (this.setting[i].contentType == 7 && (this.setting[i].value == null || this.setting[i].value == "")) {
|
|
|
+ return this.$message.error("语音不能为空")
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ this.sendMsgOpen.open = false;
|
|
|
+
|
|
|
+ const loading = this.$loading({
|
|
|
+ lock: true,
|
|
|
+ text: '正在执行中请稍后~~请不要刷新页面！！',
|
|
|
+ spinner: 'el-icon-loading',
|
|
|
+ background: 'rgba(0, 0, 0, 0.7)'
|
|
|
+ });
|
|
|
+
|
|
|
+ sendMsgSop(this.msgForm).then(response => {
|
|
|
+ this.msgSuccess("一键群发成功");
|
|
|
+ loading.close();
|
|
|
+ this.setting=[];
|
|
|
+ this.msgForm = {
|
|
|
+ videoId:null,
|
|
|
+ courseId:null,
|
|
|
+ courseType:null,
|
|
|
+ setting:null,
|
|
|
+ }
|
|
|
+ this.getList();
|
|
|
+ }).finally(()=>{
|
|
|
+ loading.close();
|
|
|
+ });
|
|
|
+
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ cancelMsgForm(){
|
|
|
+ this.sendMsgOpen.open = false;
|
|
|
+ this.resetSendMsgSop();
|
|
|
+ },
|
|
|
+ /** 提交按钮 */
|
|
|
+ submitForm() {
|
|
|
+ this.$refs["updateLogsInfoFrom"].validate(valid => {
|
|
|
+ if (valid) {
|
|
|
+
|
|
|
+ this.updateLogsInfoFrom.ids=this.ids;
|
|
|
+ this.updateLogsInfoFrom.sopId= this.queryParams.sopId
|
|
|
+ this.updateLogsInfoFrom.qwUserId=this.queryParams.qwUserId
|
|
|
+ this.updateLogsInfoFrom.corpId= this.queryParams.corpId
|
|
|
+
|
|
|
+
|
|
|
+ let loadingRock = this.$loading({
|
|
|
+ lock: true,
|
|
|
+ text: '正在执行中请稍后~~请不要刷新页面！！',
|
|
|
+ spinner: 'el-icon-loading',
|
|
|
+ background: 'rgba(0, 0, 0, 0.7)'
|
|
|
+ });
|
|
|
+
|
|
|
+
|
|
|
+ batchUpdateSopUserLogsInfoToTime(this.updateLogsInfoFrom).then(response => {
|
|
|
+ this.msgSuccess("修改成功");
|
|
|
+ this.open = false;
|
|
|
+ this.updateOpen=false;
|
|
|
+ this.getList();
|
|
|
+ this.$emit('flashNotify')
|
|
|
+ loadingRock.close();
|
|
|
+ }).finally(res=>{
|
|
|
+ loadingRock.close();
|
|
|
+ })
|
|
|
+
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /** 删除按钮操作 */
|
|
|
+ handleDelete(row) {
|
|
|
+ const ids = row.id || this.ids;
|
|
|
+ this.$confirm('是否确认删除sopUserLogsInfo编号为"' + ids + '"的数据项?', "警告", {
|
|
|
+ confirmButtonText: "确定",
|
|
|
+ cancelButtonText: "取消",
|
|
|
+ type: "warning"
|
|
|
+ }).then(function() {
|
|
|
+ return delSopUserLogsInfo(ids);
|
|
|
+ }).then(() => {
|
|
|
+ this.getList();
|
|
|
+ this.msgSuccess("删除成功");
|
|
|
+ }).catch(() => {});
|
|
|
+ },
|
|
|
+ /** 导出按钮操作 */
|
|
|
+ handleExport() {
|
|
|
+ const queryParams = this.queryParams;
|
|
|
+ this.$confirm('是否确认导出所有营期数据项?', "警告", {
|
|
|
+ confirmButtonText: "确定",
|
|
|
+ cancelButtonText: "取消",
|
|
|
+ type: "warning"
|
|
|
+ }).then(() => {
|
|
|
+ this.exportLoading = true;
|
|
|
+ return exportSopUserLogsInfo(queryParams);
|
|
|
+ }).then(response => {
|
|
|
+ this.download(response.msg);
|
|
|
+ this.exportLoading = false;
|
|
|
+ }).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;
|
|
|
+}
|
|
|
+</style>
|
