WXL
2024-02-04 cf9259c2ebee0e82c32864a1ee91d96c403b9099
src/views/knowledge/questionbank/particulars/index.vue
@@ -6,12 +6,34 @@
          <div class="headline">
            题目设置详情
            <span style="margin-left: 30px"
              ><el-button type="primary" @click="Submittopicobj"
              ><el-button type="primary" @click="compileissue"
                >保存</el-button
              ></span
            >
          </div>
          <div style="margin-left: 8%">
            <el-form-item label="问题分类">
              <el-select
                v-model="topicobj.categoryid"
                size="medium"
                filterable
                placeholder="请选择分类"
              >
                <el-option-group
                  v-for="group in classifylist"
                  :key="group.id"
                  :label="group.name"
                >
                  <el-option
                    v-for="item in group.svyLibTopicCategoryList"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id"
                  >
                  </el-option>
                </el-option-group>
              </el-select>
            </el-form-item>
            <el-row :gutter="10">
              <el-col :span="6"
                ><el-form-item label="题目标题">
@@ -23,7 +45,7 @@
              <el-col :span="6"
                ><el-form-item label="是否可用">
                  <el-select
                    v-model="topicobj.ishide"
                    v-model="topicobj.isavailable"
                    size="medium"
                    filterable
                    placeholder="请选择分类"
@@ -41,7 +63,7 @@
              <el-col :span="8"
                ><el-form-item label="语言(缺)">
                  <el-select
                    v-model="topicobj.languageh"
                    v-model="topicobj.language"
                    size="medium"
                    filterable
                    placeholder="请选择分类"
@@ -59,13 +81,23 @@
            </el-row>
            <el-row :gutter="10">
              <el-col :span="6"
                ><el-form-item label="是否必答">
                  <el-radio-group v-model="topicobj.ismandatory">
                    <el-radio label="1">是</el-radio>
                    <el-radio label="2">否</el-radio>
                  </el-radio-group>
                </el-form-item></el-col
              >
                ><el-form-item label="是否必填">
                  <el-select
                    v-model="topicobj.ismandatory"
                    size="medium"
                    filterable
                    placeholder="请选择分类"
                  >
                    <el-option
                      class="topicobjaa"
                      v-for="item in required"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    >
                    </el-option>
                  </el-select> </el-form-item
              ></el-col>
              <el-col :span="6"
                ><el-form-item label="题目类型">
                  <el-select
@@ -85,9 +117,9 @@
                  </el-select> </el-form-item
              ></el-col>
              <el-col :span="8"
                ><el-form-item label="适用方式(缺)">
                ><el-form-item label="适用方式">
                  <el-select
                    v-model="topicobj.languageh"
                    v-model="topicobj.suitway"
                    size="medium"
                    filterable
                    placeholder="请选择分类"
@@ -102,11 +134,13 @@
                    </el-option> </el-select></el-form-item
              ></el-col>
            </el-row>
            <el-form-item label="题目内容(缺)">
            <el-form-item label="题目内容">
              <el-input
                style="width: 40vw"
                type="textarea"
                v-model="topicobj.topic"
                id="topicContent"
                v-model="topicobj.topicContent"
                @focus="handleInput('topicContent')"
                placeholder="请输入标题"
              ></el-input>
            </el-form-item>
@@ -115,14 +149,14 @@
              <el-form-item label="标签" prop="desc">
                <div class="xinz-inf">
                  <el-tag
                    :key="tag.tagname"
                    :key="tag"
                    type="success"
                    v-for="tag in dynamicTags"
                    closable
                    :disable-transitions="false"
                    @close="handleClosetag(tag)"
                  >
                    {{ tag.tagname }}
                    {{ tag }}
                  </el-tag>
                  <el-select
                    v-model="inputValue"
@@ -197,6 +231,54 @@
                </div>
              </el-form-item>
            </el-row>
            <!-- <el-form-item label="通知变量" prop="name">
              <div style="margin-bottom: 5px" v-for="item in variablelist">
                <el-row>
                  <el-col :span="5">
                    <el-input
                      v-model="item.variatename"
                      placeholder="请输入变量名"
                    ></el-input>
                  </el-col>
                  <el-col :span="8" :offset="1">
                    <el-input
                      v-model="item.variate"
                      placeholder="请输入变量内容"
                    ></el-input>
                  </el-col>
                  <el-col :span="8" :offset="1">
                    <el-button
                      type="success"
                      icon="el-icon-plus"
                      circle
                      @click="addvariable(item)"
                    ></el-button>
                    <el-button
                      v-if="!item.default"
                      type="danger"
                      icon="el-icon-delete"
                      circle
                      @click="delvariable(item)"
                    ></el-button>
                  </el-col>
                </el-row>
              </div>
            </el-form-item>
            <el-row>
              <el-col :span="24">
                <div
                  style="display: flex; margin-left: 66px; margin-bottom: 10px"
                >
                  <div
                    v-for="item in variablelist"
                    class="tsgname"
                    @click="tsgnameto(item)"
                  >
                    {{ item.variatename }}
                  </div>
                </div>
              </el-col></el-row
            > -->
          </div>
          <div class="headline">
