测试完成

WXL

2024-09-09 d27e3ada8f1e9c005747988e9bf2519fcd6da21a

 src/views/repositoryai/general/particulars/index.vue

@@ -10,14 +10,14 @@
      >
        <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"
@@ -31,7 +31,7 @@
        </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="请输入"
@@ -51,156 +51,243 @@
          ></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>
@@ -247,12 +334,24 @@
          label: "结束语",
        },
      ],
      ruleForm: {},
      ruleForm: {
        dynamiccruxs: [],
        nodynamiccruxs: [],
      },
      baseForm: {
        extName: "",
      },
      rules: {},
      bases: {},
      whether: 1, //1为关键词，2为否定关键词
      inputValue: "",
      inputVisible: false,
      noinputVisible: false,
      loading: false,
      regular: [],
      noregular: [],
      nodynamiccruxs: ["别", "不"],
      dynamiccruxs: ["好"],
    };
  },

@@ -262,6 +361,8 @@
    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: {
@@ -388,6 +489,81 @@
      }
      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>
@@ -402,12 +578,55 @@
    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);
}