测试完成

WXL

2024-08-05 ad0ecacbc73d16c9b95b79ac3c82868cbff33e44

 src/views/knowledge/education/compilequer/index.vue

@@ -2,12 +2,22 @@
  <div class="Questionnairemanagement">
    <!-- 左侧栏 -->
    <div class="sidecolumn">
      <div style="height: 200px">
        <el-steps direction="vertical" :active="Editprogress">
          <el-step title="基础信息设置"></el-step>
          <el-step title="宣教内容"></el-step>
        </el-steps>
      </div>
      <el-steps finish-status="success" :active="Editprogress" simple>
        <el-step>
          <template slot="title">
            <span style="cursor: pointer" @click="Editprogress = 1"
              >基础信息设置</span
            >
          </template>
        </el-step>
        <el-step>
          <template slot="title">
            <span style="cursor: pointer" @click="Editprogress = 2"
              >宣教内容</span
            >
          </template>
        </el-step>
      </el-steps>
    </div>
    <!-- 右侧数据 -->
    <div class="leftvlue">
@@ -28,24 +38,41 @@
              filterable
              placeholder="请选择分类"
            >
              <el-option
                class="ruleFormaa"
                v-for="item in sortlist"
                :key="item.id"
                :label="item.assortname"
                :value="item.id"
              <el-option-group
                v-for="group in sortlist"
                :key="group.id"
                :label="group.assortname"
              >
              </el-option>
                <el-option
                  v-for="item in group.heLibraryAssortList"
                  :key="item.id"
                  :label="item.assortname"
                  :value="item.id"
                >
                </el-option>
              </el-option-group>
            </el-select>
          </el-form-item>
          <el-row>
            <el-col :span="12"> </el-col>
            <el-col :span="12"> </el-col>
          </el-row>
          <el-form-item label="宣教标题" prop="preachname">
            <div style="width: 30%">
              <el-input v-model="ruleForm.preachname"></el-input>
              <el-input
                v-model="ruleForm.preachname"
                placeholder="请输入标题"
              ></el-input>
            </div>
          </el-form-item>
          <el-form-item label="宣教描述" prop="preachdescription">
            <div style="width: 30%">
              <el-input v-model="ruleForm.preachdescription"></el-input>
          <el-form-item label="宣教描述" prop="preachcontent">
            <div style="width: 60%">
              <el-input
                type="textarea"
                :rows="2"
                v-model="ruleForm.preachcontent"
                placeholder="请输入描述"
              ></el-input>
            </div>
          </el-form-item>
          <el-form-item label="通知变量" prop="name">
@@ -141,7 +168,10 @@
          <el-row :gutter="20">
            <el-col :span="6">
              <el-form-item label="版本号" prop="name">
                <el-input v-model="ruleForm.version"></el-input> </el-form-item
                <el-input
                  v-model="ruleForm.version"
                  placeholder="默认1.0.1"
                ></el-input> </el-form-item
            ></el-col>
            <el-col :span="9">
              <el-form-item label="可用状态" prop="region">
@@ -181,50 +211,15 @@
            </el-select>
          </el-form-item>
          <el-form-item label="适用疾病" prop="region">
            <div class="xinz-infs">
              <el-tag
                :key="item.icd10name"
                type="warning"
                v-for="item in illnesslist"
                closable
                :disable-transitions="false"
                @close="handleCloseillness(item)"
              >
                {{ item.icd10name }}
              </el-tag>
              <el-select
                v-model="inputValue"
                v-if="illnessVisible"
                @change="illnessConfirm"
                :remote-method="remoteMethod"
                filterable
                remote
                allow-create
                default-first-option
                placeholder="请选择/查询"
                :loading="loading"
              >
                <el-option
                  v-for="item in optionsillness"
                  :key="item.icdid"
                  :label="item.icdname"
                  :value="item.icdid"
                >
                </el-option>
              </el-select>
              <el-button
                v-else
                class="button-new-tag"
                size="small"
                @click="illnessshowInput"
                >+ 新增疾病</el-button
              >
            </div>
            <el-button type="warning" @click="$refs.child.handleAddpatient()"
              >添加疾病</el-button
            >
          </el-form-item>
          <el-form-item label="适用院区" prop="region">
            <el-select
              v-model="ruleForm.campus"
              size="medium"
              multiple
              filterable
              placeholder="请选择分类"
            >