@@ -210,14 +292,18 @@
              ></span
            >
          </div>
          <div class="topicxq" v-for="item in optionlist">
          <div
            class="topicxq"
            v-for="item in topicobj.svyLibTopicoptions"
            v-if="item.isoperation != 3"
          >
            <el-row :gutter="10">
              <el-col :span="11"
                ><el-form-item label="题号">
                ><el-form-item label="选项">
                  <el-input
                    type="text"
                    placeholder="请输入"
                    v-model="item.optionid"
                    placeholder="请输入选项"
                    v-model="item.optioncontent"
                    show-word-limit
                  >
                  </el-input> </el-form-item
@@ -232,28 +318,6 @@
                  >
                  </el-input> </el-form-item
              ></el-col>
            </el-row>
            <el-row :gutter="10">
              <el-col :span="11"
                ><el-form-item label="选项">
                  <el-input
                    type="text"
                    placeholder="请输入选项"
                    v-model="item.optioncontent"
                    show-word-limit
                  >
                  </el-input> </el-form-item
              ></el-col>
              <el-col :span="11"
                ><el-form-item label="下题跳转">
                  <el-input
                    type="text"
                    placeholder="请输入题号"
                    v-model="item.jump"
                    show-word-limit
                  >
                  </el-input> </el-form-item
              ></el-col>
              <el-col :span="2">
                <el-button
                  type="danger"
@@ -263,6 +327,7 @@
                ></el-button>
              </el-col>
            </el-row>
            <el-row :gutter="10">
              <el-form-item label="选中提示">
                <el-input
@@ -280,10 +345,10 @@
      </el-card>
    </div>
    <el-drawer
      title="添加题目"
      title="添加选项"
      :visible.sync="drawer"
      custom-class="demo-drawer"
      width="50%"
      width="66%"
    >
      <div class="preview-left">
        <el-form
@@ -295,37 +360,20 @@
        >
          <el-form-item label="标题" prop="userName">
            <el-input
              v-model="queryParams.userName"
              v-model="queryParams.targetname"
              placeholder="请输入"
              clearable
              style="width: 200px"
              @keyup.enter.native="handleQuery"
              @keyup.enter.native="gettargetInfo"
            />
          </el-form-item>
          <el-form-item label="主题" prop="sickness">
            <el-select
              v-model="queryParams.classify"
              size="medium"
              multiple
              filterable
              placeholder="请选择分类"
            >
              <el-option
                class="ruleFormaa"
                v-for="item in optionsclass"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-button
              type="primary"
              icon="el-icon-search"
              size="medium"
              @click="handleQuery"
              @click="gettargetInfo"
              >搜索</el-button
            >
            <el-button icon="el-icon-refresh" size="medium" @click="resetQuery"
@@ -333,19 +381,19 @@
            >
          </el-form-item>
        </el-form>
        <el-table v-loading="loading" :data="userList">
        <el-table v-loading="loading" :data="targetList">
          <el-table-column
            label="标题"
            align="center"
            key="userid"
            prop="userid"
            key="targetname"
            prop="targetname"
            width="100"
          />
          <el-table-column
            label="问题内容"
            align="center"
            key="userName"
            prop="userName"
            key="targetdesc"
            prop="targetdesc"
            width="200"
            :show-overflow-tooltip="true"
          />
@@ -367,6 +415,13 @@
            </template>
          </el-table-column>
        </el-table>
        <pagination
          v-show="total > 0"
          :total="total"
          :page.sync="queryParams.pageNum"
          :limit.sync="queryParams.pageSize"
          @pagination="gettargetInfo"
        />
      </div>
    </el-drawer>
  </div>
