sop.vue 85 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664166516661667166816691670167116721673167416751676167716781679168016811682168316841685168616871688168916901691169216931694169516961697169816991700170117021703170417051706170717081709171017111712171317141715171617171718171917201721172217231724172517261727172817291730173117321733173417351736173717381739174017411742174317441745174617471748174917501751175217531754175517561757175817591760176117621763176417651766176717681769177017711772177317741775177617771778177917801781178217831784178517861787178817891790179117921793179417951796179717981799180018011802180318041805180618071808180918101811181218131814181518161817181818191820182118221823182418251826182718281829183018311832183318341835183618371838183918401841184218431844184518461847184818491850185118521853185418551856185718581859186018611862186318641865186618671868186918701871187218731874187518761877187818791880188118821883188418851886188718881889189018911892189318941895189618971898189919001901190219031904190519061907190819091910191119121913191419151916191719181919192019211922192319241925192619271928192919301931193219331934193519361937193819391940194119421943194419451946194719481949195019511952195319541955195619571958195919601961196219631964196519661967196819691970197119721973197419751976197719781979198019811982198319841985198619871988198919901991199219931994199519961997199819992000200120022003200420052006200720082009201020112012201320142015201620172018201920202021202220232024202520262027202820292030203120322033203420352036203720382039204020412042204320442045204620472048204920502051205220532054205520562057205820592060206120622063206420652066206720682069207020712072207320742075207620772078207920802081208220832084208520862087208820892090209120922093209420952096209720982099210021012102210321042105210621072108210921102111211221132114211521162117211821192120212121222123212421252126212721282129213021312132213321342135213621372138213921402141214221432144214521462147214821492150215121522153215421552156215721582159216021612162216321642165216621672168216921702171217221732174217521762177217821792180218121822183218421852186218721882189219021912192219321942195219621972198219922002201220222032204220522062207220822092210221122122213221422152216221722182219222022212222222322242225222622272228222922302231223222332234223522362237223822392240224122422243224422452246224722482249225022512252225322542255225622572258225922602261226222632264226522662267226822692270227122722273227422752276227722782279228022812282228322842285228622872288228922902291229222932294229522962297229822992300230123022303230423052306230723082309231023112312
  1. <template>
  2. <div class="app-container">
  3. <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
  4. <el-form-item label="企微公司" prop="corpId">
  5. <el-select v-model="queryParams.corpId" placeholder="企微公司" size="small" @change="updateCorpId()">
  6. <el-option
  7. v-for="dict in myQwCompanyList"
  8. :key="dict.dictValue"
  9. :label="dict.dictLabel"
  10. :value="dict.dictValue"
  11. />
  12. </el-select>
  13. </el-form-item>
  14. <el-form-item label="成员" prop="qwUserIds">
  15. <el-select v-model="queryParams.qwUserIds" filterable clearable placeholder="选择成员" size="small">
  16. <el-option
  17. v-for="dict in companyUserList"
  18. :key="dict.id"
  19. :label="dict.qwUserName"
  20. :value="dict.id"
  21. />
  22. </el-select>
  23. </el-form-item>
  24. <el-form-item label="规则编号" prop="id">
  25. <el-input
  26. v-model="queryParams.id"
  27. placeholder="请输入规则名称"
  28. clearable
  29. size="small"
  30. @keyup.enter.native="handleQuery"
  31. />
  32. </el-form-item>
  33. <el-form-item label="类型 " prop="type">
  34. <el-select v-model="queryParams.type" placeholder="请选择类型" clearable size="small" @change="updateCorpId()">
  35. <el-option
  36. :key="1"
  37. :label="'个微'"
  38. :value="1"
  39. />
  40. <el-option
  41. :key="2"
  42. :label="'企微'"
  43. :value="2"
  44. />
  45. </el-select>
  46. </el-form-item>
  47. <el-form-item label="规则状态 " prop="status">
  48. <el-select v-model="queryParams.status" placeholder="请选择规则状态" clearable size="small"
  49. @change="updateCorpId()">
  50. <el-option
  51. v-for="dict in sysSopStatus"
  52. :key="dict.dictValue"
  53. :label="dict.dictLabel"
  54. :value="dict.dictValue"
  55. />
  56. </el-select>
  57. </el-form-item>
  58. <el-form-item label="名称" prop="name">
  59. <el-input
  60. v-model="queryParams.name"
  61. placeholder="请输入规则名称"
  62. clearable
  63. size="small"
  64. @keyup.enter.native="handleQuery"
  65. />
  66. </el-form-item>
  67. <el-form-item label="创建时间" prop="createTime">
  68. <el-date-picker clearable size="small"
  69. v-model="queryParams.createTime"
  70. type="date"
  71. value-format="yyyy-MM-dd"
  72. placeholder="选择创建时间">
  73. </el-date-picker>
  74. </el-form-item>
  75. <el-form-item>
  76. <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
  77. <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
  78. </el-form-item>
  79. </el-form>
  80. <el-row :gutter="10" class="mb8">
  81. <el-col :span="1.5">
  82. <el-button
  83. type="primary"
  84. plain
  85. icon="el-icon-plus"
  86. size="mini"
  87. @click="handleAdd"
  88. v-hasPermi="['qw:sop:add']"
  89. >新增
  90. </el-button>
  91. </el-col>
  92. <el-col :span="1.5">
  93. <el-button
  94. type="danger"
  95. plain
  96. icon="el-icon-delete"
  97. size="mini"
  98. :disabled="multiple"
  99. @click="handleDelete"
  100. v-hasPermi="['qw:sop:remove']"
  101. >删除
  102. </el-button>
  103. </el-col>
  104. <el-col :span="1.5">
  105. <el-button
  106. type="danger"
  107. plain
  108. icon="el-icon-delete"
  109. size="mini"
  110. :disabled="multiple"
  111. @click="handleSopLogsDelete"
  112. v-hasPermi="['qw:sopLogs:removeAll']"
  113. >批量删除执行任务
  114. </el-button>
  115. </el-col>
  116. <el-col :span="1.5">
  117. <el-button
  118. type="success"
  119. plain
  120. icon="el-icon-download"
  121. size="mini"
  122. :loading="exportLoading"
  123. @click="handleExport"
  124. v-hasPermi="['qw:sop:export']"
  125. >导出
  126. </el-button>
  127. </el-col>
  128. <el-col :span="1.5">
  129. <el-button
  130. size="mini"
  131. plain
  132. type="warning"
  133. icon="el-icon-edit"
  134. :disabled="multiple"
  135. @click="handleExecute"
  136. v-hasPermi="['qw:sop:execute']"
  137. >批量执行SOP
  138. </el-button>
  139. </el-col>
  140. <el-col :span="1.5">
  141. <el-tooltip class="item" effect="dark" content="此功能用于给 选中的 SOP任务营期 内【所有的】客户发送 消息【或者发送草稿-/-清楚草稿】" placement="top">
  142. <el-button
  143. type="warning"
  144. icon="el-icon-s-promotion"
  145. size="mini"
  146. :disabled="multiple"
  147. @click="handleCampSendMsg"
  148. v-hasPermi="['qw:sopUserLogsInfo:msgSop']"
  149. >SOP营期一键群发(或草稿)</el-button>
  150. </el-tooltip>
  151. </el-col>
  152. <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
  153. </el-row>
  154. <el-table v-loading="loading" border :data="sopList" @selection-change="handleSelectionChange">
  155. <el-table-column type="selection" width="55" align="center"/>
  156. <el-table-column label="规则编号" align="center" prop="id" width="160"/>
  157. <el-table-column label="规则名称" align="center" prop="name" width="150"/>
  158. <el-table-column label="规则状态" align="center" prop="status" width="150">
  159. <template slot-scope="scope">
  160. <dict-tag :options="sysSopStatus" :value="scope.row.status"></dict-tag>
  161. </template>
  162. </el-table-column>
  163. <el-table-column label="类别" align="center" prop="type" width="100">
  164. <template slot-scope="scope">
  165. <el-tag type="success" v-if="scope.row.type==1">个微</el-tag>
  166. <el-tag type="primary" v-else-if="scope.row.type==2">企微<span v-if="scope.row.filterMode == 2">(群聊)</span></el-tag>
  167. </template>
  168. </el-table-column>
  169. <el-table-column label="发送方式" align="center" prop="sendType">
  170. <template slot-scope="scope">
  171. <dict-tag :options="sysQwSopType" :value="scope.row.sendType"/>
  172. </template>
  173. </el-table-column>
  174. <el-table-column label="成员" align="center" prop="qwUserIds" width="150">
  175. <template slot-scope="scope">
  176. <!-- 点击事件绑定到整个 div -->
  177. <div @click="toggleRow(scope.row)" v-if="scope.row.filterMode == 1">
  178. <!-- 显示当前行的成员数量 -->
  179. <span v-if="!expandedRows[scope.row.id]">
  180. 点击展开 ({{ scope.row.qwUserIds.split(',').length }} 人)
  181. </span>
  182. <!-- 展开时显示所有成员 -->
  183. <div v-show="expandedRows[scope.row.id]">
  184. <div v-if="scope.row.type==2" v-for="id in scope.row.qwUserIds.split(',')" :key="id"
  185. style="display: inline;" class="text-container">
  186. <el-tag type="success" v-for="list in companyUserList" :key="list.qwUserId" style="margin: 3px;"
  187. v-if="list.id==id">
  188. {{ list.qwUserName }}
  189. </el-tag>
  190. </div>
  191. <div v-if="scope.row.type==1" v-for="id in scope.row.qwUserIds.split(',')" :key="id"
  192. style="display: inline;" class="text-container">
  193. <el-tag type="success" v-for="list in companyUserLists" :key="list.userId" style="margin: 3px;"
  194. v-if="list.userId==id">
  195. {{ list.nickName }}
  196. </el-tag>
  197. </div>
  198. </div>
  199. </div>
  200. <div @click="toggleRow(scope.row)" v-if="scope.row.filterMode == 2">
  201. <!-- 显示当前行的成员数量 -->
  202. <span v-if="!expandedRows[scope.row.id]">
  203. 点击展开 ({{
  204. (scope.row.chatId || '').toString().split(',').length
  205. }} 个)
  206. </span>
  207. <!-- 展开时显示所有成员 -->
  208. <div v-show="expandedRows[scope.row.id]">
  209. <div v-for="id in (scope.row.chatId || '').split(',')" :key="id"
  210. style="display: inline;" class="text-container">
  211. <el-tag type="success" v-for="list in chatList" :key="list.chatId" style="margin: 3px;"
  212. v-if="list.chatId == id">
  213. {{ list.name }}
  214. </el-tag>
  215. </div>
  216. </div>
  217. </div>
  218. </template>
  219. </el-table-column>
  220. <el-table-column label="模板" align="center" prop="tempId">
  221. <template slot-scope="scope">
  222. <div v-for="id in tempList" v-if="id.id==scope.row.tempId">{{ id.name }}</div>
  223. </template>
  224. </el-table-column>
  225. <el-table-column label="新客户自动创建sop" align="center" prop="isAutoSop" width="140">
  226. <template slot-scope="scope">
  227. <span v-if="scope.row.filterMode == 2"
  228. style="margin-left: 10px;color: #ff4949">群聊无法设置</span>
  229. <el-switch
  230. v-if="(scope.row.sendType===2 || scope.row.sendType===4 || scope.row.sendType===11) && scope.row.filterMode == 1"
  231. v-model="scope.row.isAutoSop"
  232. active-color="#13ce66"
  233. inactive-color="#ff4949"
  234. :active-value="1"
  235. :inactive-value="2"
  236. @change="switchAutoSopChange(scope.row.id,scope.row.isAutoSop)">
  237. </el-switch>
  238. <span v-if="scope.row.sendType!=1 && scope.row.isAutoSop == '1' && scope.row.filterMode == 1"
  239. style="margin-left: 10px;color: #13ce66">已开启</span>
  240. <span v-if="scope.row.sendType!=1 && scope.row.isAutoSop == '2' && scope.row.filterMode == 1"
  241. style="margin-left: 10px;color: #ff4949">已关闭</span>
  242. <span v-if="scope.row.sendType==1 && scope.row.filterMode == 1" style="margin-left: 10px;color: rgb(250,114,3)">企微接口无法设置</span>
  243. </template>
  244. </el-table-column>
  245. <el-table-column label="过期时间" align="center" prop="expiryTime">
  246. <template slot-scope="scope">
  247. {{ scope.row.expiryTime }} 小时
  248. </template>
  249. </el-table-column>
  250. <el-table-column label="创建人" align="center" prop="createBy"/>
  251. <el-table-column label="创建时间" align="center" prop="createTime" width="180"/>
  252. <el-table-column label="修改规则状态时间" align="center" prop="stopTime" width="180"/>
  253. <el-table-column label="查看操作" align="center" class-name="small-padding fixed-width" width="200" fixed="right">
  254. <template slot-scope="scope">
  255. <el-button
  256. v-if="scope.row.status==2||scope.row.status==0 || scope.row.status == 3 || scope.row.status == 4 "
  257. size="mini"
  258. type="text"
  259. @click="selectSchedule(scope.row)"
  260. v-hasPermi="['qw:sop:list']"
  261. >营期
  262. </el-button>
  263. <el-button
  264. v-if="scope.row.status==2 || scope.row.status==0 || scope.row.status == 3 || scope.row.status == 4 "
  265. size="mini"
  266. type="text"
  267. style="color: green;"
  268. @click="handleScheduleDetail(scope.row)"
  269. v-hasPermi="['qw:sop:list']"
  270. >执行详情
  271. </el-button>
  272. <el-button
  273. v-if="scope.row.status==2 || scope.row.status==0 || scope.row.status == 3 || scope.row.status == 4 "
  274. size="mini"
  275. type="text"
  276. @click="handleUpdate(scope.row,2)"
  277. v-hasPermi="['qw:sop:edit']"
  278. >查看规则
  279. </el-button>
  280. <el-button
  281. v-if="scope.row.status==2 || scope.row.status==0 || scope.row.status == 3 || scope.row.status == 4 "
  282. size="mini"
  283. type="text"
  284. style="color: green;"
  285. @click="handleQueryDetails(scope.row)"
  286. v-hasPermi="['qw:sop:list']"
  287. >查看模板
  288. </el-button>
  289. </template>
  290. </el-table-column>
  291. <el-table-column label="修改操作" align="center" class-name="small-padding fixed-width" width="100px"
  292. fixed="right">
  293. <template slot-scope="scope">
  294. <el-button
  295. size="mini"
  296. type="text"
  297. v-hasPermi="['qw:sop:edit']"
  298. @click="handleUpdateSopName(scope.row)"
  299. >修改名称
  300. </el-button>
  301. <el-button
  302. size="mini"
  303. type="text"
  304. v-hasPermi="['qw:sop:edit']"
  305. @click="handleUpdateOutTime(scope.row)"
  306. >修改规则
  307. </el-button>
  308. <el-button
  309. size="mini"
  310. type="text"
  311. v-if="scope.row.filterMode == 2 && (scope.row.status==2||scope.row.status==0 || scope.row.status == 3 || scope.row.status == 4)"
  312. @click="handleSendMsg(scope.row)"
  313. >一键发群
  314. </el-button>
  315. <el-button
  316. v-if="scope.row.status == 1 "
  317. size="mini"
  318. type="text"
  319. @click="handleUpdate(scope.row,1)"
  320. v-hasPermi="['qw:sop:edit']"
  321. >修改规则
  322. </el-button>
  323. <el-button
  324. size="mini"
  325. type="text"
  326. style="color: red;"
  327. @click="handleDelete(scope.row)"
  328. v-hasPermi="['qw:sop:remove']"
  329. >删除
  330. </el-button>
  331. <el-button
  332. size="mini"
  333. type="text"
  334. @click="handleSkipSop(scope.row,1)"
  335. v-hasPermi="['qw:sop:edit']"
  336. >跳过sop
  337. </el-button>
  338. </template>
  339. </el-table-column>
  340. </el-table>
  341. <pagination
  342. v-show="total>0"
  343. :total="total"
  344. :page.sync="queryParams.pageNum"
  345. :limit.sync="queryParams.pageSize"
  346. @pagination="getList"
  347. />
  348. <send-msg-sop-open-tool ref="sendMsgSopOpenTool" ></send-msg-sop-open-tool>
  349. <!-- 添加或修改企微sop对话框 -->
  350. <el-dialog :title="title" :visible.sync="open" width="1000px" append-to-body>
  351. <el-form ref="form" :model="form" :rules="rules" label-width="100px">
  352. <el-form-item label="规则名称" prop="name">
  353. <el-input v-model="form.name" placeholder="请输入规则名称"/>
  354. </el-form-item>
  355. <el-form-item label="状态">
  356. <el-radio-group v-model="form.status">
  357. <el-radio
  358. v-for="dict in statusOptions"
  359. :key="dict.dictValue"
  360. :label="parseInt(dict.dictValue)"
  361. >{{ dict.dictLabel }}
  362. </el-radio>
  363. </el-radio-group>
  364. </el-form-item>
  365. <el-form-item label="类别" prop="type">
  366. <el-radio-group v-model="form.type">
  367. <el-radio
  368. :label="1"
  369. >个微
  370. </el-radio>
  371. <el-radio
  372. :label="2"
  373. >企微
  374. </el-radio>
  375. <el-radio
  376. :label="3"
  377. >群聊
  378. </el-radio>
  379. </el-radio-group>
  380. </el-form-item>
  381. <!-- <div v-if="form.type==2">-->
  382. <!-- <el-form-item label="推送方式 ">-->
  383. <!-- <el-radio-group v-model="form.sendType" @input="handleSendTypeChange">-->
  384. <!-- <el-radio-->
  385. <!-- v-for="dict in sysQwSopType"-->
  386. <!-- :key="dict.dictValue"-->
  387. <!-- :label="parseInt(dict.dictValue)"-->
  388. <!-- >{{dict.dictLabel}}</el-radio>-->
  389. <!-- </el-radio-group>-->
  390. <!-- </el-form-item>-->
  391. <!-- <el-form-item label="选择员工" prop="qwUserIds" style="margin-top: 2%">-->
  392. <!-- <div>-->
  393. <!-- <el-button-->
  394. <!-- size="medium"-->
  395. <!-- icon="el-icon-circle-plus-outline"-->
  396. <!-- plain-->
  397. <!-- @click="handlelistUser(form.type,form.sendType)">请选择使用员工</el-button>-->
  398. <!-- </div>-->
  399. <!-- <div>-->
  400. <!-- <el-tag-->
  401. <!-- style="margin-left: 5px"-->
  402. <!-- size="medium"-->
  403. <!-- :key="id"-->
  404. <!-- v-for="id in userSelectList"-->
  405. <!-- closable-->
  406. <!-- :disable-transitions="false"-->
  407. <!-- @close="handleClosegroupUser(id)">-->
  408. <!-- <span v-for="list in companyUserList" :key="list.qwUserId" v-if="list.id==id">{{list.qwUserName}}</span>-->
  409. <!-- </el-tag>-->
  410. <!-- </div>-->
  411. <!-- </el-form-item>-->
  412. <!-- <el-form-item label="标签规则" prop="filterType">-->
  413. <!-- <el-radio-group v-model="form.filterType">-->
  414. <!-- <el-radio-->
  415. <!-- :label="1"-->
  416. <!-- >含全部标签</el-radio>-->
  417. <!-- <el-radio-->
  418. <!-- :label="2"-->
  419. <!-- >含任意标签</el-radio>-->
  420. <!-- </el-radio-group>-->
  421. <!-- </el-form-item>-->
  422. <!-- <el-form-item label="选择的标签" prop="tags">-->
  423. <!-- <el-select v-model="tags" remote multiple placeholder="请选择" filterable style="width: 100%;">-->
  424. <!-- <el-option-->
  425. <!-- v-for="dict in tagList"-->
  426. <!-- :label="dict.name"-->
  427. <!-- :value="dict.tagId">-->
  428. <!-- </el-option>-->
  429. <!-- </el-select>-->
  430. <!-- </el-form-item>-->
  431. <!-- <el-form-item label="排除的标签" prop="excludeTags">-->
  432. <!-- <el-select v-model="excludeTags" remote multiple placeholder="请选择" filterable style="width: 100%;">-->
  433. <!-- <el-option-->
  434. <!-- v-for="dict in tagList"-->
  435. <!-- :label="dict.name"-->
  436. <!-- :value="dict.tagId">-->
  437. <!-- </el-option>-->
  438. <!-- </el-select>-->
  439. <!-- </el-form-item>-->
  440. <!-- </div>-->
  441. <!-- <div v-if="form.type==1">-->
  442. <!-- <el-form-item label="推送方式 ">-->
  443. <!-- <el-tag type="success" v-model="form.sendType=2">AI插件</el-tag>-->
  444. <!-- </el-form-item>-->
  445. <!-- </div>-->
  446. <el-form-item label="开始时间" prop="startTime">
  447. <el-date-picker clearable size="small"
  448. v-model="form.startTime"
  449. type="date"
  450. value-format="yyyy-MM-dd"
  451. placeholder="选择开始时间">
  452. </el-date-picker>
  453. </el-form-item>
  454. <el-form-item label="模板" prop="tempId">
  455. <el-select v-model="form.tempId" @focus="selectListSopTemp(form.sendType)" placeholder="请选择模板"
  456. v-loading="tempListLoading">
  457. <el-option
  458. v-for="dict in tempList"
  459. :label="dict.name"
  460. :value="dict.id">
  461. </el-option>
  462. <div v-if="tempListLoading" slot="prefix" class="select-prefix">正在查询相应模板...</div>
  463. </el-select>
  464. </el-form-item>
  465. </el-form>
  466. <div slot="footer" class="dialog-footer">
  467. <el-button type="primary" @click="submitForm">确 定</el-button>
  468. <el-button @click="cancel">取 消</el-button>
  469. </div>
  470. </el-dialog>
  471. <el-dialog :title="listUser.title" :visible.sync="listUser.open" style="width: 1300px;height: 100%" append-to-body>
  472. <qwUserList ref="QwUserList" @selectUserList="selectUserList"></qwUserList>
  473. </el-dialog>
  474. <el-dialog
  475. :title="skipSopDialog.title"
  476. :visible.sync="skipSopDialog.open"
  477. width="600px"
  478. append-to-body
  479. >
  480. <el-form
  481. ref="skipSopForm"
  482. :model="skipSopForm"
  483. :rules="skipSopRules"
  484. label-width="80px"
  485. >
  486. <div v-for="(item, index) in skipSopForm.conditions" :key="index" class="condition-item" style="margin-bottom: 15px; padding: 10px; border: 1px solid #eee; border-radius: 4px;">
  487. <el-form-item :label="`第几天`" :prop="`conditions[${index}].dayNum`">
  488. <el-input
  489. v-model.number="item.dayNum"
  490. placeholder="输入天数(大于0)"
  491. style="width: 120px;"
  492. />
  493. </el-form-item>
  494. <el-form-item :label="`开始时间`" :prop="`conditions[${index}].startDate`">
  495. <el-time-select
  496. v-model="item.startDate"
  497. placeholder="选择开始时间"
  498. :picker-options="{ start: '00:00', step: '00:15', end: '23:45' }"
  499. style="width: 120px;"
  500. />
  501. </el-form-item>
  502. <el-form-item :label="`结束时间`" :prop="`conditions[${index}].endDate`">
  503. <el-time-select
  504. v-model="item.endDate"
  505. placeholder="选择结束时间"
  506. :picker-options="{ start: '00:00', step: '00:15', end: '23:45' }"
  507. style="width: 120px;"
  508. />
  509. </el-form-item>
  510. <el-button
  511. type="text"
  512. icon="el-icon-delete"
  513. style="color: #ff4949;"
  514. @click="removeCondition(index)"
  515. >删除</el-button>
  516. </div>
  517. <el-button
  518. type="text"
  519. icon="el-icon-plus"
  520. style="color: #409eff;"
  521. @click="addCondition"
  522. v-if="skipSopForm.conditions.length < 10"
  523. >添加条件</el-button>
  524. <div style="color: #999; font-size: 12px; margin-top: 10px;">
  525. <p>提示:</p>
  526. <p>2. 时间可填/不填(不填表示跳过整天)</p>
  527. </div>
  528. </el-form>
  529. <div slot="footer" class="dialog-footer">
  530. <el-button @click="cancelSkipSop">取消</el-button>
  531. <el-button type="primary" @click="submitSkipSop">确认跳过</el-button>
  532. </div>
  533. </el-dialog>
  534. <!-- 单独的修改时间 -->
  535. <el-dialog :title="outTimeOpen.title" :visible.sync="outTimeOpen.open" width="800px">
  536. <el-card class="box-card">
  537. <el-row>
  538. <el-col>
  539. <span>过期时间:</span>
  540. <el-input-number v-model="outTimeOpen.expiryTime" :min="1" :max="100"></el-input-number>
  541. (小时)
  542. </el-col>
  543. <el-col style="margin-top: 3%">
  544. <span>是否开启客户评级:</span>
  545. <el-switch
  546. v-model="outTimeOpen.isRating"
  547. active-color="#13ce66"
  548. inactive-color="#ff4949"
  549. :active-value="1"
  550. :inactive-value="2">
  551. </el-switch>
  552. <span v-if="outTimeOpen.isRating == '1'" style="margin-left: 10px;color: #13ce66">已开启</span>
  553. <span v-if="outTimeOpen.isRating == '2'" style="margin-left: 10px;color: #ff4949">已关闭</span>
  554. </el-col>
  555. <el-col style="margin-top: 3%">
  556. <span>小转天数:</span>
  557. <el-input-number v-model="outTimeOpen.minConversionDay"></el-input-number>
  558. (天)
  559. </el-col>
  560. <el-col style="margin-top: 3%">
  561. <span>大转天数:</span>
  562. <el-input-number v-model="outTimeOpen.maxConversionDay"></el-input-number>
  563. (天)
  564. </el-col>
  565. <el-col style="margin-top: 3%">
  566. <span>发课开始天数:</span>
  567. <el-input-number v-model="outTimeOpen.courseDay" :min="1" :max="100"></el-input-number>
  568. (天)
  569. </el-col>
  570. <el-col style="margin-top: 3%">
  571. <el-card>
  572. <el-radio-group v-model="outTimeOpen.isSampSend">
  573. <el-row :gutter="20">
  574. <el-col>
  575. <el-radio
  576. border size="medium"
  577. :label="1"
  578. style="font-size: 16px; margin: 10px 0;font-weight: bold"
  579. >【官方群发】 按照【营期+插件补发】的形式发</el-radio>
  580. <div style="color: #999;font-size: 14px;display: flex;align-items: center;margin-top: 2%;margin-left: 3%">
  581. <i class="el-icon-question"></i>
  582. 按照一个营期一个通用链接的形式,仅【营期详情】中(官方群发许可)为【是】的能用于官方群发,为【否】的按照 【sop插件】补发(ps:未注册用户全部不走官方群发,早上5点统一任务补发(官方群发的较少,补发及时))
  583. </div>
  584. </el-col>
  585. <el-col>
  586. <el-radio
  587. border size="medium"
  588. :label="2"
  589. style="font-size: 16px; margin: 10px 0;font-weight: bold"
  590. >【官方群发】 按照【营期+官方单链】的形式发</el-radio>
  591. <div style="color: #999;font-size: 14px;display: flex;align-items: center;margin-top: 2%;margin-left: 3%">
  592. <i class="el-icon-question"></i>
  593. 按照一个营期一个通用链接的形式,仅【营期详情】中(官方群发许可)为【是】的能用于官方群发,为【否】的按照 【官方一对一链接】(ps:未注册用户也走官方群发,7点开始查询补发(官方群发较多,补发相对不及时))
  594. </div>
  595. </el-col>
  596. </el-row>
  597. </el-radio-group>
  598. </el-card>
  599. <!-- <el-switch-->
  600. <!-- v-model="outTimeOpen.isSampSend"-->
  601. <!-- active-color="#13ce66"-->
  602. <!-- inactive-color="#ff4949"-->
  603. <!-- :active-value="1"-->
  604. <!-- :inactive-value="2">-->
  605. <!-- </el-switch>-->
  606. <!-- <span v-if="outTimeOpen.isSampSend == '1'" style="margin-left: 10px;color: #13ce66">是</span>-->
  607. <!-- <span v-if="outTimeOpen.isSampSend == '2'" style="margin-left: 10px;color: #ff4949">否</span>-->
  608. <!-- <div style="color: #999;font-size: 14px;display: flex;align-items: center;margin-top: 2%">-->
  609. <!-- <i class="el-icon-info"></i>-->
  610. <!-- 作用于【官方群发】,如果选择是,则按照【营期】发官方消息(ps),如果选择否,则按照 【一对一 单链】的形式发官方消息-->
  611. <!-- </div>-->
  612. </el-col>
  613. <el-col style="float: right;margin-top: 3%">
  614. <el-button type="primary" icon="el-icon-search" size="mini" @click="handleUpdateExpiryTime">确定修改
  615. </el-button>
  616. <el-button icon="el-icon-refresh" size="mini" @click="resetUpdateExpiryTime">取消</el-button>
  617. </el-col>
  618. </el-row>
  619. </el-card>
  620. </el-dialog>
  621. <!-- 单独的修改时间 -->
  622. <el-dialog title="语音记录" :visible.sync="voiceForm.open" width="70%" append-to-body>
  623. <el-row style="height: 600px">
  624. <el-button
  625. type="primary"
  626. plain
  627. icon="el-icon-plus"
  628. size="mini"
  629. @click="handleAdd"
  630. v-hasPermi="['qw:sop:add']"
  631. >新增
  632. </el-button>
  633. <el-table border :data="voiceForm.list">
  634. <el-table-column label="员工" align="center" prop="companyUserName"/>
  635. <el-table-column label="名称" align="center" prop="name"/>
  636. <el-table-column label="天数" align="center" prop="dayNum">
  637. <template slot-scope="scope">
  638. 第{{ scope.row.dayNum }}天
  639. </template>
  640. </el-table-column>
  641. <el-table-column label="发送时间" align="center" prop="time"/>
  642. <el-table-column label="语音文本" align="center" prop="voiceTxt"/>
  643. <el-table-column label="语音时长" align="center" prop="duration">
  644. <template slot-scope="scope">
  645. {{ scope.row.duration }}秒
  646. </template>
  647. </el-table-column>
  648. </el-table>
  649. <pagination
  650. v-show="voiceForm.total>0"
  651. :total="voiceForm.total"
  652. :page.sync="voiceForm.queryParams.pageNum"
  653. :limit.sync="voiceForm.queryParams.pageSize"
  654. @pagination="voice(voiceForm.queryParams.id)"
  655. />
  656. </el-row>
  657. </el-dialog>
  658. <el-dialog :title="autoSopOpen.title" :visible.sync="autoSopOpen.open" style="width: 1300px;height: 100%"
  659. append-to-body>
  660. <el-form ref="autoSopTimeFrom" :model="form.autoSopTime" :rules="autoSopTimeRules">
  661. <el-form-item label="自动类型" prop="type" style="margin: 2%; display: flex; align-items: center;">
  662. <el-radio-group v-model="form.autoSopTime.autoSopType">
  663. <el-radio
  664. :label="1"
  665. >当天开始
  666. </el-radio>
  667. <el-radio
  668. :label="2"
  669. >次日开始
  670. </el-radio>
  671. </el-radio-group>
  672. </el-form-item>
  673. <div style="display: flex; align-items: center; flex-wrap: nowrap;">
  674. <div v-if="form.autoSopTime.autoSopType==1" style="display: flex; align-items: center">
  675. <el-form-item
  676. label="起始时间"
  677. prop="autoStartTime"
  678. label-width="100px"
  679. style="margin: 2% 0;align-items: center;">
  680. <el-time-select
  681. style="width: 120px;"
  682. placeholder="起始时间"
  683. v-model="form.autoSopTime.autoStartTime"
  684. :picker-options="{
  685. start: '00:00',
  686. step: '00:15',
  687. end: '24:00'
  688. }">
  689. </el-time-select>
  690. </el-form-item>
  691. <el-form-item
  692. label="结束时间"
  693. prop="autoEndTime"
  694. label-width="100px"
  695. style="margin: 2% 0; align-items: center; ">
  696. <el-time-select
  697. style="width: 120px;"
  698. placeholder="结束时间"
  699. v-model="form.autoSopTime.autoEndTime"
  700. :picker-options="{
  701. start: '00:00',
  702. step: '00:15',
  703. end: '24:00',
  704. minTime: form.autoSopTime.autoEndTime
  705. }">
  706. </el-time-select>
  707. </el-form-item>
  708. </div>
  709. </div>
  710. <el-form-item v-if="form.autoSopTime.autoSopType==1" label="过期消息是否发送" prop="autoSopSend"
  711. style="margin: 2%; display: flex; align-items: center;">
  712. <el-radio-group v-model="form.autoSopTime.autoSopSend">
  713. <el-radio
  714. :label="1"
  715. >是
  716. </el-radio>
  717. <el-radio
  718. :label="2"
  719. >否
  720. </el-radio>
  721. </el-radio-group>
  722. </el-form-item>
  723. <el-alert
  724. v-if="form.autoSopTime.autoSopType==1"
  725. title="起始时间-结束时间之内的,当天立即创建SOP,时间之外的 次日创建SOP"
  726. type="warning"
  727. style="font-size: 15px; margin-top: 3%;"
  728. :closable="false"
  729. show-icon>
  730. </el-alert>
  731. </el-form>
  732. <div slot="footer" class="dialog-footer">
  733. <el-button type="primary" @click="submitAutoSopTimeFrom">确 定</el-button>
  734. <el-button @click="cancelAutoSopTime">取 消</el-button>
  735. </div>
  736. </el-dialog>
  737. <!-- 执行详情 -->
  738. <el-drawer :title="sopLogsDialog.title" :visible.sync="sopLogsDialog.open" size="85%" style="font-weight: bolder">
  739. <sopLogsDetails ref="sopLogsDetails" :rowDetailFrom="sopLogsDialog.sopLogsForm"></sopLogsDetails>
  740. </el-drawer>
  741. <el-dialog :title="sendMsgOpen.title" :visible.sync="sendMsgOpen.open" width="1000px" append-to-body>
  742. <el-form ref="msgForm" :model="msgForm" :rules="msgRules" label-width="100px">
  743. <el-form-item label="群">
  744. <el-select v-model="msgForm.chatIds" placeholder="请选择群" size="mini" multiple>
  745. <el-option
  746. v-for="chatId in sendMsgOpen.row && sendMsgOpen.row.chatId ? sendMsgOpen.row.chatId.split(',') : []"
  747. :key="chatId"
  748. :label="getChatName(chatId)"
  749. :value="chatId"
  750. />
  751. </el-select>
  752. </el-form-item>
  753. <el-form-item label="发送类型">
  754. <el-radio-group v-model="msgForm.sendType">
  755. <el-radio :label="1">群</el-radio>
  756. <el-radio :label="2">群成员</el-radio>
  757. </el-radio-group>
  758. </el-form-item>
  759. <el-form-item label="选择课程">
  760. <el-select v-model="msgForm.courseId" placeholder="请选择课程" style=" margin-right: 10px;" size="mini" @change="courseChange()">
  761. <el-option
  762. v-for="dict in courseList"
  763. :key="dict.dictValue"
  764. :label="dict.dictLabel"
  765. :value="parseInt(dict.dictValue)"
  766. />
  767. </el-select>
  768. <el-select v-model="msgForm.videoId" placeholder="请选择小节" size="mini" style=" margin-right: 10px;" @change="videoIdChange()" >
  769. <el-option
  770. v-for="dict in videoList"
  771. :key="dict.dictValue"
  772. :label="dict.dictLabel"
  773. :value="parseInt(dict.dictValue)"
  774. />
  775. </el-select>
  776. <el-select v-model="msgForm.courseType" placeholder="请选择消息类型" size="mini" style=" margin-right: 10px;">
  777. <el-option
  778. v-for="dict in sysFsSopWatchStatus"
  779. :key="dict.dictValue"
  780. :label="dict.dictLabel"
  781. :value="parseInt(dict.dictValue)"
  782. />
  783. </el-select>
  784. </el-form-item>
  785. <el-form-item label="规则" prop="setting" >
  786. <div v-for="(item, index) in setting" :key="index" style="background-color: #fdfdfd; border: 1px solid #e6e6e6; margin-bottom: 20px;">
  787. <el-row>
  788. <el-col :span="22">
  789. <el-form :model="item" label-width="70px">
  790. <el-form-item label="内容类别" style="margin: 2%">
  791. <el-radio-group v-model="item.contentType">
  792. <el-radio :label="item.dictValue" v-for="item in sysQwSopAiContentType" @change="handleContentTypeChange()">{{item.dictLabel}}</el-radio>
  793. </el-radio-group>
  794. </el-form-item>
  795. <el-form-item label="内容" style="margin-bottom: 2%" >
  796. <div v-if="item.contentType == 12">
  797. <!-- <div >-->
  798. <el-card class="box-card">
  799. <el-form-item label="直播间" >
  800. <el-select v-model="item.liveId"
  801. placeholder="请选择直播间" size="mini"
  802. @change="liveChange(item)" >
  803. <el-option
  804. v-for="dict in liveList"
  805. :key="dict.liveId"
  806. :label="dict.liveName"
  807. :value="dict.liveId"
  808. />
  809. </el-select>
  810. </el-form-item>
  811. <el-form-item label="标题" prop="miniprogramTitle">
  812. <el-input v-model="item.miniprogramTitle" placeholder="请输入小程序消息标题,最长为64字节" :rows="2" maxlength="64"
  813. type="textarea" />
  814. </el-form-item>
  815. <el-form-item label="封面" prop="miniprogramPicUrl">
  816. <ImageUpload v-model="item.miniprogramPicUrl" type="image" :num="10" :width="150" :height="150" />
  817. </el-form-item>
  818. <el-form-item label="appid" prop="miniprogramAppid" v-show="false">
  819. <el-input v-model="item.miniprogramAppid='wx503cf8ab31f83dd4' " disabled />
  820. </el-form-item>
  821. <el-form-item label="page路径" prop="miniprogramPage" v-show="false" label-width="100px" style="margin-left: -30px">
  822. <el-input v-model="item.miniprogramPage" placeholder="小程序消息打开后的路径" disabled />
  823. </el-form-item>
  824. </el-card>
  825. </div>
  826. <el-input v-if="item.contentType == 1 " v-model="item.value" type="textarea" :rows="3" placeholder="内容" style="width: 90%;margin-top: 10px;"/>
  827. <ImageUpload v-if="item.contentType == 2 " v-model="item.imgUrl" type="image" :num="1" :width="150" :height="150" />
  828. <div v-if="item.contentType == 3 ">
  829. <el-card class="box-card">
  830. <el-form-item label="链接标题:" label-width="100px">
  831. <el-input v-model="item.linkTitle" placeholder="请输入链接标题" style="width: 90%;"/>
  832. </el-form-item>
  833. <el-form-item label="链接描述:" label-width="100px" >
  834. <el-input type="textarea" :rows="3" v-model="item.linkDescribe" placeholder="请输入链接描述" style="width: 90%;margin-top: 1%;"/>
  835. </el-form-item>
  836. <el-form-item label="链接封面:" label-width="100px">
  837. <ImageUpload v-model="item.linkImageUrl" type="image" :num="1" :file-size="2" :width="150" :height="150" style="margin-top: 1%;" />
  838. </el-form-item>
  839. <el-form-item label="链接地址:" label-width="100px" >
  840. <el-tag type="warning" v-model="item.isBindUrl=1">选择的课程小节 即为卡片链接地址</el-tag>
  841. </el-form-item>
  842. </el-card>
  843. </div>
  844. <div v-if="item.contentType == 4">
  845. <el-card class="box-card">
  846. <el-form-item label="标题" prop="miniprogramTitle">
  847. <el-input v-model="item.miniprogramTitle" placeholder="请输入小程序消息标题,最长为64字" />
  848. </el-form-item>
  849. <el-form-item label="封面" prop="miniprogramPicUrl">
  850. <ImageUpload v-model="item.miniprogramPicUrl" type="image" :num="10" :width="150" :height="150" />
  851. </el-form-item>
  852. <el-form-item label="appid" prop="miniprogramAppid" v-show="false" >
  853. <el-input v-model="item.miniprogramAppid" disabled />
  854. </el-form-item>
  855. <el-form-item label="page路径" prop="miniprogramPage" v-show="false" label-width="100px" style="margin-left: -30px" >
  856. <el-input v-model="item.miniprogramPage" placeholder="小程序消息打开后的路径" disabled />
  857. </el-form-item>
  858. </el-card>
  859. </div>
  860. <div v-if="item.contentType == 5 ">
  861. <el-form-item label="上传文件:" prop="fileUrl" label-width="100px">
  862. <el-upload
  863. v-model="item.fileUrl"
  864. class="avatar-uploader"
  865. :action="uploadUrl"
  866. :show-file-list="false"
  867. :on-success="(res, file) => handleAvatarSuccessFile(res, file, item)"
  868. :before-upload="beforeAvatarUploadFile">
  869. <i class="el-icon-plus avatar-uploader-icon"></i>
  870. </el-upload>
  871. <el-link v-if="item.fileUrl" type="primary" :href="downloadUrl(item.fileUrl)" download>
  872. {{item.fileUrl}}
  873. </el-link>
  874. </el-form-item>
  875. </div>
  876. <div v-if="item.contentType == 6 ">
  877. <el-form-item label="上传视频:" prop="videoUrl" label-width="100px">
  878. <el-upload
  879. v-model="item.videoUrl"
  880. class="avatar-uploader"
  881. :action="uploadUrl"
  882. :show-file-list="false"
  883. :on-success="(res, file) => handleAvatarSuccessVideo(res, file, item)"
  884. :before-upload="beforeAvatarUploadVideo">
  885. <i class="el-icon-plus avatar-uploader-icon"></i>
  886. </el-upload>
  887. <video v-if="item.videoUrl"
  888. :src="item.videoUrl"
  889. controls style="width: 200px;height: 100px">
  890. </video>
  891. </el-form-item>
  892. </div>
  893. <div v-if="item.contentType == 7 ">
  894. <el-input
  895. v-model="item.value"
  896. type="textarea" :rows="3" maxlength="66" show-word-limit
  897. placeholder="输入要转为语音的内容" style="width: 90%;margin-top: 10px;"
  898. @input="handleInputVideoText(item.value,item)"/>
  899. </div>
  900. <div v-if="item.contentType == 10 ">
  901. <el-card class="box-card">
  902. <el-form-item label="链接标题:" label-width="100px">
  903. <el-input v-model="item.linkTitle" placeholder="请输入链接标题" style="width: 90%;"/>
  904. </el-form-item>
  905. <el-form-item label="链接描述:" label-width="100px" >
  906. <el-input type="textarea" :rows="3" v-model="item.linkDescribe" placeholder="请输入链接描述" style="width: 90%;margin-top: 1%;"/>
  907. </el-form-item>
  908. <el-form-item label="链接封面:" label-width="100px">
  909. <ImageUpload v-model="item.linkImageUrl" type="image" :num="1" :file-size="2" :width="150" :height="150" style="margin-top: 1%;" />
  910. </el-form-item>
  911. <el-form-item label="链接地址:" label-width="100px" >
  912. <el-tag type="warning" >链接地址自动生成</el-tag>
  913. </el-form-item>
  914. </el-card>
  915. </div>
  916. </el-form-item>
  917. <el-form-item label="添加短链" v-if="item.contentType == 1 " >
  918. <el-tooltip content="请先根据课程选定课程小节之后再添加" effect="dark" :disabled="!!msgForm.videoId">
  919. <el-switch
  920. v-model="item.isBindUrl"
  921. :disabled="!msgForm.videoId"
  922. active-color="#13ce66"
  923. inactive-color="#DCDFE6"
  924. active-value="1"
  925. inactive-value="2">
  926. </el-switch>
  927. </el-tooltip>
  928. <span v-if="item.isBindUrl == '1'" style="margin-left: 10px; color: #13ce66">添加URL</span>
  929. <span v-if="item.isBindUrl == '2'" style="margin-left: 10px; color: #b1b4ba">不加URL</span>
  930. </el-form-item>
  931. <el-form-item label="课节过期时间" v-if="item.isBindUrl == '1'
  932. && item.contentType != 2
  933. && item.contentType != 5
  934. && item.contentType != 6
  935. && item.contentType != 8
  936. && item.contentType != 9
  937. && item.contentType != 10"
  938. style="margin-top: 1%" label-width="100px">
  939. <el-row>
  940. <el-input-number v-model="item.expiresDays" :min="1" :max="100" ></el-input-number>
  941. (天)
  942. </el-row>
  943. <el-row>
  944. <span class="tip">填写0或不填时,默认为系统配置的默认时间</span>
  945. </el-row>
  946. </el-form-item>
  947. </el-form>
  948. </el-col>
  949. <el-col :span="1" :offset="1">
  950. <i class="el-icon-delete" @click="delSetList(index)" style="margin-top: 20px;" v-if="setting.length>1"></i>
  951. </el-col>
  952. </el-row>
  953. </div>
  954. <el-link type="primary" class="el-icon-plus" :underline="false" @click='addSetList()' >添加内容</el-link>
  955. </el-form-item>
  956. </el-form>
  957. <div slot="footer" class="dialog-footer">
  958. <el-button type="primary" @click="submitMsgForm">确 定</el-button>
  959. <el-button @click="cancelMsgForm">取 消</el-button>
  960. </div>
  961. </el-dialog>
  962. <!-- 修改规则名称对话框 -->
  963. <el-dialog :title="updateSopNameDialog.title" :visible.sync="updateSopNameDialog.open" width="500px" append-to-body>
  964. <el-form ref="updateSopNameForm" label-width="100px">
  965. <el-form-item label="规则名称">
  966. <el-input v-model="updateSopNameDialog.name" placeholder="请输入规则名称" maxlength="50" />
  967. </el-form-item>
  968. </el-form>
  969. <div slot="footer" class="dialog-footer">
  970. <el-button type="primary" @click="submitUpdateSopName">确 定</el-button>
  971. <el-button @click="updateSopNameDialog.open = false">取 消</el-button>
  972. </div>
  973. </el-dialog>
  974. </div>
  975. </template>
  976. <script>
  977. import {
  978. addSop,
  979. courseList,
  980. delSop, delSopLogs,
  981. exportSop,
  982. getSopVoiceList,
  983. listSop,
  984. updateAutoSopTime,
  985. updateSop,
  986. updateSopStatus,
  987. updateStatus,
  988. videoList,
  989. handleSkipSop,
  990. getSop
  991. } from '@/api/qw/sop'
  992. import {sendMsgSop} from "@/api/qw/sopUserLogsInfo";
  993. import {listSopTemp} from "@/api/qw/sopTemp";
  994. import {getQwAllUserList, listUser} from '@/api/company/companyUser'
  995. import qwUserList from '@/views/qw/user/qwUserList.vue'
  996. import ImageUpload from "@/views/qw/sop/ImageUpload";
  997. import CustomerGroupDetails from '@/views/qw/groupMsg/customerGroupDetails.vue'
  998. import sopLogsDetails from '@/views/qw/sopLogs/sopLogsList.vue'
  999. import {listTag,} from "@/api/qw/tag";
  1000. import {getMyQwCompanyList} from "@/api/qw/user";
  1001. import {allList} from "@/api/qw/groupChat";
  1002. import SendMsgSopOpenTool from '@/views/qw/sopUserLogsInfo/sendMsgSopOpenTool.vue'
  1003. import {listToLiveNoEnd} from "@/api/live/live";
  1004. export default {
  1005. name: "Sop",
  1006. components: {CustomerGroupDetails, qwUserList, ImageUpload, sopLogsDetails, SendMsgSopOpenTool},
  1007. data() {
  1008. return {
  1009. skipSopDialog: {
  1010. open: false,
  1011. title: "跳过SOP操作",
  1012. rowId: null, // 目标SOP的ID
  1013. },
  1014. // 跳过SOP表单
  1015. skipSopForm: {
  1016. conditions: [
  1017. {
  1018. dayNum: 1, // 第几天
  1019. startDate: "", // 开始时间
  1020. endDate: "", // 结束时间
  1021. },
  1022. ],
  1023. },
  1024. // 跳过SOP表单验证规则
  1025. skipSopRules: {
  1026. dayNum: [
  1027. { required: true, message: "天数不能为空", trigger: "blur" },
  1028. { type: "number", min: 1, message: "天数必须大于0", trigger: "blur" },
  1029. ],
  1030. startDate: [
  1031. { pattern: /^([01]\d|2[0-3]):[0-5]\d$/, message: "时间格式为HH:mm", trigger: "blur" },
  1032. ],
  1033. endDate: [
  1034. { pattern: /^([01]\d|2[0-3]):[0-5]\d$/, message: "时间格式为HH:mm", trigger: "blur" },
  1035. ],
  1036. },
  1037. // 存储每一行的展开状态
  1038. expandedRows: {},
  1039. //模板查询
  1040. tempListLoading: false,
  1041. voiceLoading :false,
  1042. uploadUrl:process.env.VUE_APP_BASE_API+"/common/uploadOSS",
  1043. uploadUrlByVoice:process.env.VUE_APP_BASE_API+"/common/uploadOSSByHOOKVoice",
  1044. // 遮罩层
  1045. loading: false,
  1046. // 导出遮罩层
  1047. exportLoading: false,
  1048. videoList:[],
  1049. // 选中数组
  1050. ids: [],
  1051. //选中的map
  1052. selectionMap: {},
  1053. myQwCompanyList: [],
  1054. //销售员工列表
  1055. companyUserLists: [],
  1056. chatList: [],
  1057. courseList: [],
  1058. sendMsgOpen:{
  1059. title:'一键批量群发',//标记todo copyLMX
  1060. open:false,
  1061. row: {},
  1062. ids:null,
  1063. },
  1064. // videoList:[],
  1065. tags: null,
  1066. excludeTags: null,
  1067. // 非单个禁用
  1068. single: true,
  1069. setting: [],
  1070. tagList: [],
  1071. tempList: [],
  1072. // 非多个禁用
  1073. multiple: true,
  1074. // 显示搜索条件
  1075. showSearch: true,
  1076. // 总条数
  1077. total: 0,
  1078. msgForm:{
  1079. videoId:null,
  1080. courseId:null,
  1081. courseType:null,
  1082. userIdParam:null,
  1083. sendType:1,
  1084. setting:null,
  1085. ids:null,
  1086. sopId: null,
  1087. startTime: null,
  1088. chatIds: [],
  1089. isRegister:2
  1090. },
  1091. // 企微sop表格数据
  1092. sopList: [],
  1093. // 弹出层标题
  1094. title: "",
  1095. // 是否显示弹出层
  1096. open: false,
  1097. companyUserList: [],
  1098. // 状态字典
  1099. statusOptions: [],
  1100. //sop状态
  1101. sysSopStatus: [],
  1102. autoSopOpen: {
  1103. title: '',
  1104. open: false,
  1105. id: null,
  1106. isAutoSop: null,
  1107. },
  1108. outTimeOpen: {
  1109. title: '',
  1110. open: false,
  1111. id: null,
  1112. tempId: null,
  1113. expiryTime: null,
  1114. isRating: null,
  1115. isSampSend:null,
  1116. },
  1117. updateSopNameDialog: {
  1118. title: '修改规则名称',
  1119. open: false,
  1120. id: null,
  1121. name: ''
  1122. },
  1123. voiceForm: {
  1124. list: [],
  1125. open: false,
  1126. total: 0,
  1127. queryParams: {
  1128. pageNum: 1,
  1129. pageSize: 10,
  1130. id: null,
  1131. },
  1132. },
  1133. //企微SOP发送类型
  1134. sysQwSopType: [],
  1135. sysQwSopAiContentType: [],
  1136. //SOP课程观看状态
  1137. sysFsSopWatchStatus: [],
  1138. // 查询参数
  1139. queryParams: {
  1140. pageNum: 1,
  1141. pageSize: 10,
  1142. id: null,
  1143. name: null,
  1144. status: null,
  1145. sendType: null,
  1146. type: null,
  1147. qwUserIds: null,
  1148. setting: null,
  1149. createBy: null,
  1150. corpId: null,
  1151. createTime: null
  1152. },
  1153. sopLogsDialog: {
  1154. title: '',
  1155. open: false,
  1156. sopLogsForm: [],
  1157. },
  1158. // 表单参数
  1159. form: {
  1160. autoSopTime: {autoSopType: 2, autoStartTime: '00:00', autoEndTime: '24:00', autoSopSend: 2},
  1161. },
  1162. userSelectList: [],
  1163. listUser: {
  1164. title: "",
  1165. open: false
  1166. },
  1167. msgRules:{},
  1168. // 表单校验
  1169. rules: {
  1170. name: [{required: true, message: "名称不能为空", trigger: "submit"}],
  1171. type: [{required: true, message: "不能为空", trigger: "submit"}],
  1172. sendType: [{required: true, message: "不能为空", trigger: "submit"}],
  1173. startTime: [{required: true, message: "开始时间不能为空", trigger: "submit"}],
  1174. tempId: [{required: true, message: "模板不能为空", trigger: "submit"}],
  1175. },
  1176. autoSopTimeRules: {
  1177. autoSopType: [{required: true, message: "选项不能为空", trigger: "submit"}],
  1178. autoStartTime: [{required: true, message: "起始时间不能为空", trigger: "submit"}],
  1179. autoEndTime: [{required: true, message: "结束时间不能为空", trigger: "submit"}],
  1180. },
  1181. liveList: [],
  1182. };
  1183. },
  1184. created() {
  1185. listToLiveNoEnd().then(response => {
  1186. this.liveList = response.rows;
  1187. })
  1188. this.getDicts("sys_sop_status").then(response => {
  1189. this.sysSopStatus = response.data;
  1190. });
  1191. this.getDicts("sys_company_status").then(response => {
  1192. this.statusOptions = response.data;
  1193. });
  1194. this.getDicts("sys_qw_sop_type").then(response => {
  1195. this.sysQwSopType = response.data;
  1196. });
  1197. this.getDicts("sys_qwSopAi_contentType").then(response => {
  1198. this.sysQwSopAiContentType = response.data;
  1199. });
  1200. this.getDicts("sys_fs_sop_watch_status").then(response => {
  1201. this.sysFsSopWatchStatus = response.data;
  1202. });
  1203. listUser().then(res => {
  1204. this.companyUserLists = res.rows;
  1205. }
  1206. );
  1207. courseList().then(response => {
  1208. this.courseList = response.list;
  1209. });
  1210. getMyQwCompanyList().then(response => {
  1211. this.myQwCompanyList = response.data;
  1212. if (this.myQwCompanyList != null) {
  1213. this.queryParams.corpId = this.myQwCompanyList[0].dictValue;
  1214. this.refreshData(this.queryParams.corpId);
  1215. this.getList();
  1216. }
  1217. });
  1218. },
  1219. watch: {
  1220. userSelectList(newList) {
  1221. this.form.qwUserIds = newList.map(item => item.id);
  1222. }
  1223. },
  1224. methods: {
  1225. handleSkipSop(row) {
  1226. const ids = row.id || this.ids;
  1227. // 获取原始数据详情
  1228. getSop(ids).then(response => {
  1229. // 解析skipSopJson字段中的数据
  1230. if (response.data && response.data.skipSopJson) {
  1231. try {
  1232. const skipData = JSON.parse(response.data.skipSopJson);
  1233. if (Array.isArray(skipData)) {
  1234. // 如果是数组格式,直接赋值
  1235. this.skipSopForm.conditions = skipData.length > 0 ? skipData : [
  1236. { dayNum: 1, startDate: "", endDate: "" }
  1237. ];
  1238. } else if (skipData.conditions && Array.isArray(skipData.conditions)) {
  1239. // 如果是对象格式且包含conditions数组
  1240. this.skipSopForm.conditions = skipData.conditions.length > 0 ? skipData.conditions : [
  1241. { dayNum: 1, startDate: "", endDate: "" }
  1242. ];
  1243. } else {
  1244. // 如果是其他格式,尝试直接使用skipData(假设它本身就是条件数组)
  1245. this.skipSopForm.conditions = Array.isArray(skipData) ? skipData : [
  1246. { dayNum: 1, startDate: "", endDate: "" }
  1247. ];
  1248. }
  1249. } catch (e) {
  1250. console.error('解析skipSopJson失败', e);
  1251. // 如果解析失败,使用默认值
  1252. this.skipSopForm.conditions = [
  1253. { dayNum: 1, startDate: "", endDate: "" }
  1254. ];
  1255. }
  1256. } else {
  1257. // 如果没有skipSopJson数据,使用默认值
  1258. this.skipSopForm.conditions = [
  1259. { dayNum: 1, startDate: "", endDate: "" }
  1260. ];
  1261. }
  1262. // 设置弹窗数据
  1263. this.skipSopDialog.rowId = ids;
  1264. this.skipSopDialog.open = true;
  1265. }).catch(error => {
  1266. console.error('获取SOP详情失败', error);
  1267. // 出错时也打开弹窗,使用默认数据
  1268. this.skipSopForm.conditions = [
  1269. { dayNum: 1, startDate: "", endDate: "" }
  1270. ];
  1271. this.skipSopDialog.rowId = ids;
  1272. this.skipSopDialog.open = true;
  1273. });
  1274. },
  1275. // 添加条件
  1276. addCondition() {
  1277. if (this.skipSopForm.conditions.length >= 10) {
  1278. this.$message.warning("最多只能添加10个条件");
  1279. return;
  1280. }
  1281. this.skipSopForm.conditions.push({
  1282. dayNum: this.skipSopForm.conditions.length + 1,
  1283. startDate: "",
  1284. endDate: "",
  1285. });
  1286. },
  1287. // 删除条件
  1288. removeCondition(index) {
  1289. // if (this.skipSopForm.conditions.length <= 1) {
  1290. // this.$message.warning("至少需要保留一个条件");
  1291. // return;
  1292. // }
  1293. this.skipSopForm.conditions.splice(index, 1);
  1294. this.validateDuplicateDays(); // 删后验证天数重复
  1295. },
  1296. // 验证天数是否重复
  1297. validateDuplicateDays() {
  1298. const days = this.skipSopForm.conditions.map((c) => c.dayNum);
  1299. const uniqueDays = [...new Set(days)];
  1300. if (days.length !== uniqueDays.length) {
  1301. // this.$message.warning("不能有重复的天数");
  1302. // return false;
  1303. }
  1304. return true;
  1305. },
  1306. // 提交跳过SOP
  1307. submitSkipSop() {
  1308. this.$refs.skipSopForm.validate((valid) => {
  1309. if (!valid) return;
  1310. // 验证天数不重复
  1311. if (!this.validateDuplicateDays()) return;
  1312. // 验证时间逻辑
  1313. let timeValid = true;
  1314. this.skipSopForm.conditions.forEach((item, idx) => {
  1315. if (item.startDate && item.endDate) {
  1316. // 比较时间(HH:mm格式)
  1317. const start = item.startDate.replace(":", "");
  1318. const end = item.endDate.replace(":", "");
  1319. if (start >= end) {
  1320. this.$message.warning(`第${idx + 1}个条件:结束时间必须晚于开始时间`);
  1321. timeValid = false;
  1322. }
  1323. } else if ((item.startDate && !item.endDate) || (!item.startDate && item.endDate)) {
  1324. this.$message.warning(`第${idx + 1}个条件:开始/结束时间需同时填写或同时为空`);
  1325. timeValid = false;
  1326. }
  1327. });
  1328. if (!timeValid) return;
  1329. // 构造请求参数(根据后端接口调整)
  1330. const params = {
  1331. sopId: this.skipSopDialog.rowId,
  1332. paramList: this.skipSopForm.conditions.map((item) => ({
  1333. dayNum: item.dayNum,
  1334. startDate: item.startDate || null,
  1335. endDate: item.endDate || null,
  1336. })),
  1337. };
  1338. // 调用后端接口(需替换为实际接口)
  1339. // 示例:apiSkipSop(params).then(...)
  1340. this.$confirm("确定要跳过这些SOP任务吗?", "确认", {
  1341. type: "warning",
  1342. }).then(() => {
  1343. // 这里替换为实际的接口请求 handleSkipSop
  1344. setTimeout(() => {
  1345. handleSkipSop(params).then(response => {
  1346. }).catch(error => {
  1347. console.error('跳过SOP操作失败:', error);
  1348. this.$message.error('跳过SOP操作失败');
  1349. });
  1350. this.$message.success("跳过SOP操作成功");
  1351. this.skipSopDialog.open = false;
  1352. this.getList(); // 刷新列表
  1353. }, 500);
  1354. });
  1355. });
  1356. },
  1357. // 取消跳过SOP
  1358. cancelSkipSop() {
  1359. this.skipSopDialog.open = false;
  1360. if (this.$refs.skipSopForm) {
  1361. this.$refs.skipSopForm.resetFields();
  1362. }
  1363. },
  1364. /**
  1365. * SOP任务营期一键群发
  1366. */
  1367. handleCampSendMsg(){
  1368. setTimeout(() => {
  1369. this.$refs.sendMsgSopOpenTool.oneClickGroupSending(this.ids,2,this.queryParams.corpId,0);
  1370. }, 500);
  1371. },
  1372. voice(id) {
  1373. this.voiceForm.queryParams.id = id;
  1374. getSopVoiceList(this.voiceForm.queryParams).then(res => {
  1375. this.voiceForm.list = res.rows;
  1376. this.voiceForm.total = res.total;
  1377. this.voiceForm.open = true;
  1378. })
  1379. },
  1380. // 单元格点击事件
  1381. handleCellClick(row, column, cell, event) {
  1382. // 判断是否为规则编号列
  1383. if (column.property === 'id') {
  1384. this.handleRowClick(row); // 触发规则编号点击事件
  1385. }
  1386. },
  1387. // handleUpdateTags(){
  1388. //
  1389. // },
  1390. // handleUpdateQwUser(){
  1391. //
  1392. // },
  1393. // handleUpdateSopTemp(){
  1394. //
  1395. // },
  1396. handleRowClick(row, column, event) {
  1397. // 判断状态是否符合条件
  1398. if (row.status == 2 || row.status == 0 || row.status == 3 || row.status == 4) {
  1399. this.handleUpdate(row, 2);
  1400. }
  1401. },
  1402. // 切换某一行的展开状态
  1403. toggleRow(row) {
  1404. this.$set(this.expandedRows, row.id, !this.expandedRows[row.id]);
  1405. },
  1406. getSwitchVal(status) {
  1407. return [2, 3, 4].includes(status) ? 2 : 0;
  1408. },
  1409. onSwitchChange(row, val) {
  1410. this.loading = true;
  1411. // ① 调用接口更新后端
  1412. updateSopStatus({id: row.id, status: val})
  1413. .then(() => {
  1414. row.status = val;
  1415. this.loading = false;
  1416. this.$message.success("切换成功!");
  1417. })
  1418. .catch(() => {
  1419. this.loading = false;
  1420. this.$message.error("操作失败,请重试");
  1421. });
  1422. },
  1423. switchSopStatusChange(row, checked) {
  1424. let loadingRock = this.$loading({
  1425. lock: true,
  1426. text: '暂停中-请勿刷新页面-重复点击',
  1427. spinner: 'el-icon-loading',
  1428. background: 'rgba(0, 0, 0, 0.7)'
  1429. });
  1430. updateSopStatus({id: row, status: checked}).then(response => {
  1431. this.$message.success("修改成功");
  1432. this.getList();
  1433. }).finally(res => {
  1434. loadingRock.close();
  1435. })
  1436. },
  1437. //新客户自动创建sop
  1438. switchAutoSopChange(row, checked) {
  1439. if (checked == 1) {
  1440. this.autoSopOpen.title = '请设置相应时间段'
  1441. this.autoSopOpen.open = true;
  1442. this.autoSopOpen.id = row;
  1443. this.autoSopOpen.isAutoSop = 1;
  1444. } else {
  1445. this.form.autoSopTime.createTime = this.formatDateTo24HourString(new Date());
  1446. updateAutoSopTime({
  1447. id: row,
  1448. isAutoSop: checked,
  1449. autoSopTime: JSON.stringify(this.form.autoSopTime)
  1450. }).then(response => {
  1451. this.getList();
  1452. })
  1453. }
  1454. },
  1455. updateCorpId() {
  1456. this.reset();
  1457. this.refreshData(this.queryParams.corpId);
  1458. this.queryParams.qwUserId = null;
  1459. this.getList();
  1460. },
  1461. //刷新部分数据
  1462. refreshData(row) {
  1463. getQwAllUserList(row).then(response => {
  1464. this.companyUserList = response.data;
  1465. });
  1466. listTag({corpId: row}).then(response => {
  1467. this.tagList = response.rows;
  1468. });
  1469. if (row != null) {
  1470. allList(row).then(e => {
  1471. this.chatList = e.data;
  1472. })
  1473. }
  1474. },
  1475. //查询模板
  1476. selectListSopTemp(type) {
  1477. this.tempListLoading = true; // 开始查询,显示加载提示
  1478. listSopTemp({sendType: type}).then(response => {
  1479. this.tempList = response.rows;
  1480. this.tempListLoading = false;
  1481. });
  1482. },
  1483. handlelistUser(type, sendType) {
  1484. setTimeout(() => {
  1485. this.$refs.QwUserList.getDetails(this.queryParams.corpId, type, sendType);
  1486. }, 1);
  1487. this.listUser.title = "选择企业成员"
  1488. this.listUser.open = true;
  1489. },
  1490. selectUserList(list) {
  1491. this.listUser.open = false;
  1492. list.forEach(obj => {
  1493. if (!this.userSelectList.some(item => item == obj.id)) {
  1494. this.userSelectList.push(obj.id);
  1495. }
  1496. });
  1497. },
  1498. //修改过期时间
  1499. handleUpdateOutTime(val) {
  1500. console.log("valval",val)
  1501. this.outTimeOpen.title = "修改过期时间/评级";
  1502. this.outTimeOpen.id = val.id;
  1503. this.outTimeOpen.tempId = val.tempId;
  1504. this.outTimeOpen.expiryTime = val.expiryTime;
  1505. this.outTimeOpen.isRating = val.isRating;
  1506. this.outTimeOpen.minConversionDay=val.minConversionDay;
  1507. this.outTimeOpen.maxConversionDay=val.maxConversionDay;
  1508. this.outTimeOpen.courseDay=val.courseDay;
  1509. this.outTimeOpen.isSampSend=val.isSampSend;
  1510. this.outTimeOpen.open = true;
  1511. },
  1512. handleUpdateExpiryTime() {
  1513. updateSop({
  1514. id: this.outTimeOpen.id,
  1515. tempId: this.outTimeOpen.tempId,
  1516. expiryTime: this.outTimeOpen.expiryTime,
  1517. isRating: this.outTimeOpen.isRating,
  1518. minConversionDay: this.outTimeOpen.minConversionDay,
  1519. maxConversionDay: this.outTimeOpen.maxConversionDay,
  1520. courseDay: this.outTimeOpen.courseDay,
  1521. isSampSend:this.outTimeOpen.isSampSend
  1522. }).then(response => {
  1523. this.msgSuccess("修改成功");
  1524. this.resetUpdateExpiryTime()
  1525. this.getList();
  1526. });
  1527. },
  1528. resetUpdateExpiryTime() {
  1529. this.outTimeOpen = {
  1530. title: '',
  1531. open: false,
  1532. id: null,
  1533. expiryTime: null,
  1534. courseDay: null,
  1535. minConversionDay: null,
  1536. maxConversionDay: null,
  1537. isRating: null,
  1538. isSampSend:null,
  1539. }
  1540. },
  1541. addContent(index) {
  1542. // this.setting[index].content.push({type:1})
  1543. if (this.form.sendType == 2) {
  1544. this.setting[index].content.push({type: 1});
  1545. } else {
  1546. if (this.setting[index].content.length < 9) {
  1547. this.setting[index].content.push({type: 1});
  1548. } else {
  1549. this.$message({
  1550. message: '最多只能添加 9 个内容',
  1551. type: 'warning'
  1552. });
  1553. }
  1554. }
  1555. },
  1556. //选择变动时的变动
  1557. handleSendTypeChange(val) {
  1558. this.tempList = [];
  1559. this.form.tempId = null;
  1560. if (val == 1) {
  1561. // 遍历 this.setting 数组并清空每个对象的 content 属性
  1562. this.setting.forEach(item => {
  1563. if (item.content.length > 9) {
  1564. item.content = item.content.slice(0, 9); // 保留前 9 个元素
  1565. }
  1566. });
  1567. }
  1568. },
  1569. delContent(index, contentIndex) {
  1570. this.setting[index].content.splice(contentIndex, 1)
  1571. },
  1572. //添加SOP规则类型
  1573. handleCommand(command) {
  1574. this.setting.push({
  1575. sopType: command,
  1576. ruleType: null,
  1577. name: null,
  1578. type: 1,
  1579. content: [],
  1580. isBindUrl: 1,
  1581. url: null,
  1582. day: "0",
  1583. hour: "0",
  1584. minute: "0",
  1585. time: ""
  1586. })
  1587. },
  1588. //添加课程SOP
  1589. handleCrouseCommand(command, val) {
  1590. console.log("command", command)
  1591. console.log("val", val)
  1592. },
  1593. delSetting(index) {
  1594. this.setting.splice(index, 1)
  1595. },
  1596. handleClosegroupUser(list) {
  1597. const index = this.userSelectList.findIndex(t => t === list);
  1598. if (index !== -1) {
  1599. this.userSelectList.splice(index, 1);
  1600. }
  1601. },
  1602. /** 查询企微sop列表 */
  1603. getList() {
  1604. this.loading = true;
  1605. listSop(this.queryParams).then(response => {
  1606. this.sopList = response.rows;
  1607. this.total = response.total;
  1608. this.loading = false;
  1609. listSopTemp().then(res => {
  1610. this.tempList = res.rows;
  1611. });
  1612. });
  1613. },
  1614. addSetList(){
  1615. const newSetting = {
  1616. contentType:'1',
  1617. value: '',
  1618. };
  1619. // 将新设置项添加到 content.setting 数组中
  1620. this.setting.push(newSetting);
  1621. },
  1622. handleContentTypeChange() {
  1623. //如果是链接的才上
  1624. if (this.msgForm.courseId != null ) {
  1625. const selectedCourse = this.courseList.find(course => parseInt(course.dictValue) === this.msgForm.courseId);
  1626. for (let i = 0; i < this.setting.length; i++) {
  1627. //响应式直接给链接的标题/封面上值
  1628. if (selectedCourse && this.setting[i].contentType == 3 && this.msgForm.courseId != null) {
  1629. this.$set(this.setting[i], 'linkTitle', selectedCourse.dictLabel);
  1630. this.$set(this.setting[i], 'linkImageUrl', selectedCourse.dictImgUrl);
  1631. }
  1632. if (selectedCourse && this.setting[i].contentType == 4 && this.msgForm.courseId != null) {
  1633. this.$set(this.setting[i], 'miniprogramPicUrl', selectedCourse.dictImgUrl);
  1634. }
  1635. }
  1636. }
  1637. if (this.msgForm.videoId != null) {
  1638. // 查找选中的课节对应的 label
  1639. const selectedVideo = this.videoList.find(course => parseInt(course.dictValue) === this.msgForm.videoId);
  1640. for (let i = 0; i < this.setting.length; i++) {
  1641. //响应式直接给链接的描述上值
  1642. if (selectedVideo && this.msgForm.videoId != null) {
  1643. console.log(2, this.setting[i].contentType)
  1644. if (this.setting[i].contentType == 3 || this.setting[i].contentType == 9) {
  1645. this.$set(this.setting[i], 'linkDescribe', selectedVideo.dictLabel);
  1646. }
  1647. if (this.setting[i].contentType == 4) {
  1648. this.$set(this.setting[i], 'miniprogramTitle', selectedVideo.dictLabel);
  1649. }
  1650. }
  1651. }
  1652. }
  1653. },
  1654. videoIdChange() {
  1655. if (this.msgForm.videoId != null) {
  1656. // 查找选中的课节对应的 label
  1657. const selectedVideo = this.videoList.find(course => parseInt(course.dictValue) === this.msgForm.videoId);
  1658. for (let i = 0; i < this.setting.length; i++) {
  1659. //响应式直接给链接的描述上值
  1660. if (selectedVideo && this.msgForm.videoId != null) {
  1661. if (this.setting[i].contentType == 3 || this.setting[i].contentType == 9) {
  1662. this.$set(this.setting[i], 'linkDescribe', selectedVideo.dictLabel);
  1663. }
  1664. if (this.setting[i].contentType == 4) {
  1665. this.$set(this.setting[i], 'miniprogramTitle', selectedVideo.dictLabel);
  1666. }
  1667. }
  1668. }
  1669. }
  1670. },
  1671. // 取消按钮
  1672. cancel() {
  1673. this.open = false;
  1674. this.reset();
  1675. },
  1676. // courseChange(){
  1677. // videoList(this.form.courseId).then(response => {
  1678. // this.videoList = response.list;
  1679. // });
  1680. // },
  1681. // 表单重置
  1682. reset() {
  1683. this.form = {
  1684. id: null,
  1685. name: null,
  1686. status: 1,
  1687. sendType: 2,
  1688. type: 2,
  1689. filterType: 2,
  1690. qwUserIds: null,
  1691. corpId: null,
  1692. setting: null,
  1693. createBy: null,
  1694. createTime: null,
  1695. isAutoSop: null,
  1696. autoSopTime: {autoSopType: 2, autoStartTime: '00:00', autoEndTime: '24:00', autoSopSend: 2},
  1697. };
  1698. this.resetForm("form");
  1699. this.tags = null;
  1700. this.excludeTags = null;
  1701. },
  1702. /** 搜索按钮操作 */
  1703. handleQuery() {
  1704. this.queryParams.pageNum = 1;
  1705. this.getList();
  1706. },
  1707. /** 重置按钮操作 */
  1708. resetQuery() {
  1709. this.resetForm("queryForm");
  1710. this.queryParams.corpId = this.myQwCompanyList[0].dictValue;
  1711. this.refreshData(this.queryParams.corpId);
  1712. this.handleQuery();
  1713. },
  1714. // 多选框选中数据
  1715. handleSelectionChange(selection) {
  1716. this.ids = selection.map(item => item.id)
  1717. this.selectionMap = selection;
  1718. this.single = selection.length !== 1
  1719. this.multiple = !selection.length
  1720. },
  1721. /** 新增按钮操作 */
  1722. handleAdd() {
  1723. this.reset();
  1724. this.$router.push('/qw/sop/addSop/' + this.queryParams.corpId+"/"+1)
  1725. // this.open = true;
  1726. // this.setting=[]
  1727. // this.userSelectList=[]
  1728. // this.title = "添加企微sop";
  1729. },
  1730. /** 修改按钮操作 */
  1731. handleUpdate(row, type) {
  1732. this.$router.push('/qw/sop/updateSop/' + row.id + '/' + type)
  1733. },
  1734. /** 修改规则名称 */
  1735. handleUpdateSopName(row) {
  1736. this.updateSopNameDialog.id = row.id;
  1737. this.updateSopNameDialog.name = row.name;
  1738. this.updateSopNameDialog.open = true;
  1739. },
  1740. /** 提交修改规则名称 */
  1741. submitUpdateSopName() {
  1742. if (!this.updateSopNameDialog.name || this.updateSopNameDialog.name.trim() === '') {
  1743. this.$message.error('规则名称不能为空');
  1744. return;
  1745. }
  1746. const data = {
  1747. id: this.updateSopNameDialog.id,
  1748. name: this.updateSopNameDialog.name
  1749. };
  1750. this.$confirm('是否确认修改规则名称为"' + data.name + '"?', "警告", {
  1751. confirmButtonText: "确定",
  1752. cancelButtonText: "取消",
  1753. type: "warning"
  1754. }).then(() => {
  1755. return updateSop(data);
  1756. }).then(response => {
  1757. this.msgSuccess("修改规则名称成功");
  1758. this.updateSopNameDialog.open = false;
  1759. this.getList();
  1760. }).catch(() => {
  1761. });
  1762. },
  1763. /**
  1764. * 查看SOP任务内营期
  1765. */
  1766. selectSchedule(row) {
  1767. const query = {
  1768. id: row.id,
  1769. name: row.name,
  1770. tempId: row.tempId,
  1771. filterMode: row.filterMode,
  1772. corpId: row.corpId,
  1773. type: 1,
  1774. }
  1775. // 使用 params 传递参数
  1776. this.$router.push({
  1777. path: `/qw/sopUserLogs/sopUserLogsSchedule/${query.id}`,
  1778. query// 如果需要传递更多参数,可以使用 query
  1779. });
  1780. },
  1781. /**
  1782. * 查看营期内详情
  1783. */
  1784. handleScheduleDetail(row) {
  1785. this.sopLogsDialog.title = '规则执行详情';
  1786. this.sopLogsDialog.open = true;
  1787. this.sopLogsDialog.sopLogsForm = row;
  1788. // 使用Vue.set或this.$set添加新字段
  1789. this.$set(this.sopLogsDialog.sopLogsForm, 'filterSopType', 1);
  1790. },
  1791. handleAvatarSuccessFile(res, file, item) {
  1792. if (res.code === 200) {
  1793. // 使用 $set 确保响应式更新
  1794. this.$set(item, 'fileUrl', res.url);
  1795. } else {
  1796. this.msgError(res.msg);
  1797. }
  1798. },
  1799. beforeAvatarUploadFile(file){
  1800. const isLt1M = file.size / 1024 / 1024 < 10;
  1801. if (!isLt1M) {
  1802. this.$message.error('上传大小不能超过 10MB!');
  1803. }
  1804. return isLt1M;
  1805. },
  1806. //下载文件
  1807. downloadUrl(materialUrl) {
  1808. // 直接返回文件 URL
  1809. return materialUrl;
  1810. },
  1811. handleAvatarSuccessVideo(res, file, item) {
  1812. if(res.code==200){
  1813. // 使用 $set 确保响应式更新
  1814. this.$set(item, 'videoUrl', res.url);
  1815. }
  1816. else{
  1817. this.msgError(res.msg);
  1818. }
  1819. },
  1820. beforeAvatarUploadVideo(file){
  1821. const isLt30M = file.size / 1024 / 1024 < 10;
  1822. const isMP4 = file.type === 'video/mp4';
  1823. if (!isMP4) {
  1824. this.$message.error('仅支持上传 MP4 格式的视频文件!');
  1825. return false;
  1826. }
  1827. if (!isLt30M) {
  1828. this.$message.error('上传大小不能超过 10MB!');
  1829. return false;
  1830. }
  1831. return true;
  1832. },
  1833. handleInputVideoText(value,content){
  1834. // 允许的字符:中文、英文(大小写)、数字和指定标点符号(,。!?)
  1835. const regex = /^[\u4e00-\u9fa5,。!?,!?]+$/;
  1836. // 删除不符合条件的字符
  1837. const filteredValue = value.split('').filter(char => regex.test(char)).join('');
  1838. this.$set(content, 'value', filteredValue);
  1839. },
  1840. /**
  1841. * 查看模板
  1842. */
  1843. handleQueryDetails(row) {
  1844. this.$router.push(`/qw/sopTemp/updateSopTemp/${row.tempId}/3`)
  1845. },
  1846. /** 提交按钮 */
  1847. submitForm() {
  1848. this.$refs["form"].validate(valid => {
  1849. if (valid) {
  1850. if (this.userSelectList.length <= 0) {
  1851. return this.$message("请选择员工")
  1852. }
  1853. this.form.qwUserIds = this.userSelectList.join(",");
  1854. this.form.corpId = this.queryParams.corpId;
  1855. if (this.tags != null && this.tags.length > 0) {
  1856. this.form.tags = (this.tags).toString()
  1857. } else {
  1858. return this.$message.error("选择的标签不能为空!!请选择筛选的标签")
  1859. }
  1860. if (this.excludeTags != null) {
  1861. this.form.excludeTags = (this.excludeTags).toString()
  1862. }
  1863. this.form.setting = JSON.stringify(this.setting)
  1864. if (this.form.id != null) {
  1865. updateSop(this.form).then(response => {
  1866. this.msgSuccess("修改成功");
  1867. this.open = false;
  1868. this.getList();
  1869. });
  1870. } else {
  1871. addSop(this.form).then(response => {
  1872. this.msgSuccess("新增成功");
  1873. this.open = false;
  1874. this.getList();
  1875. });
  1876. }
  1877. }
  1878. });
  1879. },
  1880. submitAutoSopTimeFrom() {
  1881. this.$refs["autoSopTimeFrom"].validate(valid => {
  1882. if (valid) {
  1883. this.autoSopOpen.open = false
  1884. this.form.autoSopTime.createTime = this.formatDateTo24HourString(new Date());
  1885. updateAutoSopTime({
  1886. id: this.autoSopOpen.id,
  1887. isAutoSop: this.autoSopOpen.isAutoSop,
  1888. autoSopTime: JSON.stringify(this.form.autoSopTime)
  1889. }).then(response => {
  1890. this.msgSuccess("修改成功");
  1891. });
  1892. }
  1893. this.getList();
  1894. this.reset();
  1895. });
  1896. },
  1897. formatDateTo24HourString(date) {
  1898. let year = date.getFullYear();
  1899. let month = ('0' + (date.getMonth() + 1)).slice(-2); // 月份需要加 1 并补零
  1900. let day = ('0' + date.getDate()).slice(-2); // 日需要补零
  1901. let hours = ('0' + date.getHours()).slice(-2); // 小时需要补零
  1902. let minutes = ('0' + date.getMinutes()).slice(-2); // 分钟需要补零
  1903. let seconds = ('0' + date.getSeconds()).slice(-2); // 秒需要补零
  1904. return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
  1905. },
  1906. cancelAutoSopTime() {
  1907. this.autoSopOpen.open = false
  1908. this.getList();
  1909. },
  1910. /** 删除按钮操作 */
  1911. handleDelete(row) {
  1912. const ids = row.id || this.ids;
  1913. this.$confirm('是否确认删除企微sop编号为"' + ids + '"的数据项?', "警告", {
  1914. confirmButtonText: "确定",
  1915. cancelButtonText: "取消",
  1916. type: "warning"
  1917. }).then(function () {
  1918. return delSop(ids);
  1919. }).then(() => {
  1920. this.getList();
  1921. this.msgSuccess("删除成功");
  1922. }).catch(() => {
  1923. });
  1924. },
  1925. /** 删除按钮操作 */
  1926. handleSopLogsDelete() {
  1927. this.$confirm('是否确认删除企微sop编号为"' + this.ids + '"的所有发送任务(执行记录)数据项?', "警告", {
  1928. confirmButtonText: "确定",
  1929. cancelButtonText: "取消",
  1930. type: "warning"
  1931. }).then(() => delSopLogs(this.ids)).then(() => {
  1932. this.msgSuccess("删除成功");
  1933. }).catch(() => {
  1934. });
  1935. },
  1936. /**
  1937. * 批量执行SOP任务
  1938. */
  1939. handleExecute() {
  1940. const ids = this.selectionMap
  1941. .filter(item => item.status === 1)
  1942. .map(item => item.id);
  1943. if (ids.length === 0) {
  1944. this.msgError("选择的任务已经执行或正在执行,请选择待执行的任务");
  1945. return;
  1946. }
  1947. this.$confirm('是否确认立即执行sop编号为"' + ids + '"的数据项?', "警告【只能立即执行(待执行的)】", {
  1948. confirmButtonText: "确定",
  1949. cancelButtonText: "取消",
  1950. type: "warning"
  1951. }).then(() => {
  1952. this.loading = true;
  1953. // 执行更新操作
  1954. return updateStatus(ids); // 返回一个Promise,直接在此链式调用
  1955. }).then(res => {
  1956. let msg = "";
  1957. // 判断成功和失败的任务,并显示消息
  1958. if (res.suc.length > 0) {
  1959. msg += "执行成功的SOP任务【" + res.suc.join(", ") + "】。<br>"; // 优化:将数组转换为字符串
  1960. }
  1961. if (res.err.length > 0) {
  1962. msg += "失败的SOP任务【" + res.err.join(", ") + "】,原因是已经执行或正在执行。<br>";
  1963. }
  1964. // 显示确认框,显示成功与失败信息
  1965. return this.$confirm(msg, "提示", {
  1966. confirmButtonText: "确定",
  1967. cancelButtonText: "取消",
  1968. type: "warning",
  1969. dangerouslyUseHTMLString: true // 允许HTML标签
  1970. });
  1971. }).then(() => {
  1972. // 操作完成后刷新列表,并显示成功信息
  1973. this.getList();
  1974. this.msgSuccess("执行完成");
  1975. }).catch(() => {
  1976. // 处理任何异常,操作取消或者失败时显示提示信息
  1977. this.msgError("操作失败,请重试");
  1978. }).finally(() => {
  1979. this.loading = false; // 操作完成后关闭加载状态
  1980. });
  1981. },
  1982. /** 导出按钮操作 */
  1983. handleExport() {
  1984. const queryParams = this.queryParams;
  1985. this.$confirm('是否确认导出所有企微sop数据项?', "警告", {
  1986. confirmButtonText: "确定",
  1987. cancelButtonText: "取消",
  1988. type: "warning"
  1989. }).then(() => {
  1990. this.exportLoading = true;
  1991. return exportSop(queryParams);
  1992. }).then(response => {
  1993. this.download(response.msg);
  1994. this.exportLoading = false;
  1995. }).catch(() => {
  1996. });
  1997. },
  1998. /**
  1999. * 一键群发
  2000. */
  2001. handleSendMsg(row){
  2002. this.sendMsgOpen.open = true;
  2003. this.sendMsgOpen.id = row.id;
  2004. this.sendMsgOpen.row = row;
  2005. this.msgForm.chatIds = row.chatId.split(",");
  2006. },
  2007. submitMsgForm(){
  2008. this.$refs["msgForm"].validate(valid => {
  2009. if (valid) {
  2010. this.msgForm.setting=JSON.stringify(this.setting)
  2011. this.msgForm.sopId=this.sendMsgOpen.row.id;
  2012. this.msgForm.corpId=this.sendMsgOpen.row.corpId;
  2013. this.msgForm.filterMode=this.sendMsgOpen.row.filterMode;
  2014. if (this.setting.length <= 0) {
  2015. return this.$message.error("请添加规则")
  2016. }
  2017. console.log(this.msgForm.setting)
  2018. let jsonSetting = JSON.parse(this.msgForm.setting);
  2019. let hasLiveSetting = false;
  2020. console.log(jsonSetting)
  2021. for(let index=0;index < jsonSetting.length;index++){
  2022. if(!!jsonSetting[index] && jsonSetting[index].contentType == "12") {
  2023. if(!!hasLiveSetting){
  2024. return this.$message.error("发送直播间只能一次只能发送一条");
  2025. }
  2026. hasLiveSetting = true;
  2027. }
  2028. }
  2029. if(!!hasLiveSetting && (this.msgForm.courseId!=null && this.msgForm.courseId!='')){
  2030. return this.$message.error("直播间不能选取课程");
  2031. }
  2032. if(!!hasLiveSetting && (this.msgForm.videoId!=null && this.msgForm.videoId!='')){
  2033. return this.$message.error("直播间不能选取课节");
  2034. }
  2035. console.log(hasLiveSetting);
  2036. // debugger;
  2037. if ((this.msgForm.courseId===null || this.msgForm.courseId==='') && !hasLiveSetting){
  2038. return this.$message.error("课程不能为空")
  2039. }
  2040. if ((this.msgForm.videoId===null || this.msgForm.videoId==='')&& !hasLiveSetting){
  2041. return this.$message.error("课节不能为空")
  2042. }
  2043. if (this.msgForm.courseType===null || this.msgForm.courseType===''){
  2044. return this.$message.error("消息类型不能为空")
  2045. }
  2046. for (let i = 0; i < this.setting.length; i++) {
  2047. if (this.setting[i].contentType == 1 && (this.setting[i].value == null || this.setting[i].value == "")) {
  2048. return this.$message.error("内容不能为空")
  2049. }
  2050. if (this.setting[i].contentType == 2 && (this.setting[i].imgUrl == null || this.setting[i].imgUrl == "")) {
  2051. return this.$message.error("图片不能为空")
  2052. }
  2053. if (this.setting[i].contentType == 3 && (this.setting[i].linkTitle == null || this.setting[i].linkTitle == "")) {
  2054. return this.$message.error("链接标题不能为空")
  2055. }
  2056. if (this.setting[i].contentType == 3 && (this.setting[i].linkDescribe == null || this.setting[i].linkDescribe == "")) {
  2057. return this.$message.error("链接描述不能为空")
  2058. }
  2059. if (this.setting[i].contentType == 3 && (this.setting[i].linkImageUrl == null || this.setting[i].linkImageUrl == "")) {
  2060. return this.$message.error("链接图片不能为空")
  2061. }
  2062. if (this.setting[i].contentType == 3 && this.setting[i].type == 1 && (this.setting[i].linkUrl == null || this.setting[i].linkUrl == "")) {
  2063. return this.$message.error("链接地址不能为空")
  2064. }
  2065. if (this.setting[i].contentType == 5 && (this.setting[i].fileUrl == null || this.setting[i].fileUrl == "")) {
  2066. return this.$message.error("文件不能为空")
  2067. }
  2068. if (this.setting[i].contentType == 6 && (this.setting[i].videoUrl == null || this.setting[i].videoUrl == "")) {
  2069. return this.$message.error("视频不能为空")
  2070. }
  2071. if (this.setting[i].contentType == 7 && (this.setting[i].value == null || this.setting[i].value == "")) {
  2072. return this.$message.error("语音不能为空")
  2073. }
  2074. if(this.setting[i].contentType == 12 && (this.setting[i].liveId==null || this.setting[i].liveId == "")){
  2075. return this.$message.error("直播间不能为空");
  2076. }
  2077. }
  2078. this.sendMsgOpen.open = false;
  2079. const loading = this.$loading({
  2080. lock: true,
  2081. text: '正在执行中请稍后~~请不要刷新页面!!',
  2082. spinner: 'el-icon-loading',
  2083. background: 'rgba(0, 0, 0, 0.7)'
  2084. });
  2085. sendMsgSop(this.msgForm).then(response => {
  2086. this.msgSuccess("一键群发成功");
  2087. loading.close();
  2088. this.setting=[];
  2089. this.msgForm = {
  2090. videoId:null,
  2091. courseId:null,
  2092. courseType:null,
  2093. setting:null,
  2094. isRegister:2,
  2095. sendType:1,
  2096. filterMode:2,
  2097. }
  2098. this.getList();
  2099. }).finally(()=>{
  2100. loading.close();
  2101. });
  2102. }
  2103. });
  2104. },
  2105. courseChange() {
  2106. if (this.msgForm.courseId != null) {
  2107. const selectedCourse = this.courseList.find(course => parseInt(course.dictValue) === this.msgForm.courseId);
  2108. for (let i = 0; i < this.setting.length; i++) {
  2109. //响应式直接给链接的标题/封面上值
  2110. if (selectedCourse && this.setting[i].contentType == 3 && this.msgForm.courseId != null) {
  2111. this.$set(this.setting[i], 'linkTitle', selectedCourse.dictLabel);
  2112. this.$set(this.setting[i], 'linkImageUrl', selectedCourse.dictImgUrl);
  2113. }
  2114. if (selectedCourse && this.setting[i].contentType == 4 && this.msgForm.courseId != null) {
  2115. this.$set(this.setting[i], 'miniprogramPicUrl', selectedCourse.dictImgUrl);
  2116. }
  2117. }
  2118. }
  2119. videoList(this.msgForm.courseId).then(response => {
  2120. this.videoList = response.list;
  2121. });
  2122. },
  2123. cancelMsgForm(){
  2124. this.sendMsgOpen.open = false;
  2125. this.resetSendMsgSop();
  2126. },
  2127. delSetList(index){
  2128. this.setting.splice(index,1)
  2129. },
  2130. liveChange(content) {
  2131. // content.liveId 是选中的直播间 ID(liveId)
  2132. const selectedLive = this.liveList.find(live => live.liveId === content.liveId);
  2133. if (selectedLive) {
  2134. // 从选中的直播间对象中提取标题和封面,赋值给当前内容的对应字段
  2135. // 假设直播间对象中标题字段为 liveTitle,封面字段为 coverImg(根据实际接口字段调整)
  2136. content.miniprogramTitle = selectedLive.liveName || ''; // 自动填充标题
  2137. content.miniprogramPicUrl = selectedLive.liveImgUrl || ''; // 自动填充封面
  2138. } else {
  2139. // 若未找到对应直播间,清空标题和封面(可选)
  2140. content.miniprogramTitle = '';
  2141. content.miniprogramPicUrl = '';
  2142. }
  2143. },
  2144. /**
  2145. * 安全获取群聊名称
  2146. */
  2147. getChatName(chatId) {
  2148. const chat = this.chatList.find(e => e.chatId == chatId);
  2149. return chat ? chat.name : '';
  2150. },
  2151. }
  2152. };
  2153. </script>
  2154. <style scoped>
  2155. .custom-input /deep/ .el-input__inner {
  2156. height: 20px;
  2157. padding: 0 4px;
  2158. text-align: center;
  2159. display: block;
  2160. }
  2161. .custom-input /deep/ .el-input__icon {
  2162. line-height: 20px;
  2163. }
  2164. .el-button--text {
  2165. cursor: pointer;
  2166. }
  2167. </style>