@@ -256,7 +251,9 @@
            <el-button type="success" @click="nextstep('ruleForm')"
              >下一步</el-button
            >
            <el-button @click="resetForm('ruleForm')">重置</el-button>
            <el-button type="success" @click="Departmenttreatment('ruleForm')"
              >保存</el-button
            >
            <el-button type="info" @click="closeFm('ruleForm')">关闭</el-button>
          </el-form-item>
        </el-form>
@@ -265,34 +262,7 @@
      <div v-if="Editprogress == 2">
        <el-row :gutter="20">
          <el-col :span="4"><div class="leftvlue-jbxx">宣教内容</div></el-col>
          <el-col :span="12">
            <div>
              <el-button @click="laststep('ruleForm')">上一步</el-button>
              <el-button type="success" @click="Departmenttreatment('ruleForm')"
                >保存</el-button
              >
              <el-button type="warning" @click="Departmenttreatment('ruleForm')"
                >另存新版本</el-button
              >
              <el-button type="info" @click="closeFm('ruleForm')"
                >关闭</el-button
              >
            </div></el-col
          >
        </el-row>
        <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>
          <el-form
@@ -302,20 +272,55 @@
            label-width="100px"
            class="demo-ruleForm"
          >
            <el-form-item label="资料形式" prop="region">
              <el-select v-model="ruleForm.shape" placeholder="请选择内容形式">
                <el-option
                  v-for="item in xjxsoptions"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                >
                </el-option>
              </el-select>
            </el-form-item>
            <el-row gutter="20">
              <el-col :span="12">
                <el-form-item label="资料形式" prop="region">
                  <el-select
                    v-model="ruleForm.shape"
                    placeholder="请选择内容形式"
                  >
                    <el-option
                      v-for="item in xjxsoptions"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <div>
                  <el-button @click="laststep('ruleForm')">上一步</el-button>
                  <el-button
                    type="success"
                    @click="Departmenttreatment('ruleForm')"
                    >保存</el-button
                  >
                  <el-button
                    type="warning"
                    @click="Departmenttreatment('ruleForm')"
                    >另存新版本</el-button
                  >
                  <el-button type="info" @click="closeFm('ruleForm')"
                    >关闭</el-button
                  >
                </div></el-col
              >
            </el-row>
          </el-form>
        </div>
        <div>
          <el-upload
            class="upload-demo"
            :action="uploadImgUrlword"
            :on-success="uploadEditorSuccessword"
            :on-error="uploadEditorErrorword"
            :before-upload="beforeEditorUploadword"
            :headers="headers"
          >
            <el-button size="small" type="primary">word文件上传</el-button>
          </el-upload>
          <div id="quillEditorQiniu">
            <!-- 基于elementUi的上传组件 el-upload begin-->
            <el-upload
@@ -335,17 +340,30 @@
              v-model="content"
              ref="customQuillEditor"
              :options="editorOption"
              @blur="onEditorBlur"
              @focus="onEditorFocus"
              @change="onEditorChange"
            >
            </quill-editor>
          </div>
        </div>
      </div>
    </div>
    <!-- 添加适用疾病窗口 -->
    <Optional-Form
      ref="child"
      :dialogVisiblepatient="dialogVisiblepatient"
      :overallCase="illnesslist"
      @addoption="dialogVisiblepatient = false"
      @kkoption="dialogVisiblepatient = true"
    />
  </div>
</template>

<script>
import { quillEditor } from "vue-quill-editor";
import axios from "axios";

import {
  getheLibraryAssort,
  delheLibraryAssort,
@@ -353,12 +371,16 @@
  addtargetillness,
  getlibrarylist,
  dellibraryinfo,
  deltargetillness,
  compilelibrary,
  addrichText,
  getlibraryinfo,
  getillnesslist,
  illnesslistget,
  getillness,
} from "@/api/AiCentre/index";
import OptionalForm from "@/components/OptionalForm"; //正则组件

import { listDept } from "@/api/system/dept";
// import * as Quill from "quill";
import Quill from "quill";
@@ -392,12 +414,14 @@
];