@@ -376,14 +431,13 @@
import { listtag } from "@/api/system/label";
import store from "@/store";
import {
  getissueclassify,
  delissueclassify,
  addissueclassify,
  gettargetInfo,
  getissuelist,
  issueinfo,
  compileissue,
  delissueinfo,
  Followupinfo,
  getissueclassify,
  deltargetillness,
  addtargetillness,
  getillnesslist,
@@ -394,27 +448,29 @@
export default {
  data() {
    return {
      topicobj: {},
      topicobj: {
        svyLibTopicoptions: [],
      },
      inputVisible: false,
      inputValue: "",
      currentInputId: "",
      total: 0,
      drawer: false,
      loading: false,
      id: [],
      userList: [
        {
          userid: "1",
          userName: "指标",
        },
        {
          userid: "2",
          userName: "二号问卷",
        },
      ],
      targetList: [],
      dynamicTags: [],
      optionsclass: [],
      variablelist: [
        { variatename: "姓名", variate: "${name}", default: 1 },
        { variatename: "电话", variate: "${phone}", default: 1 },
        { variatename: "病情", variate: "${illness}", default: 1 },
      ],
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        isavailable: "",
      },
      optionlist: [
        { value: "topic", table: "topic" },
@@ -422,6 +478,7 @@
        { value: "topic", table: "topic" },
      ],
      inputValueillness: "",
      required: [],
      themelist: [],
      languagelist: [],
      courtyardlist: [],
@@ -433,7 +490,7 @@
      optionsillness: [],
      illnesslistapi: [],
      illnesslist: [],
      classifylist: [],
      optionstag: [],
      xjxsoptions: [],
      usable: [],
@@ -444,23 +501,47 @@
  created() {
    this.gettabList();
    this.getissueinfo();
    this.gettargetInfo();
    this.mode = store.getters.mode;
    this.languagelist = store.getters.languagelist;
    this.usable = store.getters.usable;
    this.xjxsoptions = store.getters.xjxsoptions;
    this.required = store.getters.required;
  },
  methods: {
    Submittopicobj() {},
    // 公共方法---------------
    getIndexInArray(arr, obj) {
      return arr.indexOf(obj);
    },
    // 递归扁平化
    flattenArray(arr) {
      let result = [];
      arr.forEach((item) => {
        result.push(item);
        if (item.svyLibTopicCategoryList) {
          console.log(2);
          result = result.concat(
            this.flattenArray(item.svyLibTopicCategoryList)
          );
          delete item.svyLibTopicCategoryList;
        }
      });
      return result;
    },
    // -----------------------------
    // 获取数据
    getissueinfo() {
      this.id = this.$route.query.id;
      issueinfo(this.id).then((res) => {
        this.topicobj = res.data;
      if (!this.id) {
        return;
      }
      getissuelist({ topicid: this.id }).then((res) => {
        this.topicobj = res.rows[0];
        this.dynamicTags = this.topicobj.tag.split(",");
        this.variablelist = JSON.parse(this.topicobj.otherdata)
          ? JSON.parse(this.topicobj.otherdata)
          : this.variablelist;
      });
      getillnesslist({
        pageNum: 1,
@@ -471,13 +552,33 @@
      getillness({ outid: this.id, type: 4 }).then((res) => {
        this.illnesslist = res.rows;
      });
      // 分类
      getissueclassify({}).then((res) => {
        this.classifylist = res.rows;
      });
    },
    gettargetInfo() {
      gettargetInfo(this.queryParams).then((res) => {
        this.targetList = res.rows;
        this.total = res.total;
      });
    },
    // 新增或修改详情
    compileissue() {
      this.topicobj.svyLibTopicoptions = this.topicobj.svyLibTopicoptions.map(
        (item) => {
          if (item.isoperation != 1 && item.isoperation != 3) {
            item.isoperation = 2;
          }
          return item;
        }
      );
      this.topicobj.otherdata = JSON.stringify(this.variablelist);
      this.topicobj.tag = this.dynamicTags.join(",");
      if (this.id) {
        this.topicobj.isoperation = 1;
        this.topicobj.isoperation = 2;
        compileissue(this.topicobj).then((res) => {
          if (res.code == 1) {
          if (res.code == 200) {
            this.$message({
              message: "修改成功",
              type: "success",
@@ -491,9 +592,9 @@
          }
        });
      } else {
        this.topicobj.isoperation = 2;
        this.topicobj.isoperation = 1;
        compileissue(this.topicobj).then((res) => {
          if (res.code == 1) {
          if (res.code == 200) {
            this.$message({
              message: "新增成功",
              type: "success",
@@ -507,18 +608,41 @@
          }
        });
      }
      this.illnesslist.forEach((item, index) => {
        if (!item.id) {
          addtargetillness(item).then((res) => {});
        }
      });
      if (this.illnesslistapi.length) {
        deltargetillness(this.illnesslistapi.join(",")).then((res) => {});
      }
    },
    // 删除选项
    deletexuanx(row) {
      const index = this.getIndexInArray(this.optionlist, row);
      this.optionlist.splice(index, 1);
      const index = this.getIndexInArray(this.topicobj.svyLibTopicoptions, row);
      if (this.topicobj.svyLibTopicoptions[index].topicid) {
        this.topicobj.svyLibTopicoptions[index].isoperation = 3;
      } else {
        this.topicobj.svyLibTopicoptions.splice(index, 1);
      }
    },
    // 新增选项
    addoption() {
      this.optionlist.push({ value: "topic", table: "topic" });
      this.topicobj.svyLibTopicoptions.push({
        score: "",
        isoperation: 1,
      });
    },
    // 选择指标
    selectlabel(row) {},
    selectlabel(row) {
      const labellist = row.targetoptionList;
      labellist.forEach((item) => {
        this.topicobj.svyLibTopicoptions.push({
          optioncontent: item.targetvalue,
          isoperation: 1,
        });
      });
    },
    // 标签-----------------
    gettabList() {
@@ -535,9 +659,7 @@
    handleClosetag(tag) {
      console.log(tag);
      console.log(this.dynamicTags.indexOf(tag));
      const lindex = this.dynamicTags.indexOf(tag);
      this.dynamicTags.splice(this.dynamicTags.indexOf(tag), 1);
      this.ruleForm.ivrLibaTemplateTargetList[lindex].isoperation = 3;
    },
    handleInputConfirm() {
      let tagvalue = {};
@@ -558,8 +680,8 @@
              isoperation: 1,
            };
          }
          // this.ruleForm.ivrLibaTemplateTargetList.push(tagvalue);
          this.dynamicTags.push(tagvalue);
          // this.dynamicTags.push(tagvalue);
          this.dynamicTags.push(tagvalue.tagname);
        });
      }
      this.inputVisible = false;
@@ -635,9 +757,72 @@
      this.illnessVisible = false;
      this.$modal.msgSuccess("编辑成功");
    },
    // 查询题库
    handleQuery() {},
    resetQuery() {},
    // 便捷标签
    tsgnameto(row) {
      let inputValueArr = "";
      let el = document.querySelector("#" + this.currentInputId);
      //el.selectionStart; 这就是当前光标所在的位置(字符串中字符的index)
      if (this.currentInputId == "topicContent") {
        inputValueArr = this.topicobj.topicContent.split("");
        console.log(123);
      } else if (this.currentInputId == "nomatchtext") {
        inputValueArr = this.topicobj.nomatchtext.split("");
      } else if (this.currentInputId == "sliencetext") {
        inputValueArr = this.topicobj.sliencetext.split("");
      } else if (this.currentInputId == "noclearlytext") {
        inputValueArr = this.topicobj.noclearlytext.split("");
      } else if (this.currentInputId == "submoduletext") {
        inputValueArr = this.topicobj.submoduletext.split("");
      } else {
        return;
      }
      //将输入框内容切成数组,方便后续操作
      // inputValueArr = this.inputValue.split("");
      // 拿到选中文字的长度(后续可以用来替换选中的文字)
      let selectLength = el.selectionEnd - el.selectionStart;
      // 将要插入/替换的文字插入/替换(value.name是要插入/替换的字符串)
      inputValueArr.splice(el.selectionStart, selectLength, `${row.variate}`);
      // 把数组重新转换为字符串并赋值
      inputValueArr = inputValueArr.join("");
      console.log(inputValueArr);
      if (this.currentInputId == "topicContent") {
        this.topicobj.topicContent = inputValueArr;
      } else if (this.currentInputId == "nomatchtext") {
        this.topicobj.nomatchtext = inputValueArr;
      } else if (this.currentInputId == "sliencetext") {
        this.topicobj.sliencetext = inputValueArr;
      } else if (this.currentInputId == "noclearlytext") {
        this.topicobj.noclearlytext = inputValueArr;
      } else if (this.currentInputId == "submoduletext") {
        this.topicobj.submoduletext = inputValueArr;
      } else {
        return;
      }
    },
    // 新增变量
    addvariable() {
      this.variablelist.push({
        variatename: "",
        variate: "",
      });
    },
    // 删除变量
    delvariable(item) {
      const index = this.variablelist.indexOf(item);
      if (index !== -1) {
        this.variablelist.splice(index, 1); // 从索引位置删除一个元素
      } else {
        console.log("未找到该对象");
      }
    },
    // 输入获取id
    handleInput(id) {
      this.currentInputId = id;
      console.log("输入框的值已更新:", this.currentInputId);
      // 在这里执行更新数据的逻辑
    },
  },
};
</script>
@@ -691,6 +876,21 @@
    }
  }
}
.tsgname {
  width: 90px;
  margin-right: 10px;
  text-align: center;
  cursor: pointer;
  height: 40px;
  line-height: 40px;
  background: #7799fa;
  color: #ffff;
  font-size: 18px;
  border-radius: 5px;
}
.tsgname:hover {
  background: #3366f5;
}
.preview-left {
  margin: 20px;
  //   margin: 20px;