sendMsgOpenTool.vue 63 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408
  1. <template>
  2. <div class="app-container">
  3. <el-dialog :title="sendMsgOpen.title" :visible.sync="sendMsgOpen.open" width="1000px" append-to-body>
  4. <el-alert
  5. type="error"
  6. :closable="false"
  7. show-icon>
  8. <template #title>
  9. <span style="font-size: 25px; line-height: 1.5;">
  10. 此功能用于给 选中的 营期 内【所有的】客户发送 消息
  11. </span>
  12. </template>
  13. </el-alert>
  14. <el-form ref="msgForm" :model="msgForm" :rules="msgRules">
  15. <el-form-item label="策略" prop="draftStrategy">
  16. <el-radio-group v-model="msgForm.draftStrategy">
  17. <el-radio :label="1">正常群发</el-radio>
  18. <el-radio :label="2">清除草稿</el-radio>
  19. <el-radio :label="3">发送草稿</el-radio>
  20. <el-radio :label="4">sip外呼</el-radio>
  21. </el-radio-group>
  22. </el-form-item>
  23. <el-form-item label="选择课程" v-if="msgForm.draftStrategy==1 || msgForm.draftStrategy==4 " >
  24. <el-select v-model="msgForm.courseId" placeholder="请选择课程" style=" margin-right: 10px;" size="mini" filterable @change="courseChange()">
  25. <el-option
  26. v-for="dict in courseList"
  27. :key="dict.dictValue"
  28. :label="dict.dictLabel"
  29. :value="parseInt(dict.dictValue)"
  30. />
  31. </el-select>
  32. <el-select v-model="msgForm.videoId" placeholder="请选择小节" size="mini" style=" margin-right: 10px;" filterable @change="videoIdChange()" >
  33. <el-option
  34. v-for="dict in videoList"
  35. :key="dict.dictValue"
  36. :label="dict.dictLabel"
  37. :value="parseInt(dict.dictValue)"
  38. />
  39. </el-select>
  40. <el-select v-model="msgForm.courseType" placeholder="请选择消息类型" size="mini" style=" margin-right: 10px;">
  41. <el-option
  42. v-for="dict in sysFsSopWatchStatus"
  43. :key="dict.dictValue"
  44. :label="dict.dictLabel"
  45. :value="parseInt(dict.dictValue)"
  46. />
  47. </el-select>
  48. </el-form-item>
  49. <el-form-item label="选择直播间" v-if="msgForm.draftStrategy!=4">
  50. <el-select v-model="liveGroupTypeId"
  51. placeholder="请选择直播间分组" clearable
  52. @change="liveGroupTypeChange" >
  53. <el-option
  54. v-for="dict in liveGroupTypeList"
  55. :key="dict.id"
  56. :label="dict.liveGroupType"
  57. :value="dict.id"
  58. />
  59. </el-select>
  60. <el-select v-model="msgForm.liveId"
  61. filterable
  62. placeholder="请选择直播间" size="mini"
  63. style=" margin-right: 10px;"
  64. @change="liveChangemsgForm(msgForm.liveId)" clearable >
  65. <el-option
  66. v-for="dict in liveList"
  67. :key="dict.liveId"
  68. :label="dict.liveName"
  69. :value="dict.liveId"
  70. />
  71. </el-select>
  72. </el-form-item>
  73. <el-form-item label="规则" prop="setting" v-if="msgForm.draftStrategy==1" >
  74. <div v-for="(item, index) in setting" :key="index" style="background-color: #fdfdfd; border: 1px solid #e6e6e6; margin-bottom: 20px;">
  75. <el-row>
  76. <el-col :span="22">
  77. <el-form :model="item" label-width="70px">
  78. <el-form-item label="内容类别" style="margin: 2%">
  79. <el-radio-group v-model="item.contentType">
  80. <el-radio :label="item.dictValue" v-for="item in sysQwSopAiContentType" @change="handleContentTypeChange()">{{item.dictLabel}}</el-radio>
  81. </el-radio-group>
  82. </el-form-item>
  83. <!-- <div v-if="item.contentType == 12">
  84. <el-card class="box-card">
  85. <el-form-item label="直播间" >
  86. <el-select v-model="item.liveId"
  87. placeholder="请选择直播间" size="mini"
  88. @change="liveChange(item)" >
  89. <el-option
  90. v-for="dict in liveList"
  91. :key="dict.liveId"
  92. :label="dict.liveName"
  93. :value="dict.liveId"
  94. />
  95. </el-select>
  96. </el-form-item>
  97. <el-form-item label="标题" prop="miniprogramTitle">
  98. <el-input v-model="item.miniprogramTitle" placeholder="请输入小程序消息标题,最长为64字节" :rows="2" maxlength="64"
  99. type="textarea" />
  100. </el-form-item>
  101. <el-form-item label="封面" prop="miniprogramPicUrl">
  102. <ImageUpload v-model="item.miniprogramPicUrl" type="image" :num="10" :width="150" :height="150" />
  103. </el-form-item>
  104. <el-form-item label="appid" prop="miniprogramAppid" v-show="false">
  105. <el-input v-model="item.miniprogramAppid='wxcfd4cd6e2375e42f' " disabled />
  106. </el-form-item>
  107. <el-form-item label="page路径" prop="miniprogramPage" v-show="false" label-width="100px" style="margin-left: -30px">
  108. <el-input v-model="item.miniprogramPage" placeholder="小程序消息打开后的路径" disabled />
  109. </el-form-item>
  110. </el-card>
  111. </div> -->
  112. <el-form-item label="内容" style="margin-bottom: 2%" >
  113. <div v-if="item.contentType == 12 || item.contentType == 18 || item.contentType == 19 || item.contentType == 24">
  114. <el-card class="box-card">
  115. <el-form-item label="直播间分组" label-width="110px">
  116. <el-select v-model="liveGroupTypeId"
  117. filterable
  118. placeholder="请选择直播间分组" clearable
  119. @change="liveGroupTypeChange" >
  120. <el-option
  121. v-for="dict in liveGroupTypeList"
  122. :key="dict.id"
  123. :label="dict.liveGroupType"
  124. :value="dict.id"
  125. />
  126. </el-select>
  127. </el-form-item>
  128. <el-form-item label="直播间" >
  129. <el-select v-model="item.liveId"
  130. filterable
  131. placeholder="请选择直播间"
  132. @change="liveChange(item)" :disabled="liveDisabled()">
  133. <el-option
  134. v-for="dict in liveList"
  135. :key="dict.liveId"
  136. :label="dict.liveName"
  137. :value="dict.liveId"
  138. />
  139. </el-select>
  140. </el-form-item>
  141. <el-form-item label="标题" prop="miniprogramTitle">
  142. <el-input :disabled="liveDisabled()" v-model="item.miniprogramTitle" placeholder="请输入小程序消息标题,最长为64字节" :rows="2" maxlength="64"
  143. type="textarea" />
  144. </el-form-item>
  145. <el-form-item label="封面" prop="miniprogramPicUrl">
  146. <ImageUpload :disabled="liveDisabled()" v-model="item.miniprogramPicUrl" type="image" :num="10" :width="150" :height="150" />
  147. </el-form-item>
  148. <el-form-item label="appid" prop="miniprogramAppid" v-show="false">
  149. <el-input v-model="item.miniprogramAppid='wxcfd4cd6e2375e42f' " disabled />
  150. </el-form-item>
  151. <el-form-item label="page路径" prop="miniprogramPage" v-show="false" label-width="100px" style="margin-left: -30px">
  152. <el-input v-model="item.miniprogramPage" placeholder="小程序消息打开后的路径" disabled />
  153. </el-form-item>
  154. </el-card>
  155. </div>
  156. <el-input
  157. v-if="item.contentType == 1 || item.contentType == 15|| item.contentType == 13"
  158. v-model="item.value"
  159. type="textarea"
  160. :rows="3"
  161. placeholder="内容"
  162. style="width: 90%; margin-top: 10px;"
  163. @keydown.native="handleKeydown($event, index)"
  164. :ref="`textarea-${index}`"
  165. >
  166. </el-input>
  167. <el-link
  168. v-if="item.contentType == 1 || item.contentType == 15|| item.contentType == 13"
  169. type="primary"
  170. @click="toggleSalesCall(index)"
  171. style="margin-top: 10px;"
  172. >
  173. {{ item.isSalesCallAdded ? '移除#销售称呼#' : '添加#销售称呼#' }}
  174. </el-link>
  175. <el-link
  176. v-if="item.contentType == 1 || item.contentType == 15|| item.contentType == 13"
  177. type="primary"
  178. @click="toggleSalesCallCustomer(index)"
  179. style="margin-top: 10px;margin-left: 2%"
  180. >
  181. {{ item.isSalesCallCustomerAdded ? '移除#客户称呼#' : '添加#客户称呼#' }}
  182. </el-link>
  183. <ImageUpload v-if="item.contentType == 2 " v-model="item.imgUrl" type="image" :num="1" :width="150" :height="150" />
  184. <div v-if="item.contentType == 3 || item.contentType ==9 ">
  185. <el-card class="box-card">
  186. <el-form-item label="链接标题:" label-width="100px">
  187. <el-input v-model="item.linkTitle" placeholder="请输入链接标题" style="width: 90%;"/>
  188. </el-form-item>
  189. <el-form-item label="链接描述:" label-width="100px" >
  190. <el-input type="textarea" :rows="3" v-model="item.linkDescribe" placeholder="请输入链接描述" style="width: 90%;margin-top: 1%;"/>
  191. </el-form-item>
  192. <el-form-item label="链接封面:" label-width="100px">
  193. <ImageUpload v-model="item.linkImageUrl" type="image" :num="1" :file-size="2" :width="150" :height="150" style="margin-top: 1%;" />
  194. </el-form-item>
  195. <el-form-item label="链接地址:" label-width="100px" >
  196. <el-tag type="warning" v-model="item.isBindUrl=1">选择的课程小节 即为卡片链接地址</el-tag>
  197. </el-form-item>
  198. </el-card>
  199. </div>
  200. <div v-if="item.contentType == 4 || item.contentType == 10 || item.contentType == 17 || item.contentType == 23">
  201. <el-card class="box-card">
  202. <el-form-item label="标题" prop="miniprogramTitle">
  203. <el-input v-model="item.miniprogramTitle" placeholder="请输入小程序消息标题,最长为64字" />
  204. </el-form-item>
  205. <el-form-item label="封面" prop="miniprogramPicUrl">
  206. <ImageUpload v-model="item.miniprogramPicUrl" type="image" :num="10" :width="150" :height="150" />
  207. </el-form-item>
  208. <el-form-item label="appid" prop="miniprogramAppid" v-show="false" >
  209. <el-input v-model="item.miniprogramAppid='wx73f85f8d62769119' " disabled />
  210. </el-form-item>
  211. <el-form-item label="page路径" prop="miniprogramPage" v-show="item.contentType == 10" label-width="100px" style="margin-left: -30px" >
  212. <el-input v-model="item.miniprogramPage" placeholder="小程序消息打开后的路径" type="textarea" :rows="3" />
  213. </el-form-item>
  214. </el-card>
  215. </div>
  216. <div v-if="item.contentType == 5 ">
  217. <el-form-item label="上传文件:" prop="fileUrl" label-width="100px">
  218. <el-upload
  219. v-model="item.fileUrl"
  220. class="avatar-uploader"
  221. :action="uploadUrl"
  222. :show-file-list="false"
  223. :on-success="(res, file) => handleAvatarSuccessFile(res, file, item)"
  224. :before-upload="beforeAvatarUploadFile">
  225. <i class="el-icon-plus avatar-uploader-icon"></i>
  226. </el-upload>
  227. <el-link v-if="item.fileUrl" type="primary" :href="downloadUrl(item.fileUrl)" download>
  228. {{item.fileUrl}}
  229. </el-link>
  230. </el-form-item>
  231. </div>
  232. <div v-if="item.contentType == 6 ">
  233. <el-form-item label="上传视频:" prop="videoUrl" label-width="100px">
  234. <el-upload
  235. v-model="item.videoUrl"
  236. class="avatar-uploader"
  237. :action="uploadUrl"
  238. :show-file-list="false"
  239. :on-success="(res, file) => handleAvatarSuccessVideo(res, file, item)"
  240. :before-upload="beforeAvatarUploadVideo">
  241. <i class="el-icon-plus avatar-uploader-icon"></i>
  242. </el-upload>
  243. <video v-if="item.videoUrl"
  244. :src="item.videoUrl"
  245. controls style="width: 200px;height: 100px">
  246. </video>
  247. </el-form-item>
  248. </div>
  249. <div v-if="item.contentType == 7 || item.contentType == 16">
  250. <el-input
  251. v-model="item.value"
  252. type="textarea" :rows="3" maxlength="66" show-word-limit
  253. placeholder="输入要转为语音的内容" style="width: 90%;margin-top: 10px;"
  254. @input="handleInputVideoText(item.value,item)"/>
  255. <el-button type="primary" size="mini" plain style="margin-top: 10px;" @click="openVoiceDialog(item)">快捷语音</el-button>
  256. </div>
  257. <!-- <div v-if="item.contentType == 12">
  258. <el-card class="box-card">
  259. <el-form-item label="直播间3" >
  260. <el-select v-model="item.liveId"
  261. placeholder="请选择直播间" size="mini"
  262. @change="liveChange(item)" >
  263. <el-option
  264. v-for="dict in liveList"
  265. :key="dict.liveId"
  266. :label="dict.liveName"
  267. :value="dict.liveId"
  268. />
  269. </el-select>
  270. </el-form-item>
  271. <el-form-item label="标题" prop="miniprogramTitle">
  272. <el-input v-model="item.miniprogramTitle" placeholder="请输入小程序消息标题,最长为64字节" :rows="2" maxlength="64"
  273. type="textarea" />
  274. </el-form-item>
  275. <el-form-item label="封面" prop="miniprogramPicUrl">
  276. <ImageUpload v-model="item.miniprogramPicUrl" type="image" :num="10" :width="150" :height="150" />
  277. </el-form-item>
  278. <el-form-item label="appid" prop="miniprogramAppid" v-show="false">
  279. <el-input v-model="item.miniprogramAppid='wxcfd4cd6e2375e42f' " disabled />
  280. </el-form-item>
  281. <el-form-item label="page路径" prop="miniprogramPage" v-show="false" label-width="100px" style="margin-left: -30px">
  282. <el-input v-model="item.miniprogramPage" placeholder="小程序消息打开后的路径" disabled />
  283. </el-form-item>
  284. </el-card>
  285. </div> -->
  286. <div v-if="item.contentType == 8">
  287. <el-button type="primary"
  288. style="margin-bottom: 1%"
  289. @click="hanldeSelectVideoNum(setting,index)">
  290. 选择视频号
  291. </el-button>
  292. <el-card class="box-card" v-if="item.coverUrl">
  293. <el-form-item label="封面标题:" label-width="100px">
  294. <el-input v-model="item.nickname"
  295. style="width: 90%;margin-bottom: 1%" disabled/>
  296. </el-form-item>
  297. <el-form-item label="头像:" label-width="100px">
  298. <el-image
  299. v-if="item.avatar != null"
  300. :src="item.avatar"
  301. :preview-src-list="[item.avatar]"
  302. :style="{ width: '50px', height: '50px' }"
  303. ></el-image>
  304. </el-form-item>
  305. <el-form-item label="封面:" label-width="100px">
  306. <el-image
  307. v-if="item.coverUrl != null"
  308. :src="item.coverUrl"
  309. :preview-src-list="[item.coverUrl]"
  310. :style="{ width: '200px', height: '200px' }"
  311. ></el-image>
  312. </el-form-item>
  313. <el-form-item label="简介:" label-width="100px">
  314. <el-input type="textarea" :rows="3"
  315. v-model="item.desc"
  316. style="width: 90%;margin-top: 1%;" disabled/>
  317. </el-form-item>
  318. <el-form-item label="视频地址:" label-width="100px"
  319. style="margin-top: 1%">
  320. <el-input v-model="item.url"
  321. style="width: 90%;" disabled/>
  322. </el-form-item>
  323. </el-card>
  324. </div>
  325. <div v-if="item.contentType == 20">
  326. <el-card class="box-card">
  327. <el-form-item label="直播间分组" label-width="110px">
  328. <el-select v-model="liveGroupTypeId"
  329. filterable
  330. placeholder="请选择直播间分组" clearable
  331. @change="liveGroupTypeChange" >
  332. <el-option
  333. v-for="dict in liveGroupTypeList"
  334. :key="dict.id"
  335. :label="dict.liveGroupType"
  336. :value="dict.id"
  337. />
  338. </el-select>
  339. </el-form-item>
  340. <el-form-item label="直播间" >
  341. <el-select v-model="item.liveId"
  342. filterable
  343. placeholder="请选择直播间"
  344. @change="liveChange(item)" >
  345. <el-option
  346. v-for="dict in liveList"
  347. :key="dict.liveId"
  348. :label="dict.liveName"
  349. :value="dict.liveId"
  350. />
  351. </el-select>
  352. </el-form-item>
  353. <el-form-item label="标题" prop="miniprogramTitle">
  354. <el-input v-model="item.miniprogramTitle" placeholder="请输入小程序消息标题,最长为64字节" :rows="2" maxlength="64"
  355. type="textarea" @input="checkLiveMiniprogramTitle(item)"/>
  356. </el-form-item>
  357. <el-form-item label="封面" prop="miniprogramPicUrl">
  358. <ImageUpload v-model="item.miniprogramPicUrl" type="image" :num="10" :width="150" :height="150" />
  359. </el-form-item>
  360. <el-form-item label="appid" prop="miniprogramAppid" v-show="false">
  361. <el-input v-model="item.miniprogramAppid='wxcfd4cd6e2375e42f' " disabled />
  362. </el-form-item>
  363. <el-form-item label="page路径" prop="miniprogramPage" v-show="false" label-width="100px" style="margin-left: -30px">
  364. <el-input v-model="item.miniprogramPage" placeholder="小程序消息打开后的路径" disabled />
  365. </el-form-item>
  366. </el-card>
  367. </div>
  368. <div v-if="item.contentType == 14">
  369. <el-card class="box-card">
  370. <el-form-item label="福袋名称" >
  371. <el-select v-model="item.luckyBagId"
  372. placeholder="请选择福袋" size="mini"
  373. @change="getLuckyBagStatus(item)" >
  374. <el-option
  375. v-for="dict in luckyBagList"
  376. :key="dict.id"
  377. :label="dict.name"
  378. :value="dict.id"
  379. />
  380. </el-select>
  381. </el-form-item>
  382. <el-form-item label="福袋状态" >
  383. <el-tag :type="item.luckyBagDataStatus == 1 ? 'success' : 'danger'">
  384. {{ item.luckyBagDataStatus == 1 ? '启用' : '禁用' }}
  385. </el-tag>
  386. </el-form-item>
  387. </el-card>
  388. </div>
  389. <div v-if="item.contentType == 21">
  390. <el-card class="box-card">
  391. <el-form-item label="短信模板" >
  392. <el-select v-model="item.smsTemplateId"
  393. placeholder="请选择短信模板" size="mini"
  394. @change="getSmsTemplateInfo(item)" >
  395. <el-option
  396. v-for="template in smsTemplateList"
  397. :key="template.tempId"
  398. :label="template.title"
  399. :value="template.tempId"
  400. />
  401. </el-select>
  402. </el-form-item>
  403. <el-form-item label="内容预览" v-if="item.smsTemplateContent">
  404. <div style="color: #666; font-size: 12px; padding: 8px; border: 1px solid #eee; border-radius: 4px; background-color: #f9f9f9; max-height: 100px; overflow-y: auto;">
  405. {{ item.smsTemplateContent }}
  406. </div>
  407. </el-form-item>
  408. </el-card>
  409. </div>
  410. </el-form-item>
  411. <el-form-item label="添加短链" v-if="item.contentType == 1 || item.contentType == 15" >
  412. <el-tooltip content="请先根据课程选定课程小节之后再添加" effect="dark" :disabled="!!msgForm.videoId">
  413. <el-switch
  414. v-model="item.isBindUrl"
  415. :disabled="!msgForm.videoId"
  416. active-color="#13ce66"
  417. inactive-color="#DCDFE6"
  418. active-value="1"
  419. inactive-value="2">
  420. </el-switch>
  421. </el-tooltip>
  422. <span v-if="item.isBindUrl == '1'" style="margin-left: 10px; color: #13ce66">添加URL</span>
  423. <span v-if="item.isBindUrl == '2'" style="margin-left: 10px; color: #b1b4ba">不加URL</span>
  424. </el-form-item>
  425. <el-form-item label="课节过期时间" v-if="item.isBindUrl == '1'
  426. && item.contentType != 2
  427. && item.contentType != 5
  428. && item.contentType != 6
  429. && item.contentType != 8"
  430. style="margin-top: 1%" label-width="100px">
  431. <el-row>
  432. <el-input-number v-model="item.expiresDays" :min="1" :max="100" ></el-input-number>
  433. (天)
  434. </el-row>
  435. <el-row>
  436. <span class="tip">填写0或不填时,默认为系统配置的默认时间</span>
  437. </el-row>
  438. </el-form-item>
  439. </el-form>
  440. </el-col>
  441. <el-col :span="1" :offset="1">
  442. <i class="el-icon-delete" @click="delSetList(index)" style="margin-top: 20px;" v-if="setting.length>1"></i>
  443. </el-col>
  444. </el-row>
  445. </div>
  446. <el-link type="primary" class="el-icon-plus" :underline="false" @click='addSetList()' >添加内容</el-link>
  447. </el-form-item>
  448. <el-form-item label="外呼任务" v-if="msgForm.draftStrategy==4" >
  449. <el-select v-model="msgForm.aiCustomerRoleId"
  450. placeholder="请选择外呼任务" size="mini"
  451. @change="getAiSipCallTask()" >
  452. <el-option
  453. v-for="template in aiSipCallTaskList"
  454. :key="template.batchId"
  455. :label="template.batchName"
  456. :value="template.batchId"
  457. />
  458. </el-select>
  459. </el-form-item>
  460. <el-form-item label="发送时间" prop="sendTime" v-if="msgForm.draftStrategy==1 || msgForm.draftStrategy==4 " >
  461. <el-date-picker
  462. class="custom-input"
  463. v-model="msgForm.sendTime"
  464. type="datetime"
  465. value-format="yyyy-MM-dd HH:mm:ss"
  466. format="yyyy-MM-dd HH:mm:ss"
  467. placeholder="选择日期时间"
  468. :picker-options="pickerOptions"
  469. style="width: 220px;">
  470. </el-date-picker>
  471. <span class="tip" style="margin-left: 2%"> 不填时,默认为系统当前时间(立即发送)</span>
  472. </el-form-item>
  473. </el-form>
  474. <div slot="footer" class="dialog-footer">
  475. <el-button type="primary" @click="submitMsgForm">确 定</el-button>
  476. <el-button @click="cancelMsgForm">取 消</el-button>
  477. </div>
  478. </el-dialog>
  479. <el-dialog :title="videoNumOptions.title" :visible.sync="videoNumOptions.open" width="1500px" append-to-body>
  480. <userVideo ref="QwUserVideo" @videoResult="qwUserVideoResult"></userVideo>
  481. </el-dialog>
  482. <el-dialog :title="voiceOptions.title" :visible.sync="voiceOptions.open" width="800px" append-to-body>
  483. <div style="margin-bottom: 10px;">
  484. <el-input v-model="voiceOptions.keyword" placeholder="请输入关键词搜索" style="width: 300px;" clearable @clear="searchVoice" @keyup.enter.native="searchVoice">
  485. <el-button slot="append" icon="el-icon-search" @click="searchVoice">搜索</el-button>
  486. </el-input>
  487. </div>
  488. <el-table :data="voiceOptions.list" v-loading="voiceOptions.loading" highlight-current-row @current-change="handleVoiceSelect">
  489. <el-table-column prop="voiceTxt" label="语音内容" min-width="200" show-overflow-tooltip></el-table-column>
  490. <el-table-column label="操作" width="80" align="center">
  491. <template slot-scope="scope">
  492. <el-button type="text" size="mini" @click="selectVoice(scope.row)">选择</el-button>
  493. </template>
  494. </el-table-column>
  495. </el-table>
  496. <el-pagination
  497. style="margin-top: 10px; text-align: right;"
  498. background
  499. layout="total, prev, pager, next"
  500. :total="voiceOptions.total"
  501. :page-size="voiceOptions.pageSize"
  502. :current-page.sync="voiceOptions.pageNum"
  503. @current-change="searchVoice">
  504. </el-pagination>
  505. </el-dialog>
  506. </div>
  507. </template>
  508. <script>
  509. import { sendMsgSopType,} from "../../../api/qw/sopUserLogsInfo";
  510. import ImageUpload from "@/views/qw/sop/ImageUpload.vue";
  511. import {courseList, videoList} from "@/api/qw/sop";
  512. import userVideo from "@/views/qw/userVideo/userVideo";
  513. import {listToLiveNoEnd, listLiveGroupType} from "@/api/live/live";
  514. import {listReward} from "@/api/qw/luckyBag";
  515. import { getSmsTempList } from "@/api/company/companySmsTemp";
  516. import { getQwSopTempVoiceCompanyUser } from "@/api/qw/QwSopTempVoice";
  517. import { listAiSipCallTask } from '@/api/aiSipCall/aiSipCallTask'
  518. export default {
  519. name: "sendMsgOpenTool",
  520. components: {ImageUpload,userVideo},
  521. data() {
  522. return {
  523. queryParams1: {
  524. pageNum: 1,
  525. pageSize: 10,
  526. dataStatus: '1',
  527. name: null,
  528. type: null
  529. },
  530. luckyBagList: [],
  531. projectFrom:process.env.VUE_APP_PROJECT_FROM,
  532. videoNumOptions: {
  533. title: '选择视频号',
  534. open: false,
  535. content: null,
  536. contentIndex: null,
  537. },
  538. voiceOptions: {
  539. title: '快捷语音',
  540. open: false,
  541. keyword: '',
  542. list: [],
  543. loading: false,
  544. total: 0,
  545. pageNum: 1,
  546. pageSize: 5,
  547. currentItem: null,
  548. },
  549. //上传语音的遮罩层
  550. voiceLoading :false,
  551. uploadUrl:process.env.VUE_APP_BASE_API+"/common/uploadOSS",
  552. uploadUrlByVoice:process.env.VUE_APP_BASE_API+"/common/uploadOSSByHOOKVoice",
  553. // 遮罩层
  554. loading: true,
  555. // 导出遮罩层
  556. exportLoading: false,
  557. // 选中数组
  558. ids: [],
  559. // 非单个禁用
  560. single: true,
  561. // 非多个禁用
  562. multiple: true,
  563. // 显示搜索条件
  564. showSearch: true,
  565. // 总条数
  566. total: 0,
  567. // sopUserLogsInfo表格数据
  568. sopUserLogsInfoList: [],
  569. sysFsSopWatchStatus: [],
  570. isSalesCallAdded:false,
  571. isSalesCallCustomerAdded:false,
  572. tagList:[],
  573. selectTags:[],
  574. // 弹出层标题
  575. title: "",
  576. // 是否显示弹出层
  577. open: false,
  578. updateOpen:false,
  579. // 查询参数
  580. queryParams: {
  581. pageNum: 1,
  582. pageSize: 10,
  583. tagIds:null,
  584. remark:null,
  585. sopId: null,
  586. userLogsId: null,
  587. userIdParam:null,
  588. startTimeParam:null,
  589. externalContactId: null,
  590. qwUserId: null,
  591. corpId: null,
  592. externalId: null,
  593. fsUserId: null,
  594. externalUserName: null,
  595. createTime: null,
  596. },
  597. courseList:[],
  598. videoList:[],
  599. //插件版
  600. sysQwSopAiContentType:[],
  601. sendMsgOpen:{
  602. title:'一键批量群发',
  603. open:false,
  604. ids:null,
  605. },
  606. smsTemplateList: [],
  607. aiSipCallTaskList: [],
  608. // 表单参数
  609. form: {},
  610. setting:[{contentType:'1', value: '',}],
  611. msgForm:{
  612. liveId:null,
  613. videoId:null,
  614. courseId:null,
  615. courseType:null,
  616. userIdParam:null,
  617. setting:null,
  618. ids:null,
  619. type:null,
  620. corpId:null,
  621. sopId: null,
  622. startTime: null,
  623. sendTime: null,
  624. draftStrategy:1,
  625. },
  626. // 表单校验
  627. rules: {},
  628. batchRules:{
  629. paramTime: [
  630. { required: true, message: '选择的时间不能为空', trigger: 'blur' }
  631. ],
  632. },
  633. msgRules:{},
  634. liveList: [],
  635. liveGroupTypeList: [],
  636. liveGroupTypeId: null,
  637. pickerOptions: {
  638. shortcuts: [
  639. {
  640. text: '现在',
  641. onClick(picker) {
  642. picker.$emit('pick', new Date());
  643. }
  644. },
  645. {
  646. text: '1小时后',
  647. onClick(picker) {
  648. const date = new Date();
  649. date.setTime(date.getTime() + 3600 * 1000);
  650. picker.$emit('pick', date);
  651. }
  652. },
  653. {
  654. text: '明天此时',
  655. onClick(picker) {
  656. const date = new Date();
  657. date.setTime(date.getTime() + 3600 * 1000 * 24);
  658. picker.$emit('pick', date);
  659. }
  660. },
  661. {
  662. text: '后天此时',
  663. onClick(picker) {
  664. const date = new Date();
  665. date.setTime(date.getTime() + 3600 * 1000 * 24 * 2);
  666. picker.$emit('pick', date);
  667. }
  668. },
  669. {
  670. text: '一周后',
  671. onClick(picker) {
  672. const date = new Date();
  673. date.setTime(date.getTime() + 3600 * 1000 * 24 * 7);
  674. picker.$emit('pick', date);
  675. }
  676. }
  677. ]
  678. },
  679. };
  680. },
  681. created() {
  682. this.getDicts("sys_qwSopAi_contentType").then(response => {
  683. this.sysQwSopAiContentType = response.data;
  684. });
  685. this.getDicts("sys_fs_sop_watch_status").then(response => {
  686. this.sysFsSopWatchStatus = response.data;
  687. });
  688. courseList().then(response => {
  689. this.courseList = response.list;
  690. });
  691. listToLiveNoEnd().then(response => {
  692. this.liveList = response.rows;
  693. })
  694. listLiveGroupType().then(response => {
  695. this.liveGroupTypeList = response.rows || response.data || [];
  696. })
  697. listReward(this.queryParams1).then(response => {
  698. this.luckyBagList = response.rows;
  699. });
  700. this.loadSmsTemplates();
  701. this.loadSipTemplates();
  702. },
  703. methods: {
  704. loadSipTemplates() {
  705. if (this.aiSipCallTaskList.length > 0) {
  706. return; // 如果已经有数据,不再重复加载
  707. }
  708. listAiSipCallTask({taskType: 1,status: 0,pageNum: 1,pageSize: 100}).then(response => {
  709. this.aiSipCallTaskList = response.rows || response.data || [];
  710. if (this.aiSipCallTaskList.length === 0) {
  711. }
  712. }).catch(error => {
  713. console.error('加载sip模板失败:', error);
  714. this.$message.error('加载sip模板失败');
  715. });
  716. },
  717. // 获取sip模板信息
  718. getAiSipCallTask() {
  719. if (this.aiSipCallTaskList.length === 0) {
  720. listAiSipCallTask({taskType: 1,status: 0,pageNum: 1,pageSize: 100}).then(response => {
  721. this.aiSipCallTaskList = response.rows || response.data || [];
  722. }).catch(error => {
  723. console.error('加载sip模板失败:', error);
  724. this.$message.error('加载sip模板失败');
  725. });
  726. }
  727. },
  728. getLuckyBagStatus(content) {
  729. const selectedLuckyBag = this.luckyBagList.find(item => item.id === content.luckyBagId);
  730. if (selectedLuckyBag) {
  731. content.luckyBagDataStatus = selectedLuckyBag.dataStatus; // 自动填充标题
  732. } else {
  733. // 若未找到对应直播间,清空标题和封面(可选)
  734. content.luckyBagDataStatus = null;
  735. }
  736. },
  737. checkLiveMiniprogramTitle(item) {
  738. this.$forceUpdate();
  739. },
  740. liveChange(content) {
  741. // content.liveId 是选中的直播间 ID(liveId)
  742. const selectedLive = this.liveList.find(live => live.liveId === content.liveId);
  743. if (selectedLive) {
  744. // 从选中的直播间对象中提取标题和封面,赋值给当前内容的对应字段
  745. // 假设直播间对象中标题字段为 liveTitle,封面字段为 coverImg(根据实际接口字段调整)
  746. content.miniprogramTitle = selectedLive.liveName || ''; // 自动填充标题
  747. content.miniprogramPicUrl = selectedLive.liveImgUrl || ''; // 自动填充封面
  748. } else {
  749. // 若未找到对应直播间,清空标题和封面(可选)
  750. content.miniprogramTitle = '';
  751. content.miniprogramPicUrl = '';
  752. }
  753. },
  754. liveGroupTypeChange(val) {
  755. if (val) {
  756. listToLiveNoEnd({ liveGroupType: val }).then(response => {
  757. this.liveList = response.rows;
  758. });
  759. } else {
  760. listToLiveNoEnd().then(response => {
  761. this.liveList = response.rows;
  762. });
  763. }
  764. // 切换分组时清空已选的直播间
  765. if (this.msgForm.liveId) {
  766. this.msgForm.liveId = null;
  767. }
  768. // 清空规则中的直播间
  769. for (let i = 0; i < this.setting.length; i++) {
  770. this.$set(this.setting[i], 'liveId', null);
  771. }
  772. },
  773. qwUserVideoResult(val) {
  774. // 根据选中的内容,将返回的数据更新到相应的表单项
  775. const content = this.videoNumOptions.content;
  776. const setList = content[this.videoNumOptions.contentIndex];
  777. setList.nickname = val.nickname;
  778. setList.avatar = val.avatar;
  779. setList.coverUrl = val.coverUrl;
  780. setList.thumbUrl = val.thumbUrl;
  781. setList.desc = val.desc;
  782. setList.url = val.url;
  783. setList.extras = val.extras;
  784. setList.videoId = val.id;
  785. console.info(setList)
  786. this.videoNumOptions.open = false;
  787. },
  788. oneClickGroupSending(val,type,corpId){
  789. this.sendMsgOpen.open= true;
  790. this.msgForm.ids = val;
  791. this.msgForm.type = type;
  792. this.msgForm.corpId = corpId;
  793. },
  794. courseChange() {
  795. if (this.msgForm.courseId != null ) {
  796. const selectedCourse = this.courseList.find(course => parseInt(course.dictValue) === this.msgForm.courseId);
  797. for (let i = 0; i < this.setting.length; i++) {
  798. //响应式直接给链接的标题/封面上值
  799. if (selectedCourse && this.msgForm.courseId != null) {
  800. if ( this.setting[i].contentType == 3 || this.setting[i].contentType == 9 ){
  801. this.$set(this.setting[i], 'linkTitle', selectedCourse.dictLabel);
  802. this.$set(this.setting[i], 'linkImageUrl', selectedCourse.dictImgUrl);
  803. }
  804. if ( this.setting[i].contentType == 4 || this.setting[i].contentType == 10 || this.setting[i].contentType == 17 || this.setting[i].contentType == 23){
  805. this.$set(this.setting[i], 'miniprogramPicUrl', selectedCourse.dictImgUrl);
  806. }
  807. }
  808. }
  809. }
  810. videoList(this.msgForm.courseId).then(response => {
  811. this.videoList=response.list;
  812. });
  813. this.msgForm.videoId = null
  814. },
  815. videoIdChange() {
  816. if (this.msgForm.videoId != null ) {
  817. // 查找选中的课节对应的 label
  818. const selectedVideo = this.videoList.find(course => parseInt(course.dictValue) === this.msgForm.videoId);
  819. for (let i = 0; i < this.setting.length; i++) {
  820. //响应式直接给链接的描述上值
  821. if (selectedVideo && this.msgForm.videoId != null) {
  822. if (this.setting[i].contentType == 3 || this.setting[i].contentType == 9 ){
  823. this.$set(this.setting[i], 'linkDescribe', selectedVideo.dictLabel);
  824. if (this.projectFrom == 'sxjz' && selectedVideo.dictImgUrl) {
  825. this.$set(this.setting[i], 'linkImageUrl', selectedVideo.dictImgUrl);
  826. }
  827. }
  828. if (this.setting[i].contentType == 4 || this.setting[i].contentType == 10 || this.setting[i].contentType == 17 || this.setting[i].contentType == 23){
  829. this.$set(this.setting[i], 'miniprogramTitle', selectedVideo.dictLabel);
  830. if (this.projectFrom == 'sxjz' && selectedVideo.dictImgUrl) {
  831. this.$set(this.setting[i], 'miniprogramPicUrl', selectedVideo.dictImgUrl);
  832. }
  833. }
  834. }
  835. }
  836. }
  837. },
  838. handleAvatarSuccessFile(res, file, item) {
  839. if (res.code === 200) {
  840. // 使用 $set 确保响应式更新
  841. this.$set(item, 'fileUrl', res.url);
  842. } else {
  843. this.msgError(res.msg);
  844. }
  845. },
  846. beforeAvatarUploadFile(file){
  847. const isLt1M = file.size / 1024 / 1024 < 10;
  848. if (!isLt1M) {
  849. this.$message.error('上传大小不能超过 10MB!');
  850. }
  851. return isLt1M;
  852. },
  853. //下载文件
  854. downloadUrl(materialUrl) {
  855. // 直接返回文件 URL
  856. return materialUrl;
  857. },
  858. handleAvatarSuccessVideo(res, file, item) {
  859. if(res.code==200){
  860. // 使用 $set 确保响应式更新
  861. this.$set(item, 'videoUrl', res.url);
  862. }
  863. else{
  864. this.msgError(res.msg);
  865. }
  866. },
  867. beforeAvatarUploadVideo(file){
  868. const isLt30M = file.size / 1024 / 1024 < 10;
  869. const isMP4 = file.type === 'video/mp4';
  870. if (!isMP4) {
  871. this.$message.error('仅支持上传 MP4 格式的视频文件!');
  872. return false;
  873. }
  874. if (!isLt30M) {
  875. this.$message.error('上传大小不能超过 10MB!');
  876. return false;
  877. }
  878. return true;
  879. },
  880. handleInputVideoText(value,content){
  881. // 允许的字符:中文、英文(大小写)、数字和指定标点符号(,。!?)
  882. const regex = /^[\u4e00-\u9fa5,。!?,!?]+$/;
  883. // 删除不符合条件的字符
  884. const filteredValue = value.split('').filter(char => regex.test(char)).join('');
  885. this.$set(content, 'value', filteredValue);
  886. },
  887. //选择视频号
  888. hanldeSelectVideoNum(content, index) {
  889. this.videoNumOptions.content = content;
  890. this.videoNumOptions.contentIndex = index;
  891. this.videoNumOptions.open = true;
  892. },
  893. delSetList(index){
  894. this.setting.splice(index,1)
  895. },
  896. addSetList(){
  897. const newSetting = {
  898. contentType:'1',
  899. value: '',
  900. };
  901. // 将新设置项添加到 content.setting 数组中
  902. this.setting.push(newSetting);
  903. },
  904. handleKeydown(event, index) {
  905. const item = this.setting[index];
  906. const textarea = this.$refs[`textarea-${index}`][0].$refs.textarea;
  907. const cursorPosition = textarea.selectionStart;
  908. // 检查是否按下了 Backspace 或 Delete 键
  909. if (event.key === 'Backspace' || event.key === 'Delete') {
  910. const tags = ['#销售称呼#', '#客户称呼#']; // 需要检查的标签
  911. const value = item.value;
  912. // 遍历标签,检查是否需要删除
  913. for (const tag of tags) {
  914. let start, end;
  915. if (event.key === 'Backspace') {
  916. // 检查光标前是否是当前标签的一部分
  917. start = cursorPosition - tag.length;
  918. if (start >= 0 && value.slice(start, cursorPosition) === tag) {
  919. // 删除整个标签
  920. item.value = value.slice(0, start) + value.slice(cursorPosition);
  921. // 更新光标位置
  922. this.$nextTick(() => {
  923. textarea.setSelectionRange(start, start);
  924. });
  925. // 更新状态
  926. if (tag === '#销售称呼#') item.isSalesCallAdded = false;
  927. if (tag === '#客户称呼#') item.isSalesCallCustomerAdded = false;
  928. event.preventDefault(); // 阻止默认删除行为
  929. break; // 找到匹配的标签后退出循环
  930. }
  931. } else if (event.key === 'Delete') {
  932. // 检查光标后是否是当前标签的一部分
  933. end = cursorPosition + tag.length;
  934. if (end <= value.length && value.slice(cursorPosition, end) === tag) {
  935. // 删除整个标签
  936. item.value = value.slice(0, cursorPosition) + value.slice(end);
  937. // 更新状态
  938. if (tag === '#销售称呼#') item.isSalesCallAdded = false;
  939. if (tag === '#客户称呼#') item.isSalesCallCustomerAdded = false;
  940. event.preventDefault(); // 阻止默认删除行为
  941. break; // 找到匹配的标签后退出循环
  942. }
  943. }
  944. // 检查光标是否位于标签的中间
  945. for (let i = 0; i <= tag.length; i++) {
  946. const tagStart = cursorPosition - i;
  947. const tagEnd = tagStart + tag.length;
  948. if (
  949. tagStart >= 0 &&
  950. tagEnd <= value.length &&
  951. value.slice(tagStart, tagEnd) === tag
  952. ) {
  953. // 删除整个标签
  954. item.value = value.slice(0, tagStart) + value.slice(tagEnd);
  955. // 更新光标位置
  956. this.$nextTick(() => {
  957. textarea.setSelectionRange(tagStart, tagStart);
  958. });
  959. // 更新状态
  960. if (tag === '#销售称呼#') item.isSalesCallAdded = false;
  961. if (tag === '#客户称呼#') item.isSalesCallCustomerAdded = false;
  962. event.preventDefault(); // 阻止默认删除行为
  963. break; // 找到匹配的标签后退出循环
  964. }
  965. }
  966. }
  967. }
  968. },
  969. // 切换添加销售称呼按钮点击事件
  970. toggleSalesCall(index) {
  971. const item = this.setting[index];
  972. const salesCall = '#销售称呼#';
  973. const textarea = this.$refs[`textarea-${index}`][0].$refs.textarea;
  974. // 获取当前光标位置
  975. const cursorPosition = textarea.selectionStart;
  976. if (item.isSalesCallAdded) {
  977. // 移除所有的 #销售称呼#
  978. item.value = item.value.replace(new RegExp(salesCall, 'g'), '');
  979. } else {
  980. // 添加 #销售称呼#
  981. item.value = item.value.slice(0, cursorPosition) + salesCall + item.value.slice(cursorPosition);
  982. }
  983. // 切换状态
  984. item.isSalesCallAdded = !item.isSalesCallAdded;
  985. // 保持光标位置
  986. this.$nextTick(() => {
  987. textarea.setSelectionRange(cursorPosition, cursorPosition);
  988. });
  989. },
  990. toggleSalesCallCustomer(index) {
  991. const item = this.setting[index];
  992. const salesCall = '#客户称呼#';
  993. const textarea = this.$refs[`textarea-${index}`][0].$refs.textarea;
  994. // 获取当前光标位置
  995. const cursorPosition = textarea.selectionStart;
  996. if (item.isSalesCallCustomerAdded) {
  997. // 移除所有的 #销售称呼#
  998. item.value = item.value.replace(new RegExp(salesCall, 'g'), '');
  999. } else {
  1000. // 添加 #客户称呼#
  1001. item.value = item.value.slice(0, cursorPosition) + salesCall + item.value.slice(cursorPosition);
  1002. }
  1003. // 切换状态
  1004. item.isSalesCallCustomerAdded = !item.isSalesCallCustomerAdded;
  1005. // 保持光标位置
  1006. this.$nextTick(() => {
  1007. textarea.setSelectionRange(cursorPosition, cursorPosition);
  1008. });
  1009. },
  1010. handleContentTypeChange() {
  1011. //如果是链接的才上
  1012. if (this.msgForm.courseId != null ) {
  1013. const selectedCourse = this.courseList.find(course => parseInt(course.dictValue) === this.msgForm.courseId);
  1014. for (let i = 0; i < this.setting.length; i++) {
  1015. //响应式直接给链接的标题/封面上值
  1016. if (selectedCourse && this.msgForm.courseId != null) {
  1017. if (this.setting[i].contentType == 3 || this.setting[i].contentType == 9){
  1018. this.$set(this.setting[i], 'linkTitle', selectedCourse.dictLabel);
  1019. this.$set(this.setting[i], 'linkImageUrl', selectedCourse.dictImgUrl);
  1020. }
  1021. if (this.setting[i].contentType == 4 || this.setting[i].contentType == 10 || this.setting[i].contentType == 17
  1022. || this.setting[i].contentType == 23){//新增APP 看课 跳转短链回填封面
  1023. this.$set(this.setting[i], 'miniprogramPicUrl', selectedCourse.dictImgUrl);
  1024. }
  1025. }
  1026. }
  1027. }
  1028. if (this.msgForm.videoId != null ) {
  1029. // 查找选中的课节对应的 label
  1030. const selectedVideo = this.videoList.find(course => parseInt(course.dictValue) === this.msgForm.videoId);
  1031. for (let i = 0; i < this.setting.length; i++) {
  1032. //响应式直接给链接的描述上值
  1033. if (selectedVideo && this.msgForm.videoId != null) {
  1034. if (this.setting[i].contentType == 3 || this.setting[i].contentType == 9){
  1035. this.$set(this.setting[i], 'linkDescribe', selectedVideo.dictLabel);
  1036. if (this.projectFrom == 'sxjz' && selectedVideo.dictImgUrl) {
  1037. this.$set(this.setting[i], 'linkImageUrl', selectedVideo.dictImgUrl);
  1038. }
  1039. }
  1040. if (this.setting[i].contentType == 4 || this.setting[i].contentType == 10 || this.setting[i].contentType == 17
  1041. || this.setting[i].contentType == 23){//新增APP 看课 跳转短链回填标题
  1042. this.$set(this.setting[i], 'miniprogramTitle', selectedVideo.dictLabel);
  1043. if (this.projectFrom == 'sxjz' && selectedVideo.dictImgUrl) {
  1044. this.$set(this.setting[i], 'miniprogramPicUrl', selectedVideo.dictImgUrl);
  1045. }
  1046. }
  1047. }
  1048. }
  1049. }
  1050. },
  1051. resetSendMsgSop() {
  1052. this.liveGroupTypeId = null;
  1053. this.msgForm = {
  1054. liveId:null,
  1055. videoId:null,
  1056. courseId:null,
  1057. courseType:null,
  1058. setting:null,
  1059. sendTime:null,
  1060. draftStrategy:1,
  1061. };
  1062. this.resetForm("msgForm");
  1063. },
  1064. // 获取短信模板信息(类似福袋的处理方式)
  1065. getSmsTemplateInfo(content) {
  1066. // 如果短信模板列表为空,先加载数据
  1067. if (this.smsTemplateList.length === 0) {
  1068. getSmsTempList().then(response => {
  1069. this.smsTemplateList = response.rows || response.data || [];
  1070. // 加载完成后再次调用自身来处理选中项
  1071. this.processSelectedSmsTemplate(content);
  1072. }).catch(error => {
  1073. console.error('加载短信模板失败:', error);
  1074. this.$message.error('加载短信模板失败');
  1075. });
  1076. } else {
  1077. // 直接处理选中项
  1078. this.processSelectedSmsTemplate(content);
  1079. }
  1080. },
  1081. // 处理选中的短信模板
  1082. processSelectedSmsTemplate(content) {
  1083. const selectedTemplate = this.smsTemplateList.find(item => item.tempId === content.smsTemplateId);
  1084. if (selectedTemplate) {
  1085. // 自动填充模板内容预览
  1086. this.$set(content, 'smsTemplateContent', selectedTemplate.content || selectedTemplate.templateContent || '');
  1087. } else {
  1088. // 清空相关内容
  1089. this.$set(content, 'smsTemplateContent', '');
  1090. }
  1091. },
  1092. // 加载短信模板列表
  1093. loadSmsTemplates() {
  1094. if (this.smsTemplateList.length > 0) {
  1095. return; // 如果已经有数据,不再重复加载
  1096. }
  1097. getSmsTempList().then(response => {
  1098. this.smsTemplateList = response.rows || response.data || [];
  1099. if (this.smsTemplateList.length === 0) {
  1100. this.$message.info('暂无可用的短信模板');
  1101. }
  1102. }).catch(error => {
  1103. console.error('加载短信模板失败:', error);
  1104. this.$message.error('加载短信模板失败');
  1105. });
  1106. },
  1107. // 多选框选中数据
  1108. handleSelectionChange(selection) {
  1109. this.ids = selection.map(item => item.id)
  1110. this.single = selection.length!==1
  1111. this.multiple = !selection.length
  1112. },
  1113. submitMsgForm(){
  1114. this.$refs["msgForm"].validate(valid => {
  1115. if (valid) {
  1116. if (this.msgForm.draftStrategy==1 || this.msgForm.draftStrategy == 4) {
  1117. if (!!hasLiveSetting && (this.msgForm.courseId != null && this.msgForm.courseId != '')) {
  1118. return this.$message.error("直播间不能选取课程");
  1119. }
  1120. if (!!hasLiveSetting && (this.msgForm.videoId != null && this.msgForm.videoId != '')) {
  1121. return this.$message.error("直播间不能选取课节");
  1122. }
  1123. this.msgForm.setting = JSON.stringify(this.setting)
  1124. let jsonSetting = JSON.parse(this.msgForm.setting);
  1125. let hasLiveSetting = false;
  1126. console.log(jsonSetting)
  1127. for (let index = 0; index < jsonSetting.length; index++) {
  1128. if (!!jsonSetting[index] && (jsonSetting[index].contentType == "12" || jsonSetting[index].contentType == "18" || jsonSetting[index].contentType == "19" || jsonSetting[index].contentType == "20")) {
  1129. if (!!hasLiveSetting) {
  1130. return this.$message.error("发送直播间只能一次只能发送一条");
  1131. }
  1132. hasLiveSetting = true;
  1133. }
  1134. }
  1135. if (this.setting.length <= 0) {
  1136. return this.$message.error("请添加规则")
  1137. }
  1138. if ((this.msgForm.courseId === null || this.msgForm.courseId === '') && !hasLiveSetting && this.msgForm.liveId === null) {
  1139. return this.$message.error("课程不能为空")
  1140. }
  1141. if ((this.msgForm.videoId === null || this.msgForm.videoId === '') && !hasLiveSetting && this.msgForm.liveId === null) {
  1142. return this.$message.error("课节不能为空")
  1143. }
  1144. if (this.msgForm.courseType === null || this.msgForm.courseType === '') {
  1145. return this.$message.error("消息类型不能为空")
  1146. }
  1147. if(this.msgForm.draftStrategy == 4){
  1148. if (this.msgForm.aiCustomerRoleId == null || this.msgForm.aiCustomerRoleId == '') {
  1149. return this.$message.error("请选择外呼任务")
  1150. }
  1151. }
  1152. if(this.msgForm.draftStrategy != 4) {
  1153. for (let i = 0; i < this.setting.length; i++) {
  1154. if ((this.setting[i].contentType == 1 || this.setting[i].contentType == 15) && (this.setting[i].value == null || this.setting[i].value == "")) {
  1155. return this.$message.error("内容不能为空")
  1156. }
  1157. if (this.setting[i].contentType == 2 && (this.setting[i].imgUrl == null || this.setting[i].imgUrl == "")) {
  1158. return this.$message.error("图片不能为空")
  1159. }
  1160. if ((this.setting[i].contentType == 3 || this.setting[i].contentType == 9) && (this.setting[i].linkTitle == null || this.setting[i].linkTitle == "")) {
  1161. return this.$message.error("链接标题不能为空")
  1162. }
  1163. if ((this.setting[i].contentType == 3 || this.setting[i].contentType == 9) && (this.setting[i].linkDescribe == null || this.setting[i].linkDescribe == "")) {
  1164. return this.$message.error("链接描述不能为空")
  1165. }
  1166. if ((this.setting[i].contentType == 3 || this.setting[i].contentType == 9) && (this.setting[i].linkImageUrl == null || this.setting[i].linkImageUrl == "")) {
  1167. return this.$message.error("链接图片不能为空")
  1168. }
  1169. 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 == "")) {
  1170. return this.$message.error("链接地址不能为空")
  1171. }
  1172. if ((this.setting[i].contentType == 4 || this.setting[i].contentType == 10 || this.setting[i].contentType == 17 || this.setting[i].contentType == 23 || this.setting[i].contentType == 24) && (this.setting[i].miniprogramTitle == null || this.setting[i].miniprogramTitle == "")) {
  1173. return this.$message.error("小程序消息标题不能为空")
  1174. }
  1175. if ((this.setting[i].contentType == 4 || this.setting[i].contentType == 10 || this.setting[i].contentType == 17 || this.setting[i].contentType == 23 || this.setting[i].contentType == 24) && (this.setting[i].miniprogramPicUrl == null || this.setting[i].miniprogramPicUrl == "")) {
  1176. return this.$message.error("小程序封面地址不能为空")
  1177. }
  1178. if (this.setting[i].contentType == 10 && (this.setting[i].miniprogramPage == null || this.setting[i].miniprogramPage == "")) {
  1179. return this.$message.error("小程序page地址不能为空")
  1180. }
  1181. if (this.setting[i].contentType == 5 && (this.setting[i].fileUrl == null || this.setting[i].fileUrl == "")) {
  1182. return this.$message.error("文件不能为空")
  1183. }
  1184. if (this.setting[i].contentType == 6 && (this.setting[i].videoUrl == null || this.setting[i].videoUrl == "")) {
  1185. return this.$message.error("视频不能为空")
  1186. }
  1187. if ((this.setting[i].contentType == 7 || this.setting[i].contentType == 16) && (this.setting[i].value == null || this.setting[i].value == "")) {
  1188. return this.$message.error("语音不能为空")
  1189. }
  1190. // 添加对福袋的验证
  1191. if (this.setting[i].contentType == 14 && (this.setting[i].luckyBagId == null || this.setting[i].luckyBagId === "")) {
  1192. return this.$message.error("福袋不能为空")
  1193. }
  1194. if ((this.setting[i].contentType == 12 || this.setting[i].contentType == 24) && (this.setting[i].liveId == null || this.setting[i].liveId == "")) {
  1195. return this.$message.error("直播间不能为空");
  1196. }
  1197. if (this.setting[i].contentType == 20 && (this.setting[i].liveId == null || this.setting[i].liveId == "")) {
  1198. return this.$message.error("直播间不能为空");
  1199. }
  1200. if (this.setting[i].contentType == 20 && (this.setting[i].miniprogramTitle == null || this.setting[i].miniprogramTitle == "")) {
  1201. return this.$message.error("标题不能为空");
  1202. }
  1203. if (this.setting[i].contentType == 20 && (this.setting[i].miniprogramPicUrl == null || this.setting[i].miniprogramPicUrl == "")) {
  1204. return this.$message.error("封面不能为空");
  1205. }
  1206. // 短信模板验证
  1207. if (this.setting[i].contentType == 21 && (this.setting[i].smsTemplateId == null || this.setting[i].smsTemplateId === "")) {
  1208. return this.$message.error("短信模板不能为空")
  1209. } else {
  1210. if (this.setting[i].contentType == 21 && this.setting[i].smsTemplateId) {
  1211. // 根据选中的短信模板ID查找对应的模板信息
  1212. const selectedTemplate = this.smsTemplateList.find(template => template.tempId === this.setting[i].smsTemplateId);
  1213. if (selectedTemplate) {
  1214. // 设置短信模板的相关字段
  1215. this.$set(this.setting[i], 'smsTemplateCode', selectedTemplate.tempCode || '');
  1216. this.$set(this.setting[i], 'smsTemplateTitle', selectedTemplate.title || '');
  1217. }
  1218. }
  1219. }
  1220. }
  1221. }
  1222. // // 短信模板数据映射
  1223. // for (let j = 0; j < processedSetting.length; j++) {
  1224. // const item = processedSetting[j];
  1225. // if (item.contentType == 21 && item.smsTemplateId) {
  1226. // // 根据选中的短信模板ID查找对应的模板信息
  1227. // const selectedTemplate = this.smsTemplateList.find(template => template.tempId === item.smsTemplateId);
  1228. // if (selectedTemplate) {
  1229. // // 设置短信模板的相关字段
  1230. // this.$set(item, 'smsTemplateCode', selectedTemplate.tempCode || '');
  1231. // this.$set(item, 'smsTemplateTitle', selectedTemplate.title || '');
  1232. // }
  1233. // }
  1234. // }
  1235. // // 重新序列化处理后的数据
  1236. // this.msgForm.setting = JSON.stringify(processedSetting);
  1237. this.msgForm.setting = JSON.stringify(this.setting)
  1238. this.sendMsgOpen.open = false;
  1239. const loading = this.$loading({
  1240. lock: true,
  1241. text: '正在执行中请稍后~~请不要刷新页面!!',
  1242. spinner: 'el-icon-loading',
  1243. background: 'rgba(0, 0, 0, 0.7)'
  1244. });
  1245. sendMsgSopType(this.msgForm).then(response => {
  1246. this.msgSuccess("一键群发成功");
  1247. loading.close();
  1248. this.setting = [];
  1249. this.resetSendMsgSop();
  1250. }).finally(() => {
  1251. loading.close();
  1252. });
  1253. }
  1254. }
  1255. });
  1256. },
  1257. cancelMsgForm(){
  1258. this.sendMsgOpen.open = false;
  1259. this.resetSendMsgSop();
  1260. },
  1261. liveChangemsgForm(liveId){
  1262. if(!!liveId){
  1263. for(let i =0;i<this.setting.length;i++){
  1264. this.$set(this.setting[i], 'liveId', liveId);
  1265. this.liveChange(this.setting[i]);
  1266. }
  1267. }
  1268. },
  1269. liveDisabled(){
  1270. return !!this.msgForm && !!this.msgForm.liveId ;
  1271. },
  1272. openVoiceDialog(item) {
  1273. this.voiceOptions.open = true;
  1274. this.voiceOptions.currentItem = item;
  1275. this.voiceOptions.keyword = '';
  1276. this.voiceOptions.pageNum = 1;
  1277. this.searchVoice();
  1278. },
  1279. searchVoice() {
  1280. this.voiceOptions.loading = true;
  1281. getQwSopTempVoiceCompanyUser({
  1282. pageNum: this.voiceOptions.pageNum,
  1283. pageSize: this.voiceOptions.pageSize,
  1284. keyword: this.voiceOptions.keyword || undefined,
  1285. }).then(response => {
  1286. this.voiceOptions.list = response.rows || response.list || [];
  1287. this.voiceOptions.total = response.total || 0;
  1288. }).finally(() => {
  1289. this.voiceOptions.loading = false;
  1290. });
  1291. },
  1292. selectVoice(row) {
  1293. if (this.voiceOptions.currentItem) {
  1294. this.$set(this.voiceOptions.currentItem, 'value', row.voiceTxt || '');
  1295. }
  1296. this.voiceOptions.open = false;
  1297. },
  1298. handleVoiceSelect(row) {
  1299. // 预留行选中事件
  1300. }
  1301. }
  1302. };
  1303. </script>