platformFront/src/components/preTreat/AddSimpleQuestion.vue

<template>
    <div class="NoiseTemplateWrapper TemplateWrapper">
        <crumbs
                :title="txt"
                class="topBack"
                :param="param"
                linkTo="SimpleQuestion"
        ></crumbs>
        <PubIndeptQa
                @changeVal="changeVal"
                @validatePass="validatePass"
                qaType="1"
                :isCopy ='$route.params.isCopy'
                :editData="editData"
                ref="submitForm"
        ></PubIndeptQa>
        <div class="main">
            <p class="title" v-if="dataPub.region2==1||dataPub.region2==2|| dataPub.region2==3|| dataPub.region2==11|| dataPub.region2==8">
                填写单明细：<span v-if="dataPub.region2==2">(互斥项与其他明细内容互斥，互斥项同时只可选择一个)</span>
            </p>
            <PubSelect
                    v-if="dataPub.region2==1 || dataPub.region2==2 || dataPub.region2==3 || dataPub.region2==11|| dataPub.region2==8"
                    :ascription="dataPub.region1"
                    :sexType="dataPub.region7"
                    :type="dataPub.region2"
                    @pushValues="pushValues"
                    :options="editData.questionDetailList"></PubSelect>
            <div class="btn">
                <el-button
                        type="primary"
                        @click="submitForm"
                >确 定</el-button>
            </div>
        </div>
    </div>
</template>
<script>
  /**
   * dataPub.region2  判断底部显示哪些
   */
  import PubIndeptQa from './PubIndeptQa';
  import PubSelect from './PubSelect';
  import api from '@api/preTreat.js';
  import utils from '@api/utils.js';

  export default {
    name: 'addSimpleQuestion',
    data() {
      return {
        txt:'独立填写单维护-添加独立填写单',
        param:this.$route.params,
        imgList:[],
        dataPub: {},      //公用组件传的值都在这
        itemsTypes:[1,2,8],            //有明细的类型
        editData:{},                    //编辑数据
        options: [],           //标签明细右侧操作数据
      }
    },
    beforeMount:function(){
      const {isEdit,isCopy,data} = this.$route.params;
      if(isEdit||isCopy){
        this.txt = isCopy?'独立填写单维护-复制独立填写单':'独立填写单维护-修改独立填写单';
        this.editData = data;
      }
    },
    methods: {
      changeVal(val) {   //子组件数据改变传递到父组件
        this.dataPub = val;
      },
      changeSex() {       //性别改变，清空填写单明细
        this.changeType();
      },
      changeType() {      //填写单类型改变，标签明细左侧更新，右侧清空
        this.options = [];
      },
      pushValues(its){
        this.options = its;
      },
      submitForm() {      // 调用子组件的方法验证公用部分
        this.$refs.submitForm.submitForm('groups');
      },
      validatePass() {      //验证成功回调，调取接口
        //仍需验证填写单明细是否选择
        let isNull = false;
        let options2 = [];
        const opts = this.options;
        let pureName='',pureDesc = '';
        const reg = /(\$\{number_\S*?\})|(\$\{input_\S*?\})/g;
        for (let i = 0; i < opts.length; i++) {
          pureName=opts[i].name.replace(reg,'');
          pureDesc = opts[i].description.replace(reg,'');
          if(pureName.length>30){
            this.warning('医生界面展示内容不能超过30个字');
            return ;
          }
          if(pureDesc.length>30){
            this.warning('患者界面展示内容不能超过30个字');
            return ;
          }
          if(this.dataPub.region2=='3'&&(opts[i].name&&!reg.test(opts[i].name))){
            this.$message({
              message: '请添加数字输入框或者文本输入框',
              type: 'warning',
              showClose: true,
            });
            return;
          }
          if(opts[i].name.trim() != '') {
              options2.push(this.options[i]);
          }else if(opts[i].description.trim() != ''){           //患者填了，医生没填，提示医生必填
            isNull = true;
          }
        }
        if(this.itemsTypes.includes(+this.dataPub.region2)&&isNull) {
          this.warning('医生界面展示标准内容必填');
          return;
        }
        if(parseFloat(this.dataPub.region8) >= parseFloat(this.dataPub.region9)) {
          this.warning('最小年龄不能大于或等于最大年龄');
          return;
        }
        if(parseFloat(this.dataPub.minNormalVal) >= parseFloat(this.dataPub.maxNormalVal)) {
          this.warning('最小正常值不能大于或等于最大正常值');
          return;
        }
        this.options = options2;
        const {isEdit,data} = this.$route.params;
        let param = {
          "questionWrapper": {
            "controlType": this.dataPub.region2,                            //控件类型(0：默认值 1：下拉单选 2：下拉多选 6：文本框 7：数字键盘文本框 99：联合推送)
            "id": isEdit?data.id:'',                                    //新增id置空
            "type": this.dataPub.region1,                //填写单归属
            "tagType": 1,             //独立填写单类型
            "tagName": this.dataPub.region3,             //系统名称
            "name": this.dataPub.region4,                //医生界面名称
            "description":this.dataPub.region5,
            "sexType": this.dataPub.region7,             //1:男，2：女，3：通用
            "ageBegin": this.dataPub.region8,       		 //最小年龄
            "ageEnd": this.dataPub.region9,              //最大年龄
            "itemType" :this.dataPub.region12,           //是否为主要内容
            "url":this.dataPub.region13,                  //上传图片
            "specFlag": this.dataPub.specFlag,            //是否拼接到主诉
            "required": this.dataPub.required,             //必填
            "questionDetails": this.options,                //明细项
            //"questionMappings": [],      //映射关系,
          }
        };
        this.showSaveDialog(param);
      },
      showSaveDialog(param) {
        this.showConfirmDialog('是否保存该填写单？', () => {
          api.questionAdd(param).then((res) => {
            if (res.data.code === '0') {
              this.warning(res.data.msg || '保存成功', 'success');
              //返回带搜索条件的首页
              this.$router.push({name:"SimpleQuestion",params:Object.assign({},this.param,{currentPage:1})});
            } else {
              this.warning(res.data.msg)
            }
          }).catch((err) => {
            this.warning(err);
          })
        });
      },
      showConfirmDialog(msg, resolve) {
        this.$alert(msg, '提示', {
          confirmButtonText: '确定',
          type: 'warning'
        }).then(() => {
          resolve();
        }).catch(() => {});
      },
      warning(msg, type) {
        this.$message({
          showClose: true,
          message: msg,
          type: type || 'warning'
        })
      },
    },
    components: {
      PubIndeptQa,
      PubSelect
    }
  }
</script>
<style lang="less">
    @import "../../less/common.less";
    .NoiseTemplateWrapper {
    .groupTitle {
        background-color: #fff;
        height: 40px;
        line-height: 40px;
        padding-left: 20px;
    }
    .main {
        background-color: #fff;
        margin: 0 20px 20px;
        padding: 20px;
        border-top: 1px solid @icssBorder;
        box-sizing: border-box;
        font-size: 14px;
        color: #606266;
    .title {
        margin-bottom: 20px;
    i {
        color: #f56c6c;
    }
    }
    }
    .btn {
        text-align: right;
    }
    .order {
        margin-bottom: 20px;
    .el-input__inner {
        line-height: 30px;
        height: 30px;
    }
    }
    }
    .toast-cancel{
        color: #22ccc8 !important;
    // background: #22ccc8;
    }
</style>