export default {
  components: { OptionalForm },
  data() {
    return {
      headers: {
        Authorization: "Bearer " + getToken(),
      },
      uploadImgUrl: "/v1/admin/common/upload",
      uploadImgUrl: process.env.VUE_APP_BASE_API + "/common/upload",
      uploadImgUrlword: process.env.VUE_APP_BASE_API + "/common/uploadShow",
      uploadUrlPath: "没有文件上传",
      quillUpdateImg: false,
      fileList: [
@@ -411,9 +435,11 @@
        },
      ],
      content: "", //最终保存的内容
      fileName: "", //文件名
      dynamicTags: [],
      inputVisible: false,
      illnessVisible: false,
      dialogVisiblepatient: false, //适用疾病窗口
      inputValue: "",
      // 富文本
      editorOption: {
@@ -463,7 +489,14 @@
      radioas: "", //填空题答案
      // 总条数
      total: 1,
      ruleForm: {},
      hetype: "",
      id: null,
      ruleForm: {
        campus: [],
        heLibraryTagList: [],
        tempDetpRelevances: [],
        version: "1.0.1",
      },
      rules: {},
      rulesa: {},
      mode: [],
@@ -529,42 +562,49 @@
  watch: {
    content(newVal, oldVal) {
      //this.$emit('input', newVal);
      console.log(newVal);
      console.log(oldVal);
      console.log(newVal, "A");
      console.log(oldVal, "B");
    },
  },

  methods: {
    processElement(element) {
      return { ...element, isoperation: null };
    },
    // 获取页面数据
    getList() {
      this.loading = true;
      getlibraryinfo({ id: this.$route.query.id }).then((res) => {
        this.ruleForm = res.data;
        this.tempDetpRelevanceslist = JSON.parse(this.ruleForm.deptNames);
        this.ruleForm.suitway = this.ruleForm.suitway.split(",");
        this.variablelist = JSON.parse(this.ruleForm.otherdata)
          ? JSON.parse(this.ruleForm.otherdata)
          : this.variablelist;
      });
      getheLibraryAssort({}).then((res) => {
      this.id = this.$route.query.id;
      this.hetype = this.$route.query.hetype;
      if (this.id) {
        getlibraryinfo({ id: this.id }).then((res) => {
          this.ruleForm = res.data[0];
          this.ruleForm.campus = this.ruleForm.campus.split(",");
          this.dynamicTags = res.data[0].heLibraryTagList.map(
            this.processElement
          );
          this.Getmissioncontent(this.ruleForm.richText);
          if (this.ruleForm.deptNames) {
            this.tempDetpRelevanceslist = JSON.parse(this.ruleForm.deptNames);
          }
          if (this.ruleForm.suitway) {
            this.ruleForm.suitway = this.ruleForm.suitway.split(",");
          }
          this.variablelist = this.ruleForm.otherdata
            ? JSON.parse(this.ruleForm.otherdata)
            : this.variablelist;
        });
      }
      // 宣教分类
      getheLibraryAssort({ hetype: 2 }).then((res) => {
        this.sortlist = res.rows;
        console.log(res);
        console.log(this.sortlist);
      });
      // 部门
      listDept(this.queryParams).then((response) => {
        this.deptList = this.handleTree(response.data, "deptId");
      });
      this.loading = false;
    },
    /** 查询标签列表 */
    gettabList() {
      const tagqueryParams = {
        pageNum: 1,
        pageSize: 1000,
        tagcategoryid: "0",
      };
      listtag(tagqueryParams).then((response) => {
        console.log(response);
        this.optionstag = response.rows;
      });
    },

    submitForm(formName) {
@@ -572,22 +612,60 @@
      this.dynamicTags.forEach((item) => {
        tgs.push(item.tagname);
      });
      this.ruleForm.labelInfo = tgs.join(",");
      this.ruleForm.campus = this.ruleForm.campus.join(",");
      this.ruleForm.labelInfo = tgs.length != 0 ? tgs.join(", ") : "";
      this.ruleForm.otherdata = JSON.stringify(this.variablelist);
      this.ruleForm.suitway = this.ruleForm.suitway.join(",");
      if (this.id) {
        this.ruleForm.isoperation = 2;
        compilelibrary(this.ruleForm).then((response) => {
          this.$modal.msgSuccess("修改成功");
          this.$router.go(-1);
        });
      } else {
        this.ruleForm.isoperation = 1;
        compilelibrary(this.ruleForm).then((response) => {
          this.$modal.msgSuccess("新增成功");
          this.$router.go(-1);
        });
      }
      this.ruleForm.hetype = 2;
      console.log(22);
      this.ruleForm.suitway =
        this.ruleForm.suitway.length != 0
          ? this.ruleForm.suitway.join(",")
          : "";

      addrichText({
        content: this.content,
        fileName: this.fileName ? this.fileName : "测试.html",
      }).then((res) => {
        this.ruleForm.richText = res.msg;
        if (this.id) {
          this.ruleForm.isoperation = 2;
          compilelibrary(this.ruleForm).then((res) => {
            this.$modal.msgSuccess("编辑成功");
            this.confirmillness();
            this.$router.go(-1);
          });
        } else {
          this.ruleForm.isoperation = 1;
          compilelibrary(this.ruleForm).then((res) => {
            this.$modal.msgSuccess("新增成功");
            this.confirmillness(res.data);
            this.$router.go(-1);
          });
        }
      });
    },
    // 保存疾病
    confirmillness(guid) {
      this.illnesslist.forEach((item, index) => {
        if (guid) {
          item.outid = guid;
        } else {
          console.log(this.ruleForm);
          item.outid = this.ruleForm.id;
        }
        item.icd10name = item.icdname;
        item.icd10code = item.icdcode;
        item.type = 6;
        if (!item.id) {
          addtargetillness(item).then((res) => {});
        }
      });
      this.illnessVisible = false;
      this.$modal.msgSuccess("编辑成功");
    },
    getFileNameFromPath(path) {
      const parts = path.split("/");
      return parts[parts.length - 1];
    },
    // 下一步
    nextstep() {
@@ -619,11 +697,9 @@
    // 科室处理
    Departmenttreatment() {
      this.ruleForm.deptNames = JSON.stringify(this.tempDetpRelevanceslist);
      console.log(this.tempDetpRelevanceslist);
      const result = this.tempDetpRelevanceslist.map(
        (subArr) => subArr[subArr.length - 1]
      );
      console.log(result);
      // id数组查数组对象
      result.forEach((item) => {
        const condition = this.ruleForm.tempDetpRelevances.some(
@@ -631,13 +707,12 @@
        );
        if (!condition) {
          listDept({ deptId: item }).then((res) => {
            console.log(res.data[0]);
            console.log("dept");
            res.data[0].type = 2;
            this.ruleForm.tempDetpRelevances.push(res.data[0]);
          });
        }
      });
      console.log(this.ruleForm.tempDetpRelevances);
      // 数组对象查id数组
      this.ruleForm.tempDetpRelevances.forEach((item) => {
        const condition = result.some((obj) => obj === item.deptId);
@@ -646,7 +721,6 @@
          this.ruleForm.tempDetpRelevances[index].delFlag = 1;
        }
      });
      console.log(this.ruleForm.tempDetpRelevances);
      setTimeout(() => {
        this.submitForm();
      }, 1000);
@@ -684,14 +758,15 @@
        tagcategoryid: "0",
      };
      listtag(tagqueryParams).then((response) => {
        console.log(response);
        this.optionstag = response.rows;
      });
    },
    handleClosetag(tag) {
      console.log(tag);
      console.log(this.dynamicTags.indexOf(tag));
      const lindex = this.dynamicTags.indexOf(tag);
      const lindex = this.ruleForm.heLibraryTagList.findIndex(
        (item) => item.tagname == tag.tagname
      );
      console.log(lindex);
      this.dynamicTags.splice(this.dynamicTags.indexOf(tag), 1);
      this.ruleForm.heLibraryTagList[lindex].isoperation = 3;
    },
@@ -739,74 +814,16 @@
    },
    // 疾病-----------------------
    illnessUpdate() {
      this.illnesslistapi = [];
      const illnessqueryParams = {
        pageNum: 1,
        pageSize: 100,
      };
      getillnesslist(illnessqueryParams).then((response) => {
        console.log(response);
        this.optionsillness = response.rows;
      });
      getillness({ outid: this.$route.query.id, type: 6 }).then((res) => {
        this.illnesslist = res.rows;
        console.log(res);
      });
    },
    handleCloseillness(tag) {
      this.illnesslist.splice(this.illnesslist.indexOf(tag), 1);
      if (tag.id) {
        this.illnesslistapi.push(tag.id);
      }
    },
    remoteMethod(value) {
      console.log(value);
      const illnessqueryParams = {
        pageNum: 1,
        pageSize: 100,
        icdname: value,
      };
      this.loading = true;
      setTimeout(() => {
        this.loading = false;
        getillnesslist(illnessqueryParams).then((response) => {
          this.optionsillness = response.rows;
      if (this.id) {
        getillness({ outid: this.$route.query.id, type: 6 }).then((res) => {
          this.illnesslist = res.rows;
          this.illnesslist.forEach((item) => {
            item.icdname = item.icd10name;
          });
        });
      }, 200);
    },
    illnessConfirm(item) {
      let opeavalue = {};
      let tagname = this.inputValue;
      illnesslistget(item).then((res) => {
        opeavalue = res.data;
        opeavalue.outid = this.indexid;
        opeavalue.type = 6;
        opeavalue.icd10id = opeavalue.icdid;
        opeavalue.icd10name = opeavalue.icdname;
        opeavalue.icd10code = opeavalue.icdcode;
        if (tagname) {
          this.illnesslist.push(opeavalue);
        }
      });
      console.log(this.illnesslist);
      this.inputVisible = false;
      this.inputValue = "";
    },
    confirmillness() {
      this.illnesslist.forEach((item, index) => {
        if (!item.id) {
          addtargetillness(item).then((res) => {});
        }
      });
      if (this.illnesslistapi.length) {
        deltargetillness(this.illnesslistapi.join(",")).then((res) => {});
      }
      this.illnessVisible = false;
      this.$modal.msgSuccess("编辑成功");
    },
    illnessshowInput() {
      this.illnessVisible = true;
    },

    // --------------------------

    // 预览模版
@@ -833,7 +850,7 @@
      // this.$emit('upload',res, file)
      console.log(res, file);
      //拼接出上传的图片在服务器的完整地址
      let imgUrl = res.data.url;
      let imgUrl = res.url;
      let type = imgUrl.substring(imgUrl.lastIndexOf(".") + 1);
      console.log(type);
      // 获取富文本组件实例
@@ -852,10 +869,22 @@
      //取消上传动画
      this.quillUpdateImg = false;
    },
    // 失去焦点事件
    onEditorBlur(e) {
      console.log("onEditorBlur: ", e);
    },
    // 获得焦点事件
    onEditorFocus(e) {
      console.log("onEditorFocus: ", e);
    },
    // 内容改变事件
    onEditorChange(e) {
      console.log("onEditorChange: ", e);
    },
    // 上传(文件)图片失败
    uploadEditorError(res, file) {
      console.log(res);
      console.log(file);
      console.log(res, "word");
      console.log(file, "word");
      //页面提示
      this.$message.error("上传图片失败");
      //取消上传动画
@@ -865,23 +894,71 @@
    uploadResult: function (res) {
      this.uploadUrlPath = res;
    },
    // 上传(文件)图片失败
    uploadEditorErrorword(res, file) {
      console.log(res);
      console.log(file);
      //页面提示
      this.$message.error("上传图片失败");
      //取消上传动画
      this.quillUpdateImg = false;
    },
    //上传图片之前async
    beforeEditorUploadword(res, file) {
      //显示上传动画
      this.quillUpdateImg = true;
      //  const res1 = await uploadImage()
      // console.log(res1,'=====');
      // this.$emit('before',res, file)
      console.log(res);
      console.log(file);
    },
    // 上传图片成功
    uploadEditorSuccessword(res, file) {
      console.log("上传成功");
      const data = null;
      console.log(res, file, "word");
      axios
        .get(res.url)
        .then((response) => {
          console.log(response.data, "数据"); // 输出获取到的文件内容
          this.content = response.data;
          this.texturl = res.url;
          this.fileName = this.getFileNameFromPath(res.url);
        })
        .catch((error) => {
          console.error("Failed to fetch file:", error);
        });
    },
    Getmissioncontent(url) {
      axios
        .get(url)
        .then((response) => {
          console.log(response.data, "数据"); // 输出获取到的文件内容
          this.content = response.data;
          this.fileName = this.getFileNameFromPath(res.url);
        })
        .catch((error) => {
          console.error("Failed to fetch file:", error);
        });
    },
  },
};
</script>

<style lang="scss" scoped>
.Questionnairemanagement {
  display: flex;
  // display: flex;
}
.sidecolumn {
  width: 300px;
  min-height: 100vh;
  text-align: center;
  // width: 300px;
  // min-height: 100vh;
  // text-align: center;
  //   display: flex;
  //   margin-top: 20px;
  margin: 20px;
  margin-bottom: 0;
  padding: 30px;
  padding: 20px;
  background: #edf1f7;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
@@ -890,9 +967,7 @@
.leftvlue {
  //   display: flex;
  //   flex: 1;
  width: 80%;
  margin-top: 20px;
  //   margin: 20px;
  margin: 20px;
  padding: 30px;
  background: #ffff;
  border: 1px solid #dcdfe6;
@@ -1035,8 +1110,8 @@
}
.editor {
  line-height: normal !important;
  height: 400px;
  margin-bottom: 50px;
  height: 600px;
  margin-bottom: 80px;
}
.ql-snow .ql-tooltip[data-mode="link"]::before {
  content: "请输入链接地址:";