| | |
| | | > |
| | | <el-row :gutter="20"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="模版名称" prop="extName"> |
| | | <el-form-item label="模板名称" prop="extName"> |
| | | <el-input |
| | | v-model="baseForm.extName" |
| | | placeholder="请输入" |
| | | ></el-input> </el-form-item |
| | | ></el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="模版分类" prop="groupID"> |
| | | <el-form-item label="模板分类" prop="groupID"> |
| | | <el-select v-model="baseForm.groupID" placeholder="请选择分类"> |
| | | <el-option |
| | | v-for="item in deptOptions" |
| | |
| | | </el-row> |
| | | <el-row :gutter="20"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="模版概述" prop="name"> |
| | | <el-form-item label="模板概述" prop="name"> |
| | | <el-input |
| | | v-model="baseForm.note" |
| | | placeholder="请输入" |
| | |
| | | ></el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <div class="elcardiv"> |
| | | <div class="leftvlue-jbxx">话术列表</div> |
| | | <el-divider></el-divider> |
| | | <div class="presentation"> |
| | | <div class="presentation-left"> |
| | | <div class="leftvlue-jbxx">话术列表</div> |
| | | <el-divider></el-divider> |
| | | |
| | | <el-table :data="targetList" :row-class-name="tableRowClassName"> |
| | | <el-table-column label="序号" align="center" key="id" prop="id" /> |
| | | <el-table :data="targetList" :row-class-name="tableRowClassName"> |
| | | <el-table-column |
| | | label="序号" |
| | | fixed |
| | | align="center" |
| | | key="id" |
| | | prop="id" |
| | | /> |
| | | |
| | | <el-table-column |
| | | label="问题文本" |
| | | align="center" |
| | | key="switchText" |
| | | width="250" |
| | | prop="switchText" |
| | | :show-overflow-tooltip="true" |
| | | <el-table-column |
| | | label="问题文本" |
| | | align="center" |
| | | key="switchText" |
| | | width="250" |
| | | prop="switchText" |
| | | :show-overflow-tooltip="true" |
| | | > |
| | | </el-table-column> |
| | | |
| | | <el-table-column |
| | | label="是否可用" |
| | | align="center" |
| | | key="isEnable" |
| | | prop="isEnable" |
| | | > |
| | | <template slot-scope="scope"> |
| | | <span>{{ scope.row.isEnable == 1 ? "停用" : "启用" }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | label="最近修改" |
| | | align="center" |
| | | key="updateTime" |
| | | width="250" |
| | | prop="updateTime" |
| | | :show-overflow-tooltip="true" |
| | | > |
| | | </el-table-column> |
| | | |
| | | <el-table-column |
| | | label="操作" |
| | | align="center" |
| | | fixed="right" |
| | | width="200" |
| | | class-name="small-padding fixed-width" |
| | | > |
| | | <template slot-scope="scope"> |
| | | <el-button |
| | | size="medium" |
| | | type="text" |
| | | @click="handleUpdate(scope.row, scope.$index)" |
| | | ><span class="button-textxg" |
| | | ><i class="el-icon-edit"></i>修改</span |
| | | ></el-button |
| | | > |
| | | |
| | | <el-button |
| | | size="medium" |
| | | type="text" |
| | | @click="handleDelete(scope.row)" |
| | | ><span class="button-textsc" |
| | | ><i class="el-icon-delete"></i>删除</span |
| | | ></el-button |
| | | > |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | </div> |
| | | <div class="presentation-right"> |
| | | <el-form |
| | | :model="ruleForm" |
| | | :rules="rules" |
| | | ref="ruleForm" |
| | | label-width="100px" |
| | | class="demo-ruleForm" |
| | | > |
| | | </el-table-column> |
| | | |
| | | <el-table-column |
| | | label="是否可用" |
| | | align="center" |
| | | key="isEnable" |
| | | prop="isEnable" |
| | | > |
| | | <template slot-scope="scope"> |
| | | <span>{{ scope.row.isEnable == 1 ? "停用" : "启用" }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | label="最近修改" |
| | | align="center" |
| | | key="updateTime" |
| | | width="250" |
| | | prop="updateTime" |
| | | :show-overflow-tooltip="true" |
| | | > |
| | | </el-table-column> |
| | | |
| | | <el-table-column |
| | | label="操作" |
| | | align="center" |
| | | width="200" |
| | | class-name="small-padding fixed-width" |
| | | > |
| | | <template slot-scope="scope"> |
| | | <el-button |
| | | size="medium" |
| | | type="text" |
| | | @click="handleUpdate(scope.row, scope.$index)" |
| | | ><span class="button-textxg" |
| | | ><i class="el-icon-edit"></i>修改</span |
| | | ></el-button |
| | | > |
| | | |
| | | <el-button |
| | | size="medium" |
| | | type="text" |
| | | @click="handleDelete(scope.row)" |
| | | ><span class="button-textsc" |
| | | ><i class="el-icon-delete"></i>删除</span |
| | | ></el-button |
| | | > |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <el-form |
| | | :model="ruleForm" |
| | | :rules="rules" |
| | | ref="ruleForm" |
| | | label-width="100px" |
| | | class="demo-ruleForm" |
| | | > |
| | | <div style="margin: 15px; margin-top: 50px"> |
| | | <div class="leftvlue-jbxx">话术编辑</div> |
| | | <el-divider></el-divider> |
| | | <div style="margin: 15px; margin-top: 50px"> |
| | | <el-form-item label="话术文本" prop="name"> |
| | | <el-input |
| | | v-model="ruleForm.switchText" |
| | | placeholder="请输入" |
| | | ></el-input> |
| | | </el-form-item> |
| | | <el-row :gutter="20"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="是否启用" prop="resource"> |
| | | <el-select v-model="ruleForm.isEnable" placeholder="请选择"> |
| | | <el-option |
| | | v-for="item in usable" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | > |
| | | </el-option> |
| | | </el-select> </el-form-item |
| | | ></el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="是否为结束语" prop="resource"> |
| | | <el-select v-model="ruleForm.isEnd" placeholder="请选择"> |
| | | <el-option |
| | | v-for="item in usablend" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | > |
| | | </el-option> |
| | | </el-select> </el-form-item |
| | | ></el-col> |
| | | </el-row> |
| | | <el-form-item label="问题语音" prop="verbaltrickyy"> |
| | | <el-upload |
| | | class="upload-demo" |
| | | action="https://jsonplaceholder.typicode.com/posts/" |
| | | :on-change="handleChange" |
| | | :file-list="fileList" |
| | | :limit="1" |
| | | :on-exceed="handleExceed" |
| | | > |
| | | <el-button size="small" type="primary">点击上传</el-button> |
| | | </el-upload> |
| | | <!-- <el-input v-model="indexform.userName" maxlength="30" /> --> |
| | | </el-form-item> |
| | | |
| | | <el-form-item label="话术文本" prop="name"> |
| | | <el-input |
| | | v-model="ruleForm.switchText" |
| | | placeholder="请输入" |
| | | ></el-input> |
| | | </el-form-item> |
| | | <el-row :gutter="20"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="是否启用" prop="resource"> |
| | | <el-select v-model="ruleForm.isEnable" placeholder="请选择"> |
| | | <el-form-item label="关键字(含)" prop="desc"> |
| | | <div class="xinz-inf"> |
| | | <el-tag |
| | | :key="crux" |
| | | type="success" |
| | | v-for="crux in ruleForm.dynamiccruxs" |
| | | closable |
| | | effect="dark" |
| | | :disable-transitions="false" |
| | | @close="handleClosecrux(crux, ruleForm, 1)" |
| | | > |
| | | {{ crux }} |
| | | </el-tag> |
| | | <el-select |
| | | v-model="inputValue" |
| | | v-if="inputVisible" |
| | | @change="handleInputConfirm(ruleForm)" |
| | | filterable |
| | | remote |
| | | allow-create |
| | | reserve-keyword |
| | | default-first-option |
| | | :loading="loading" |
| | | placeholder="请选择" |
| | | > |
| | | <el-option |
| | | v-for="item in usable" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | v-for="ruleForms in regular" |
| | | :key="ruleForms.label" |
| | | :label="ruleForms.label" |
| | | :value="ruleForms.label" |
| | | > |
| | | </el-option> |
| | | </el-select> </el-form-item |
| | | ></el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="是否为结束语" prop="resource"> |
| | | <el-select v-model="ruleForm.isEnd" placeholder="请选择"> |
| | | </el-select> |
| | | <el-button |
| | | v-else |
| | | class="button-new-tag" |
| | | size="small" |
| | | @click="showInput(ruleForm)" |
| | | >+ 新增</el-button |
| | | > |
| | | </div> |
| | | </el-form-item> |
| | | <el-form-item label="关键字(非)" prop="desc"> |
| | | <div class="xinz-inf"> |
| | | <el-tag |
| | | :key="crux" |
| | | type="warning" |
| | | v-for="crux in ruleForm.nodynamiccruxs" |
| | | closable |
| | | effect="dark" |
| | | :disable-transitions="false" |
| | | @close="handleClosecrux(crux, ruleForm, 2)" |
| | | > |
| | | {{ crux }} |
| | | </el-tag> |
| | | <el-select |
| | | v-model="inputValue" |
| | | v-if="noinputVisible" |
| | | @change="handleInputConfirm(ruleForm)" |
| | | filterable |
| | | remote |
| | | allow-create |
| | | reserve-keyword |
| | | default-first-option |
| | | :loading="loading" |
| | | placeholder="请选择" |
| | | > |
| | | <el-option |
| | | v-for="item in usablend" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | v-for="ruleForms in noregular" |
| | | :key="ruleForms.value" |
| | | :label="ruleForms.label" |
| | | :value="ruleForms.label" |
| | | > |
| | | </el-option> |
| | | </el-select> </el-form-item |
| | | ></el-col> |
| | | </el-row> |
| | | <el-form-item label="问题语音" prop="verbaltrickyy"> |
| | | <el-upload |
| | | class="upload-demo" |
| | | action="https://jsonplaceholder.typicode.com/posts/" |
| | | :on-change="handleChange" |
| | | :file-list="fileList" |
| | | :limit="1" |
| | | :on-exceed="handleExceed" |
| | | > |
| | | <el-button size="small" type="primary">点击上传</el-button> |
| | | </el-upload> |
| | | <!-- <el-input v-model="indexform.userName" maxlength="30" /> --> |
| | | </el-form-item> |
| | | |
| | | <el-form-item label="匹配文本" prop="desc"> |
| | | <el-input |
| | | type="textarea" |
| | | placeholder="请输入匹配正则" |
| | | v-model="ruleForm.selfRegex" |
| | | ></el-input> |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <el-button type="primary" @click="submitForm('ruleForm')" |
| | | >保存模版</el-button |
| | | > |
| | | <el-button |
| | | v-if="ruleForm.id" |
| | | type="primary" |
| | | plain |
| | | @click="modification('edit')" |
| | | >保存话术</el-button |
| | | > |
| | | <el-button |
| | | v-else |
| | | type="success" |
| | | plain |
| | | @click="modification('add')" |
| | | >新增话术</el-button |
| | | > |
| | | <el-button @click="resetForm('ruleForm')">关闭</el-button> |
| | | </el-form-item> |
| | | </div> |
| | | </el-form> |
| | | </el-select> |
| | | <el-button |
| | | v-else |
| | | class="button-new-tag" |
| | | size="small" |
| | | @click="showInputno(ruleForm)" |
| | | >+ 新增</el-button |
| | | > |
| | | </div> |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <el-button type="primary" @click="submitForm('ruleForm')" |
| | | >保存模板</el-button |
| | | > |
| | | <el-button |
| | | v-if="ruleForm.id" |
| | | type="primary" |
| | | plain |
| | | @click="modification('edit')" |
| | | >保存话术</el-button |
| | | > |
| | | <el-button |
| | | v-else |
| | | type="success" |
| | | plain |
| | | @click="modification('add')" |
| | | >新增话术</el-button |
| | | > |
| | | <el-button @click="resetForm('ruleForm')">关闭</el-button> |
| | | </el-form-item> |
| | | </div> |
| | | </el-form> |
| | | </div> |
| | | </div> |
| | | </el-card> |
| | | </div> |
| | |
| | | label: "结束语", |
| | | }, |
| | | ], |
| | | ruleForm: {}, |
| | | ruleForm: { |
| | | dynamiccruxs: [], |
| | | nodynamiccruxs: [], |
| | | }, |
| | | baseForm: { |
| | | extName: "", |
| | | }, |
| | | rules: {}, |
| | | bases: {}, |
| | | whether: 1, //1为关键词,2为否定关键词 |
| | | inputValue: "", |
| | | inputVisible: false, |
| | | noinputVisible: false, |
| | | loading: false, |
| | | regular: [], |
| | | noregular: [], |
| | | nodynamiccruxs: ["别", "不"], |
| | | dynamiccruxs: ["好"], |
| | | }; |
| | | }, |
| | | |
| | |
| | | this.usable = store.getters.usablesz; |
| | | this.languagelist = store.getters.languagelist; |
| | | this.mode = store.getters.mode; |
| | | this.regular = store.getters.regular; |
| | | this.noregular = store.getters.noregular; |
| | | }, |
| | | |
| | | methods: { |
| | |
| | | } |
| | | return ""; |
| | | }, |
| | | // 正则----------------- |
| | | // 生成正则 |
| | | generateRegex(row) { |
| | | let regex = ""; |
| | | let regexno = ""; |
| | | let hostregex = ""; |
| | | let hostregexno = ""; |
| | | |
| | | for (let i = 0; i < this.ruleForm.dynamiccruxs.length; i++) { |
| | | regex += `${this.ruleForm.dynamiccruxs[i]}|`; |
| | | } |
| | | for (let i = 0; i < this.ruleForm.nodynamiccruxs.length; i++) { |
| | | regexno += `${this.ruleForm.nodynamiccruxs[i]}|`; |
| | | } |
| | | regex = regex.slice(0, -1); |
| | | regexno = regexno.slice(0, -1); |
| | | hostregex = "(?=.*(?:" + `${regex}` + ")).*$"; |
| | | hostregexno = "^(?!.(?:" + `${regexno}` + ")).*$"; |
| | | this.ruleForm.selfRegex = hostregex; |
| | | this.ruleForm.selfRegex2 = hostregexno; |
| | | console.log(hostregex, "确定字匹配"); |
| | | console.log(hostregexno, "否定字匹配"); |
| | | }, |
| | | handleClosecrux(crux, item, whether) { |
| | | if (whether == 1) { |
| | | item.dynamiccruxs.splice(item.dynamiccruxs.indexOf(crux), 1); |
| | | console.log(1); |
| | | console.log(item.dynamiccruxs); |
| | | console.log(item.nodynamiccruxs); |
| | | } else { |
| | | console.log(2); |
| | | item.nodynamiccruxs.splice(item.nodynamiccruxs.indexOf(crux), 1); |
| | | } |
| | | this.generateRegex(item); |
| | | }, |
| | | handleInputConfirm(row) { |
| | | // let index = this.TargetoptionList.indexOf(row); |
| | | console.log(this.ruleForm.dynamiccruxs); |
| | | console.log(this.ruleForm.nodynamiccruxs); |
| | | if (this.whether == 1 && this.inputValue) { |
| | | console.log(1); |
| | | if (this.ruleForm.dynamiccruxs.indexOf(this.inputValue) == -1) { |
| | | this.ruleForm.dynamiccruxs.push(this.inputValue); |
| | | console.log(2); |
| | | } else { |
| | | this.$message.error("关键字已存在"); |
| | | } |
| | | // this.inputVisible = false; |
| | | this.inputVisible = false; |
| | | } else if (this.whether == 2 && this.inputValue) { |
| | | console.log(this.ruleForm.nodynamiccruxs.indexOf(this.inputValue)); |
| | | if (this.ruleForm.nodynamiccruxs.indexOf(this.inputValue) == -1) { |
| | | this.ruleForm.nodynamiccruxs.push(this.inputValue); |
| | | } else { |
| | | this.$message.error("关键字已存在"); |
| | | } |
| | | // this.noinputVisible = false; |
| | | this.noinputVisible = false; |
| | | } |
| | | this.generateRegex(row); |
| | | |
| | | this.inputValue = ""; |
| | | }, |
| | | showInput(row) { |
| | | // let index = this.TargetoptionList.indexOf(row); |
| | | this.inputVisible = true; |
| | | // this.$set(this.ruleForm, "inputVisible", true); |
| | | this.whether = 1; |
| | | }, |
| | | showInputno(row) { |
| | | // let index = this.TargetoptionList.indexOf(row); |
| | | this.noinputVisible = true; |
| | | // this.$set(this.ruleForm, "noinputVisible", true); |
| | | this.whether = 2; |
| | | }, |
| | | }, |
| | | }; |
| | | </script> |
| | |
| | | margin: 15px 0; |
| | | } |
| | | } |
| | | .presentation { |
| | | margin: 20px 0; |
| | | display: flex; |
| | | .presentation-left { |
| | | width: 60%; |
| | | // height: 500px; |
| | | } |
| | | .presentation-right { |
| | | width: 40%; |
| | | max-height: 688px; |
| | | padding: 0 20px; |
| | | font-size: 18px; |
| | | overflow: auto; |
| | | } |
| | | .leftvlue-jbxx { |
| | | font-size: 24px; |
| | | border-left: 5px solid #5788fe; |
| | | padding-left: 5px; |
| | | margin: 15px 0; |
| | | } |
| | | } |
| | | .button-textxg { |
| | | color: rgb(35, 81, 233); |
| | | } |
| | | .button-textsc { |
| | | color: rgb(235, 23, 23); |
| | | } |
| | | .topicxq { |
| | | background-color: #e2f5fc; |
| | | border-radius: 4px; |
| | | margin-top: 10px; |
| | | padding: 10px; |
| | | } |
| | | |
| | | .el-tag + .el-tag { |
| | | margin-left: 10px; |
| | | } |
| | | .button-new-tag { |
| | | margin-left: 10px; |
| | | height: 32px; |
| | | line-height: 30px; |
| | | padding-top: 0; |
| | | padding-bottom: 0; |
| | | } |
| | | .input-new-tag { |
| | | width: 90px; |
| | | margin-left: 10px; |
| | | vertical-align: bottom; |
| | | } |
| | | ::v-deep.el-table .warning-row { |
| | | background: rgb(193, 208, 250); |
| | | } |