  <template>
  <div class="add-follow-container">
    <div class="add-header">
      <p @click.stop="btnClick(4)"><i class="el-icon-arrow-left"></i>返回</p>
      <h4>创建{{type == 1 ? '计划' : '临时'}}随访</h4>
    </div>
    <el-scrollbar tag="div" class="add-container">
      <div style="display:flex;justify-content:center;width:100%;padding-bottom:20px">
        <div style="padding:0;min-width:760px" :style="{width: show ? '100%' : 'calc(100% - 410px)'}">
          <!--患者信息-->
          <aegle-title class="margin-20" text="患者信息">
            <el-dropdown @command="viewFile">
              <span class="el-dropdown-link">
                <i class="iconfont iconfujian"></i>
                <span class="show-text">住院文件</span>
                <span class="brage-blue">1</span>
              </span>
              <el-dropdown-menu class="aegle-dropdown-menu" slot="dropdown">
                <el-dropdown-item command="病案首页">病案首页</el-dropdown-item>
                <!-- <el-dropdown-item command="出院记录">出院记录</el-dropdown-item> -->
              </el-dropdown-menu>
            </el-dropdown>
          </aegle-title>
          <div class="list-box flex">
            <div>
              <p class="second-title">分期</p>
              <p class="ellipsis">{{baseInfo.emrTumour}}</p>
            </div>
            <div>
              <p class="second-title">主要诊断</p>
              <p class="ellipsis"><ellipsis :num="18" :text="baseInfo.outpatientDiag"/></p>
            </div>
            <div>
              <p class="second-title">当前治疗状态</p>
              <p class="ellipsis"><span class="therapeutic" :class="setSelectColor(baseInfo.currentStatus)" v-if="baseInfo.currentStatus">{{baseInfo.currentStatus}}</span></p>
            </div>
            <div>
              <p class="second-title">联系电话<sup>*</sup></p>
              <p class="ellipsis">{{baseInfo.phone}}</p>
            </div>
            <div style="width:100%;margin-bottom:32px">
              <p class="second-title">治疗方案<sup>*</sup></p>
              <el-input rows="4" resize="none" v-model="protocols" maxlength="500" show-word-limit type="textarea" placeholder="请输入"/>
            </div>
          </div>
          <!--随访内容-->
          <aegle-title class="margin-20" text="随访内容"/>
          <div class="list-box flex">
            <div style="width:100%">
              <p class="second-title">随访标题<sup>*</sup></p>
              <el-input v-model="subject" size="small" maxlength="50" placeholder="请输入随访标题"></el-input>
            </div>
            <!--计划随访-->
            <template v-if="type == 1">
              <!--临时随访时间-->
              <div style="width:50%;padding-right:20px">
                <p class="second-title">随访开始结束时间<sup>*</sup></p>
                <el-date-picker
                  v-model="plan.timeRange"
                  style="width:100%"
                  size="small"
                  range-separator="→"
                  type="daterange"
                  value-format="yyyy-MM-dd"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期"
                  :picker-options="expireTimeOption"
                  placeholder="选择日期">
                </el-date-picker>
              </div>
              <!--是否重复-->
              <div style="width:50%;">
                <p class="second-title" style="wi">是否重复<sup>*</sup></p>
                <div  class="repeat-box">
                  <el-radio-group class="aegle-radio" v-model="plan.isRepeat" @change="changeRepeats">
                    <el-radio :label="1">是</el-radio>
                    <el-radio :label="2">否</el-radio>
                  </el-radio-group>
                  <div class="repeat-select" v-if="plan.isRepeat == 1">
                    <el-input size="small" @input="changeNum" style="flex:1" v-model.trim="plan.repeatNum" :min="0" placeholder="请输入数字"/>
                    <el-select size="small" v-model="plan.curRepeat" style="margin-left:8px;width:90px">
                      <el-option label="天" :value="1"></el-option>
                      <el-option label="月" :value="4"></el-option>
                      <el-option label="年" :value="6"></el-option>
                    </el-select>
                  </div>
                </div>
              </div>
              <!--提醒时间-->
              <div style="width:50%;padding-right:20px">
                <p class="second-title">提醒时间<sup>*</sup></p>
                <el-select
                  style="width:100%"
                  v-model="plan.noticeCode"
                  placeholder="请选择"
                  size="small"
                >
                  <el-option
                    v-for="item in timeOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  >
                  </el-option>
                </el-select>
              </div>
            </template>
            <!--临时随访-->
            <template  v-if="type == 2">
              <div style="width:200px;padding-right:20px">
                <p class="second-title">随访开始时间<sup>*</sup></p>
                <el-date-picker
                  v-model="temp.followDate"
                  style="width:100%"
                  :clearable="false"
                  size="small"
                  range-separator="→"
                  type="date"
                  value-format="yyyy-MM-dd"
                  :picker-options="expireTimeOption01"
                  placeholder="选择日期">
                </el-date-picker>
              </div>
              <div style="flex:1">
                <p class="second-title">随访形式<sup>*</sup></p>
                <div style="display:flex;align-items:center">
                  <el-radio-group @change="temp.contactContent = ''" class="aegle-radio" v-model="temp.contactType" style="height:32px">
                    <el-radio :label="1">电话</el-radio>
                    <el-radio :label="2">微信</el-radio>
                    <el-radio :label="3">其他</el-radio>
                  </el-radio-group>
                  <el-divider v-if="temp.contactType == 3" direction="vertical" style="margin:0 8px;background:rgba(0,0,0,.2)"></el-divider>
                  <el-input size="small" show-word-limit style="flex:1" maxlength="50" v-show="temp.contactType == 3" v-model="temp.contactContent" placeholder="请输入其他"/>
                </div>
              </div>
            </template>
          </div>
          <!-- 临时随访 -->
          <template v-if="type == 2">
            <!--不适症状-->
            <aegle-title :class="temp.discomfort == 1 ? 'margin-8' : 'margin-20'" isNeed text="不适症状" round :size="14">
              <el-radio-group @change="clearItem('discomfort',temp.discomfort)" class="aegle-radio" v-model="temp.discomfort">
                <el-radio :label="1">有</el-radio>
                <el-radio :label="2">无</el-radio>
              </el-radio-group>
            </aegle-title>
            <div class="list-box symptom" v-show="temp.discomfort==1">
              <div class="symptom-item">
                <aegle-drop-sel v-model="noComform.tired" label="疲倦"/>
                <aegle-drop-sel @change="clearItem('decreasedAppetite',noComform.decreasedAppetite)" v-model="noComform.decreasedAppetite" isSel label="食欲降低" key="食欲降低">
                  <p class="symptom-title" style="margin-top: 0"><span>进食量是否减少？<sup>*</sup></span><span></span></p>
                  <el-radio-group class="aegle-radio" v-model="decreasedAppetiteDTO.foodIntakeChange" style="margin-top:5px">
                    <el-radio :label="1">是</el-radio>
                    <el-radio :label="2">否</el-radio>
                  </el-radio-group>
                  <template v-if="decreasedAppetiteDTO.foodIntakeChange==1">
                    <p style="margin:12px 0 0;border-bottom:1px dashed #eee"></p>
                    <p class="symptom-title"><span>较前减少？<sup>*</sup></span><span></span></p>
                    <el-select :popper-append-to-body="false" placeholder="请选择" v-model="decreasedAppetiteDTO.foodIntakeChangeNum" size="mini">
                      <el-option v-for="i in intakeLevel" :label="i.label" :value="i.value" :key="'b_' + i.value"></el-option>
                    </el-select>
                  </template>
                  <p style="margin:10px 0 0;border-bottom:1px solid #eee"></p>
                  <p class="symptom-title"><span>近期1-3个月体重是否持续下降？<sup>*</sup></span><span></span></p>
                  <el-radio-group class="aegle-radio" v-model="decreasedAppetiteDTO.bodyWeightChange" style="margin-top:5px">
                    <el-radio :label="1">是</el-radio>
                    <el-radio :label="2">否</el-radio>
                  </el-radio-group>
                  <template v-if="decreasedAppetiteDTO.bodyWeightChange ==1">
                    <p style="margin:12px 0 0;border-bottom:1px dashed #eee"></p>
                    <p class="symptom-title"><span>体重下降<sup>*</sup></span><span></span></p>
                    <div class="num-box"><el-input size="mini" @input="e => getFloat(e,'bodyWeightChangeNum')" v-model="decreasedAppetiteDTO.bodyWeightChangeNum" placeholder=""></el-input> kg</div>
                  </template>
                </aegle-drop-sel>
                <aegle-drop-sel @change="clearItem('constipation',noComform.constipation)" v-model="noComform.constipation" isSel label="便秘">
                  <p class="symptom-title" style="margin-top: 0"><span>次数？<sup>*</sup></span><span></span></p>
                  <div class="num-box">
                    <el-input @input="e => constipationDTO.constipationNum = e.replace(/[^\d]/g,'').replace(/^0{2,}/g,'0')" maxlength="3" size="mini" v-model="constipationDTO.constipationNum" placeholder=""></el-input> 次 / 
                    <el-input @input="e => constipationDTO.constipationDay = e.replace(/[^\d]/g,'').replace(/^0{1,}/g,'')" maxlength="3" size="mini" v-model="constipationDTO.constipationDay" style="margin-left:5px" placeholder=""></el-input> 天</div>
                  <p style="margin:12px 0 0;border-bottom:1px solid #eee"></p>
                  <p class="symptom-title"><span>处置？<sup>*</sup></span><span></span></p>
                  <el-select @change="constipationDTO.constipationTakeMedicine = ''" :popper-append-to-body="false" placeholder="请选择" v-model="constipationDTO.method" size="mini">
                    <el-option v-for="i in constipationHandleArr" :label="i.label" :value="i.value" :key="'c_' + i.value"></el-option>
                  </el-select>
                  <template v-if="constipationDTO.method == '2'">
                    <p style="margin:12px 0 0;border-bottom:1px dashed #eee"></p>
                    <p class="symptom-title"><span>服用药物<sup>*</sup></span><span></span></p>
                    <el-input
                    v-model="constipationDTO.constipationTakeMedicine"
                    type="textarea" rows="4" placeholder=""
                    maxlength="100" show-word-limit></el-input>
                  </template>
                </aegle-drop-sel>
                <aegle-drop-sel v-model="noComform.numbness" label="手足麻木"/>
                <aegle-drop-sel @change="clearItem('discomfortOther',noComform.discomfortOther)" v-model="noComform.discomfortOther" label="其他" isSel>
                  <el-input type="textarea" v-model="discomfortOtherDTO.discomfortOtherContent" rows="4" maxlength="500" show-word-limit resize="none" placeholder=""></el-input>
                </aegle-drop-sel>
              </div>
              <div class="symptom-item">
                <aegle-drop-sel @change="clearItem('mouthUlcer',noComform.mouthUlcer)" v-model="noComform.mouthUlcer" isSel label="口腔溃疡" key="口腔溃疡">
                  <p class="symptom-title" style="margin-top: 0"><span>等级0-4<sup>*</sup></span><span></span></p>
                  <el-select :popper-append-to-body="false" placeholder="请选择" v-model="mouthUlcerDTO.mouthUlcerLevel" size="mini">
                    <el-option v-for="i in mouthUlcerArr" :label="i.label" :value="i.value" :key="'a_' + i.value"></el-option>
                  </el-select>
                </aegle-drop-sel>
                <aegle-drop-sel v-model="noComform.nausea" label="恶心"/>
                <aegle-drop-sel @change="clearItem('diarrhea',noComform.diarrhea)" v-model="noComform.diarrhea" isSel label="腹泻">
                  <p class="symptom-title" style="margin-top: 0"><span>次数？<sup>*</sup></span><span></span></p>
                  <div class="num-box">
                    <el-input size="mini" @input="e => diarrheaDTO.diarrheaNum = e.replace(/[^\d]/g,'').replace(/^0{2,}/g,'0')" maxlength="3" v-model="diarrheaDTO.diarrheaNum" placeholder=""></el-input> 次 / 
                    <el-input size="mini" @input="e => diarrheaDTO.diarrheaDay = e.replace(/[^\d]/g,'').replace(/^0{1,}/g,'')" maxlength="3" v-model="diarrheaDTO.diarrheaDay" style="margin-left:5px" placeholder=""></el-input> 天</div>
                  <p style="margin:12px 0 0;border-bottom:1px solid #eee"></p>
                  <div class="flex">
                    <div style="margin-right:12px;flex:1">
                      <p class="symptom-title"><span>形状？<sup>*</sup></span><span></span></p>
                      <el-select style="width:100%" :popper-append-to-body="false" v-model="diarrheaDTO.shape" size="mini" placeholder="请选择">
                        <el-option v-for="i in shapeArr" :label="i.label" :value="i.value" :key="'d_' + i.value"></el-option>
                      </el-select>
                    </div>
                    <div style="flex:1">
                      <p class="symptom-title"><span>处置？<sup>*</sup></span><span></span></p>
                      <el-select @change="diarrheaDTO.diarrheaTakeMedicine = ''" style="width:100%" :popper-append-to-body="false" placeholder="请选择" v-model="diarrheaDTO.processing" size="mini">
                        <el-option v-for="i in diarrheaDict" :label="i.label" :value="i.value" :key="'e_' + i.value"></el-option>
                      </el-select>
                    </div>
                  </div>
                  <template v-if="diarrheaDTO.processing == '2'">
                    <p style="margin:12px 0 0;border-bottom:1px dashed #eee"></p>
                    <p class="symptom-title"><span>服用药物<sup>*</sup></span><span></span></p>
                    <el-input type="textarea" rows="4"
                    resize="none"
                    v-model="diarrheaDTO.diarrheaTakeMedicine"
                    placeholder="" maxlength="100"
                    show-word-limit></el-input>
                  </template>
                </aegle-drop-sel>
                <aegle-drop-sel @change="clearItem('rash',noComform.discomfortOther)" v-model="noComform.rash" isSel label="皮疹">
                  <el-input v-model="rashDTO.rashContent" type="textarea" rows="4" maxlength="500" show-word-limit resize="none" placeholder=""></el-input>
                </aegle-drop-sel>
              </div>
              <div class="symptom-item">
                <aegle-drop-sel v-model="noComform.weak" label="乏力"/>
                <aegle-drop-sel v-model="noComform.vomit" label="呕吐"/>
                <aegle-drop-sel v-model="noComform.hemorrhage" label="出血"/>
                <aegle-drop-sel @change="clearItem('pain',noComform.pain)" class="pain-drop-select" v-model="noComform.pain" isSel label="疼痛">
                  <!-- <i class="pain-icon el-icon-plus" v-show="painDTO.length < 5" @click.stop="addPainItem"></i> -->
                  <i class="pain-icon iconfont iconadd" v-show="painDTO.length < 5" @click="addPainItem"></i>
                  <el-tabs @tab-remove="tabsRemove" class="pain-tabs" v-model="painPanel">
                    <el-tab-pane v-for="(s,z) in painDTO" :label="numType[z]" :name="String(z)" :key="z" :closable="!!z">
                      <pain @change="changePainData(z,$event)" :item="s"/>
                    </el-tab-pane>
                  </el-tabs>
                </aegle-drop-sel>
              </div>
            </div>
            <!--服药情况-->
            <aegle-title class="margin-8" text="服药情况" round :size="14"/>
            <div class="list-box" style="margin-bottom:20px">
              <el-input v-model="temp.takeMedicineSituation" rows="4" resize="none" maxlength="500" show-word-limit type="textarea" placeholder="请输入"/>
            </div>
            <!--不良生活习惯 -->
            <aegle-title class="margin-8" text="不良生活习惯" round :size="14"/>
            <div class="list-box" style="margin-bottom:20px">
              <el-input v-model="temp.badLivingHabits" rows="4" resize="none" maxlength="500" show-word-limit type="textarea" placeholder="请输入"/>
            </div>
            <!--患者状态 -->
            <aegle-title :class="temp.status == 5 ? 'margin-8' : 'margin-20'" isNeed text="患者状态" round :size="14">
              <el-radio-group @change="temp.otherStatusContent = ''" class="aegle-radio" v-model="temp.status">
                <el-radio :label="1">正常</el-radio>
                <el-radio :label="2">失访</el-radio>
                <el-radio :label="3">死亡</el-radio>
                <el-radio :label="5">其他</el-radio>
              </el-radio-group>
            </aegle-title>
            <div class="list-box" style="margin-bottom:20px" v-if="temp.status == 5">
              <el-input v-model="temp.otherStatusContent" maxlength="100" :rows="4" resize="none" show-word-limit placeholder="请输入"></el-input>
            </div>
            <!--其他补充 -->
            <aegle-title class="margin-8" text="其他补充" round :size="14"/>
            <div class="list-box" style="margin-bottom:20px">
              <el-input v-model="temp.otherSupplements" rows="4" resize="none" maxlength="500" show-word-limit type="textarea" placeholder="请输入"/>
            </div>
            <!--常规提醒 -->
            <aegle-title class="margin-8" isNeed text="常规提醒" round :size="14">
              <el-radio-group @change="clearItem('reminder',temp.reminder)" class="aegle-radio" v-model="temp.reminder">
                <el-radio :label="1">有</el-radio>
                <el-radio :label="2">无</el-radio>
              </el-radio-group>
            </aegle-title>
            <cancerDialog @set="setCancer" :a="diseases" :b="diseaseTimes" :arr="diseaseArrCopy" :canEdit="true" :reminder="temp.reminder" v-show="temp.reminder == 1"/>
          </template>
        </div>
      </div>
    </el-scrollbar>
    <div class="add-footer">
      <p class="btn-cancle" @click.stop="btnClick(2)">取消</p>
      <p class="btn-temporary" v-if="type == 2" @click.stop="btnClick(3)">暂存</p>
      <p class="btn-save" @click.stop="btnClick(1)">完成</p>
    </div>
  </div>
</template>
<script>
import {DonMessage} from '@/axios/message.js'
const $message = new DonMessage()
import aegleTitle from '../AegleTitle/main.vue'
import aegleDropSel from '../AegleDropSel/main.vue'
import pain from '../AeglePain/main.vue'
import moment from 'moment'
import { expireTimeOption01,
expireTimeOption,
shapeArr,constipationHandleArr,
diarrheaDict,intakeLevel,
mouthUlcerArr,
timeOptions,numType } from 'aegle-sp-components/src/data/validate.js'
import { debounce, cloneDeep } from 'lodash'
import {
  followUpAdd,
  addTempFollow,
} from "@/request/cm.js";
import mixin from '../AegleFollow/mixin'
import ellipsis from '../AegleEllipsis/main.vue'
import cancerDialog from '../AegleCancerDialog/main.vue'
export default {
    name: 'AegleAddFollow',
  components: { aegleTitle, aegleDropSel, pain,ellipsis,cancerDialog },
  props: {
    show: Boolean,
    id: [String,Number],
    type: {
      type: String | Number,
      default: 2
    },
    follow: Boolean,
    patientBase: Object,
    // route: String
  },
  mixins: [mixin],
  data() {
    return {
      shapeArr,
      constipationHandleArr,
      diarrheaDict,
      intakeLevel,
      mouthUlcerArr,
      tempDialog: false,
      baseInfo: {
        emrTumour: '',//分期
        outpatientDiag: '', //诊断
        phone: '',
        currentStatus: '',
      },
      followId: '',//创建时的随访id
      numType,
      diseaseArr:[],
      painPanel: '0',//疼痛的activepanel
      radio: '',
      timeOptions,
      followType: '临时',
      subject: '',// 随访标题
      protocols: '',//治疗方案
      content: '',// 随访内容
      disease: '',//病种
      diseases: '',//病种修改
      diseaseOther: '',//病种其它
      diseaseTime: '',//病种周期默认,
      diseaseTimes: '',//病种周期修改
      cancerObj: {
        diseases: '',
        diseaseTimes: ''
      },
      patientPhone: '',//电话
      plan: {//计划随访独有
        timeRange: '',//计划随访时间
        isRepeat: '',//是否重复
        repeatNum: '',//重复周期
        curRepeat: 1,
        noticeCode: ''
      },
      temp: {//临时随访独有
        followDate: moment().format('yyyy-MM-DD'),
        contactType: '',
        contactContent: '',
        discomfort: '',//不适症状
        takeMedicineSituation: '',//服药情况
        badLivingHabits: '',//不良生活习惯
        status: '',//患者状态
        otherStatusContent: '',
        patientPhone: '',
        otherSupplements: '',//其他补充
        reminder: '',//常规提醒
      },
      discomfort: {
        tired: '',//疲倦
        weak: '',//乏力
        nausea: '',//恶心
        vomit: '',//呕吐
        hemorrhage: '',//出血
        numbness: '',//手足麻木
        pain: '',//是否疼痛
        other: ''
      },
      discomfortCheck: '',
      mouthUlcerDTO: {//口腔溃疡
        mouthUlcer: '',
        mouthUlcerLevel: '',
      },
      decreasedAppetiteDTO: {//食欲降低
        decreasedAppetite: '',
        foodIntakeChange: '',//进食量减少
        foodIntakeChangeNum: '',//减少量
        bodyWeightChange: '',//体重是否下降
        bodyWeightChangeNum: ''//体重下降量
      },
      constipationDTO: {//便秘
        constipation: '',
        constipationDay: '',//tian
        constipationNum: '',//次数
        method: '',//处置
        constipationTakeMedicine: '',//用药
      },
      diarrheaDTO: {//腹泻
        diarrhea: '',
        diarrheaDay: '',//tian
        diarrheaNum: '',//次数
        shape: '',//形状
        processing: '',//处置
        diarrheaTakeMedicine: ''//服用药物
      },
      rashDTO: {//皮疹
        rash: '',
        rashContent: ''
      },
      discomfortOtherDTO: {
        discomfortOther: '',
        discomfortOtherContent: ''
      },
      painDTO: [{
        painLocation: '', //疼痛位置
        painNature: '', //疼痛性质
        score: 0,       //评分
        sleep: '',      //是否影响睡眠 0：否  1：是
        anodyne: '',        //止痛药 0：否  1：是
        drugDose:''    //药物剂量
      }],
      noComform:{
        tired: '',
        weak: '',
        mouthUlcer: '',
        decreasedAppetite: '',
        nausea: '',
        vomit: '',
        constipation: '',
        diarrhea: '',
        rash: '',
        hemorrhage: '',
        numbness: '',
        pain: '',
        discomfortOther: '',
      },
      expireTimeOption,
      expireTimeOption01,
      loading: false,
      cancerArr: [],
      diseaseArrCopy: [],
    }
  },
  watch: {
    follow(v){
      if(v) {}
    }
  },
  mounted() {
    this.queryPatientInfo(this.id,1)
  },
  methods: {
    //住院文件查看
    viewFile(e) {
      this.$emit('handle', 4,8)
      if(e == '病案首页' && !this.patientBase?.seeDoctorId){
        this.$message.warning('暂无病案首页数据')
        return
      }
      this.$emit('handle', 1,{e,patientId: this.id, tab: 'A004'})
    },
    //编辑按钮防抖
    btnClick: debounce(function(type){
      if(this.disabled) return;
      if(type == 1 && this.type == 1){//随访保存
        this.sendPlanFollow(true)
      } else if(type == 1 && this.type == 2) {
        if(this.temp.status == 3){
          this.diedSure(()=>{
            this.sendTempFollow(2,true)
          })//死亡确认
        } else {
          this.sendTempFollow(2,true)
        }
      } else if(type == 2){//取消
        //2是暂存，3是保存
        this.closeAdd(false)
      } else if(type == 4){//取消
        //2是暂存，3是保存
        this.closeAdd(true)
      } else if(type == 3){//暂存
        this.sendTempFollow(1)
      }
    },2000,{
      leading: true,
      trailing: false
    }),
    //数据清空操作
    clearFollow() {
      this.protocols = '';
      this.subject = '';
      if(this.type == 1){//计划
        this.plan = {//计划随访独有
          timeRange: '',//计划随访时间
          isRepeat: '',//是否重复
          repeatNum: '',//重复周期
          curRepeat: 1,
          noticeCode: ''
        }
      } else {
        for(let k in this.noComform){
          this.noComform[k] = ''
        }
        for(let k in this.temp){
          this.temp[k] = ''
        }
        for(let k in this.discomfort){
          this.discomfort[k] = ''
        }
        for(let k in this.decreasedAppetiteDTO){
          this.decreasedAppetiteDTO[k] = ''
        }
        for(let k in this.constipationDTO){
          this.constipationDTO[k] = ''
        }
        for(let k in this.diarrheaDTO){
          this.diarrheaDTO[k] = ''
        }
        for(let k in this.rashDTO){
          this.rashDTO[k] = ''
        }
        for(let k in this.constipationDTO){
          this.constipationDTO[k] = ''
        }
        this.painDTO = [{
          painLocation: '', //疼痛位置
          painNature: '', //疼痛性质
          score: 0,       //评分
          sleep: '',      //是否影响睡眠 0：否  1：是
          anodyne: '',        //止痛药 0：否  1：是
          drugDose:''    //药物剂量
        }]
      }
    },
    //send计划随访
    async sendPlanFollow(status){
      if(status){
        if(!this.protocols || !this.protocols.trim()){
          $message.error('治疗方案不能为空！')
          return
        } else if(!this.subject || !this.subject.trim()) {
          $message.error('随访标题不能为空')
          return
        }if(!this.plan.timeRange || !this.plan.timeRange.length) {
          $message.error('随访开始结束时间不能为空')
          return
        }else if(this.plan.isRepeat === '') {
          $message.error('请选择是否重复')
          return
        } else if(this.plan.isRepeat == 1 && !Number(this.plan.repeatNum)) {
          $message.error('请输入重复周期')
          return
        } else if(this.plan.noticeCode === '') {
          $message.error('提醒时间不能为空')
          return
        }
      }
      const param = {
        protocols: this.protocols.trim(),
        subject: this.subject,
        patientPhone: this.patientPhone,
        followType: 1,//随访类型（1计划随访 2临时随访）
        startDate: this.plan.timeRange && this.plan.timeRange[0] ? this.plan.timeRange[0] : '',
        endDate: this.plan.timeRange ? this.plan.timeRange[1] : '',
        repetition: this.plan.isRepeat == 1 ? this.plan.curRepeat : 0, // 重复类型 用字典数据
        span: this.plan.repeatNum,
        noticeCode: this.plan.noticeCode,
        patientBaseId: this.id
      }
      const { data, code, msg } = await followUpAdd(param)
      if(code == 0){
        if(status){
          $message.success('创建成功')
          this.$emit('close', true)
        }
        this.$emit('close', true)
      } else {
        $message.error(msg)
      }
    },
    //send临时随访
    async sendTempFollow(type) {
      if(type ==2){
        const status = this.validateTemp()
        if(!status) return;
      }
      const param = this.getTempParam(type)
      this.loading = true;
      const { data, code, msg} = await addTempFollow(param)
      this.loading = false
      if(code == 0){
        this.followId = data
        if(type ==2){
          if(param.status == 3) await this.getPatientInfo(this.id, d =>{
            this.$emit('handle', 3,d)
            console.log('c')
          });
          $message.success('保存成功！该状态同步到日程')
        } else if(type == 1) {
          $message.success('暂存成功')
        }
        this.$emit('close', true)
      } else {
        $message.error(msg)
      }
    },
    //获取临时随访参数
    getTempParam(type) {
      let diseaseArr = []
      for(let k of this.diseaseArrCopy){
        if(k.label && k.label.trim()){
          diseaseArr.push({
            label: k.label,
            first: k.first
          })
        }
      }
      let param = {
        protocols: this.protocols.trim(),
        subject: this.subject.trim(),
        // patientPhone: this.patientPhone,
        followType: 2,//随访类型（1计划随访 2临时随访）
        followDate: this.temp.followDate,
        contactType: this.temp.contactType,//随访形式
        contactContent: this.temp.contactType == 3 ? this.temp.contactContent.trim() : '',
        status: this.temp.status,//患者状态
        otherStatusContent: this.temp.status == 5 ? this.temp.otherStatusContent.trim() : '',
        discomfort: this.temp.discomfort,//不适
        takeMedicineSituation: this.temp.takeMedicineSituation ? this.temp.takeMedicineSituation.trim() : '',//服药情况
        badLivingHabits: this.temp.badLivingHabits ? this.temp.badLivingHabits.trim() : '',
        otherSupplements: this.temp.otherSupplements ? this.temp.otherSupplements.trim(): '',
        reminder: this.temp.reminder,//是否常规提醒
        followCancer: this.diseases ? this.diseases.trim() : '',//癌肿
        cancerTime: this.diseaseTimes ? this.diseaseTimes.trim() : '',//时间
        cancerProject: this.temp.reminder == 1 ? JSON.stringify(diseaseArr) : '',
        temporaryStorage: type,//是否暂存 1为暂存
        patientBaseId: this.id,
        discomfortDTO: {
          pain: this.noComform.pain
        }
      }
      if(param.discomfort == 1){
        let discomfort = {
          tired: this.noComform.tired,
          weak: this.noComform.weak,
          nausea: this.noComform.nausea,
          vomit: this.noComform.vomit,
          hemorrhage: this.noComform.hemorrhage,
          numbness: this.noComform.numbness,
        }
        if(this.noComform.mouthUlcer){
          discomfort.mouthUlcerDTO = {
            ...this.mouthUlcerDTO,
            mouthUlcer: this.noComform.mouthUlcer
          }
        }
        if(this.noComform.decreasedAppetite){
          discomfort.decreasedAppetiteDTO = {
            ...this.decreasedAppetiteDTO,
            decreasedAppetite: this.noComform.decreasedAppetite,
            bodyWeightChangeNum: this.decreasedAppetiteDTO.bodyWeightChangeNum ? Number(this.decreasedAppetiteDTO.bodyWeightChangeNum) : ''
          }
        }
        if(this.noComform.constipation){
          discomfort.constipationDTO = {
            ...this.constipationDTO,
            constipation: this.noComform.constipation
          }
        }
        if(this.noComform.diarrhea){
          discomfort.diarrheaDTO = {
            ...this.diarrheaDTO,
            diarrhea: this.noComform.diarrhea
          }
        }
        if(this.noComform.rash){
          discomfort.rashDTO = {
            ...this.rashDTO,
            rash: this.noComform.rash
          }
        }
        if(this.noComform.discomfortOther){
          discomfort.discomfortOtherDTO = {
            ...this.discomfortOtherDTO,
            discomfortOther: this.noComform.discomfortOther
          }
        }
        if(this.noComform.pain){
          discomfort.pain = this.noComform.pain;
          discomfort.painDTO = cloneDeep(this.painDTO)
        }
        param.discomfortDTO = discomfort//不适下面的
      }
      // if(this.followId){
      //   param.businessId = this.followId
      // }
      return param
    },
    //临时随访非空验证
    validateTemp(){
      if(!this.protocols || !this.protocols.trim()){
        $message.error('治疗方案不能为空')
        return false
      }
      if(!this.subject || !this.subject.trim()) {
        $message.error('随访标题不能为空')
        return false
      }
      if(!this.temp.followDate) {
        $message.error('随访开始时间不能为空')
        return false
      }
      if(!this.temp.contactType) {
        $message.error('随访形式不能为空')
        return false
      }
      if(this.temp.contactType == 3 && !this.temp.contactContent) {
        $message.error('随访形式其他备注不能为空')
        return false
      }
      if(!this.temp.discomfort) {
        $message.error('不适症状不能为空')
        return false
      }
      if(this.temp.discomfort == 1) {
        if(!this.noComform.discomfortOther && !this.painText.length) {
          $message.error('请选择不适症状')
          return false
        }
        const p = {
          ...this.mouthUlcerDTO,
          ...this.decreasedAppetiteDTO,
          ...this.constipationDTO,
          ...this.diarrheaDTO,
          ...this.rashDTO,
          ...this.discomfortOtherDTO
        }
        if(this.noComform.mouthUlcer && !p.mouthUlcerLevel) {
          $message.error('口腔溃疡等级不能为空')
          return false
        }
        if(this.noComform.decreasedAppetite && !p.foodIntakeChange) {
          $message.error('进食量是否减少不能为空')
          return false
        }
        if(this.noComform.decreasedAppetite && p.foodIntakeChange == 1 && !p.foodIntakeChangeNum) {
          $message.error('进食量较前减少量不能为空')
          return false
        }
        if(this.noComform.decreasedAppetite && !p.bodyWeightChange) {
          $message.error('体重是否持续下降不能为空')
          return false
        }
        if(this.noComform.decreasedAppetite && p.bodyWeightChange == 1 && !p.bodyWeightChangeNum) {
          $message.error('体重下降量不能为空')
          return false
        }
        if(this.noComform.constipation && (!p.constipationNum || !p.constipationDay)) {
          $message.error('便秘次数不能为空')
          return false
        }
        if(this.noComform.constipation && !p.method) {
          $message.error('便秘处置不能为空')
          return false
        }
        if(this.noComform.constipation && p.method == 2 && (!p.constipationTakeMedicine || !p.constipationTakeMedicine.trim())) {
          $message.error('便秘服用药物不能为空！')
          return false
        }
        if(this.noComform.diarrhea && (!p.diarrheaNum || !p.diarrheaDay)) {
          $message.error('腹泻次数不能为空')
          return false
        }
        if(this.noComform.diarrhea && !p.shape) {
          $message.error('大便形状不能为空')
          return false
        }
        if(this.noComform.diarrhea && !p.processing) {
          $message.error('腹泻处置不能为空')
          return false
        }
        if(this.noComform.diarrhea && p.processing == '2' && (!p.diarrheaTakeMedicine || !p.diarrheaTakeMedicine.trim())) {
          $message.error('腹泻服用药物不能为空')
          return false
        }
        if(this.noComform.rash && (!p.rashContent||!p.rashContent.trim())) {
          $message.error('皮疹其他备注不能为空')
          return false
        }
        if(this.noComform.pain) {
          for(let i=0; i < this.painDTO.length; i++){
            const k = this.painDTO[i]
            if(!k.painLocation || !k.painLocation.trim()){
              $message.error(`疼痛部位${numType[i]}不能为空！`)
              return false
            }
            if(!k.painNature){
              $message.error(`${k.painLocation}疼痛性质不能为空！`)
              return false
            }
            if(k.score == 0){
              $message.error(`${k.painLocation}疼痛评分不能为空！`)
              return false
            }
            if(k.sleep === ''){
              $message.error(`${k.painLocation}疼痛是否影响睡眠不能为空！`)
              return false
            }
            if(k.anodyne === ''){
              $message.error(`${k.painLocation}疼痛是否吃止疼药不能为空！`)
              return false
            }
            if(k.anodyne && (!k.drugDose || !k.drugDose.trim())){
              $message.error(`${k.painLocation}疼痛药物剂量不能为空！`)
              return false
            }
          }
          
        }
        if(this.noComform.discomfortOther && (!p.discomfortOtherContent||!p.discomfortOtherContent.trim())) {
          $message.error('其它不能为空！')
          return false
        }
        //不适具体某一项
      }
      if(this.temp.status == ''){
        $message.error('患者状态不能为空！')
        return false
      }
      if(this.temp.status == 5 && (!this.temp.otherStatusContent || !this.temp.otherStatusContent.trim())){
        $message.error('患者状态其他备注不能为空！')
        return false
      }
      if(!this.temp.reminder){
        $message.error('常规提醒不能为空！')
        return false
      }
      if(this.temp.reminder == 1){
        if(!this.diseases){
          $message.error('病种不能为空！')
          return false
        }
        if(!this.diseaseTimes) {
          $message.error('病种时间不能为空！')
          return false
        }
        if(!this.diseaseArrCopy.length){
          $message.error('至少要有一条检查项目')
          return false
        }
        for(let k of this.diseaseArrCopy){
          if(!k.label || !k.label.trim()){
            $message.error('该检查项目不能为空')
            return false
          }
        }
      }
      return true
    },
    changePainData(index,e){
      this.painDTO[index] = {
        ...e
      }
      // if(this.type == 2) this.sendTempFollow(1,false);
    },
    //关闭添加
    closeAdd(type) {
      this.cancelFollow(() => {
        this.clearFollow()
        this.$emit('close', false)
      },type)
    },
    //计划随访的随访周期
    changeRepeats(e){
      if(e == 2) {
        this.plan.curRepeat = 1;
        this.plan.repeatNum = '';
      }
    },
    changeNum(val) { 
      // this.plan.repeatNum = val.replace(/[^\d]/g,'')
      this.plan.repeatNum = val.replace(/[^0-9]/g,'')
      if(this.plan.repeatNum === "0") {
        $message.error('请输入有效数字');
        this.plan.repeatNum = ''
      }
    }
  }
}
</script>
<style lang="less">
.el-message-box.self-com-dialog.died-dialog {
  width: 400px;
  height: 200px;
  .el-message-box__content {
    height: calc(100% - 109px);
  }
  .el-message-box__btns {
    .el-button {
      height: 28px;
      border-radius: 2px!important;
      padding-top: 0;
      padding-bottom: 0;
      line-height: 26px;
      font-size: 14px;
      font-family: PingFangSC, PingFangSC-Regular;
      &.el-button--default {
        border-color: rgba(0,0,0,0.15);
        color: rgba(0,0,0,0.70);
      }
      &.el-button--primary {
        border-color: #1890FF;
        background-color: #1890FF;
        color: #fff;
      }
    }
  }
  
}
.add-follow-container .add-container {
  >.el-scrollbar__wrap {
    overflow-x: hidden;
  }
  .el-input,
  .el-select,
  .el-textarea {
    width: 100%;
  }
  .el-input__inner,
  .el-textarea__inner {
    
    border-radius: 2px;
    border-color: rgba(0,0,0,0.15);
    font-size: 14px;
    font-family: PingFangSC, PingFangSC-Regular;
  }
  .el-date-editor .el-range-separator {
    color: rgba(0,0,0,0.25);
  }
}
.pain-tabs {
  >.el-tabs__header {
    height: 34px;
    line-height: 34px;
    border-color: #eee;
    margin-bottom: 0;
    .el-tabs__item {
      height: 34px;
      line-height: 34px;
      font-size: 12px;
      font-family: PingFangSC, PingFangSC-Regular;
      font-weight: 400;
      text-align: left;
      color: rgba(0,0,0,0.40);
      padding:0 8px!important;
      &.is-active {
        color: rgba(0,0,0,0.80);
        &:after {
          left: 37%;
        }
      }   
      &:nth-child(2) {
        padding: 0 16px 0 0!important;
        &.is-active {
          &:after {
            left: 35%;
          }
        }
      }
    }
    
    .el-tabs__nav-wrap::after {
      display: none;
    }
    .is-active:after {
      top: 31px;
      width: 12px;
    }
  }

  .el-tabs__active-bar {
    opacity: 0;
  }
}
.pain-drop-select {
  .aegle-drop-wrapper {
    padding-top: 0!important;
  }
}
.dtl-dialog-footer {
  display: flex;
  justify-content: flex-end;
  width: 100%;
  .el-button {
    width: 53px;
    height: 28px;
    padding: 0;
    line-height: 26px;
    text-align: center;
    font-size: 14px;
    border-radius: 2px;
    font-family: PingFangSC, PingFangSC-Regular;
  }
  .el-button--primary {
    background-color: #1890ff;
    border-color: #1890ff;
    margin-left: 12px;
  }
  .el-button--default.el-button--small {
    border: 1px solid rgba(0,0,0,0.15);
  }
}
.temp-ellipsis {
  z-index: 9999999!important;
}
</style>
<style lang="less" scoped>
.flex {
  display: flex;
  align-items: center;
}
.add-follow-container {
  width: 100%;
  padding: 20px 20px 0;
  font-size: 14px;
  font-family: PingFangSC, PingFangSC-Regular;
  background-color: #fff;
  .pain-icon {
    position:absolute;
    right:12px;
    top: 7px;
    cursor: pointer;
    font-size: 22px;
    color: #B0B8CF;
    z-index: 2;
  }
  .add-header {
    display: flex;
    align-items: center;
    padding-bottom: 20px;
    p {
      margin: 0;
      display: flex;
      align-items: center;
      width: 53px;
      height: 24px;
      line-height: 22px;
      background: #ffffff;
      border: 1px solid rgba(0,0,0,0.15);
      border-radius: 13px;
      color: rgba(0,0,0,0.80);
      font-size: 12px;
      cursor: pointer;
      i {
        font-size: 14px;
        color: rgba(0,0,0,0.40);
        margin-left: 5px;
      }
    }
    h4 {
      margin: 0;
      font-size: 16px;
      font-family: PingFangSC, PingFangSC-Medium;
      font-weight: 500;
      color: rgba(0,0,0,0.80);
      padding-left: 8px;
    }
  }
  .add-container {
    height: calc(100% - 97px);
    .el-dropdown-link {
        display: flex;
        align-items: center;
        color: #1890FF;
        font-size: 13px;
        font-family: PingFangSC, PingFangSC-Regular;
        letter-spacing: 0.2px;
        cursor: default;
        i {
          font-size: 14px;
        }
        .show-text {
          margin: 0 3px;
        }
        .brage-blue {
          display: block;
          width: 13px;
          height: 13px;
          line-height: 13px;
          text-align: center;
          font-size: 12px;
          border-radius: 50%;
          background-color: #1890ff;
          color: #fff;
          margin-top: 2px;
        }
      }
    .list-box {
      font-size: 14px;
      font-family: PingFangSC, PingFangSC-Regular;
      &.flex {
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
        >div {
          width: 25%;
          box-sizing: border-box;
          margin-bottom: 20px;
        }
        .therapeutic {
          height: 22px;
          line-height: 20px;
          background: #fff;
          border: 1px solid #C0C4CC;
          border-radius: 12px;
          padding: 0 8px;
          font-size: 12px;
          // color: #ff9503;
          color: rgba(0, 0, 0, 0.8);
          &.radiotherapy,
            &.radiotherapy1 {
              border-color: rgba(255, 173, 210, 1);
              background-color: rgba(255, 240, 246, 1);
              color: #eb2f96;
            }
            &.chemotherapy,
            &.chemotherapy1 {
              border-color: rgba(145, 213, 255, 1);
              background-color: rgba(230, 247, 255, 1);
              color: #1890ff;
            }
            &.postoperative {
              border-color: rgba(255, 187, 150, 1);
              background-color: rgba(255, 242, 232, 1);
              color: #fa541c;
            }
            &.preoperative {
              border-color: rgba(254, 218, 98, 1);
              background-color: rgba(255, 251, 230, 1);
              color: #faad14;
            }
            &.radioGreen {
              border-color: #52c41a;
              background-color: #f6ffed;
              color: #52c41a;
            }
        }
      }
      p {
        margin: 0;
        color: rgba(0,0,0,0.80);
        // line-height: 20px;
        letter-spacing: 0.21px;
        sup {
          color: #E92626;
        }
      }
      p.second-title {
        color: rgba(0,0,0,0.60);
        margin-bottom: 8px;
        display: flex;
      }
      &.symptom {
        display: flex;
        flex-wrap: wrap;
        box-sizing: border-box;
        margin-bottom: 10px;
        .symptom-item {
          width: calc((100% - 20px) / 3);
          margin-right: 10px;
          margin-bottom: 0;
          &:nth-child(3n){
            margin-right: 0;
          }
          >div {
            margin-bottom: 10px;
          }
        }
      }
      .repeat-select {
        display: flex;
        align-items: center;
        position: relative;
        flex: 1;
        &::before {
          content: '';
          display: block;
          width: 0;
          height: 20px;
          border-right: 1px solid  rgba(0,0,0,0.20);
          margin: 0 10px;
        }
      }
      .symptom-title {
        display: flex;
        align-items: center;
        justify-content: space-between;
        font-size: 14px;
        font-family: PingFangSC, PingFangSC-Regular;
        font-weight: 400;
        text-align: left;
        color: rgba(0,0,0,0.60);
        margin: 12px 0 4px;
        sup {
          color: #E92626;
        }
        span:first-child {
            display: flex;
          }
        span:last-child {
          color: rgba(0,0,0,0.40);
        }
      }
      .num-box {
        display: flex;
        align-items: center;
        .el-input {
          flex: 1;
          margin-right: 5px;
        }
        font-size: 14px;
        font-family: PingFangSC, PingFangSC-Regular;
        font-weight: 400;
        text-align: left;
        color: rgba(0,0,0,0.60);
      }
    }
    .repeat-box {
      display: flex;
      align-items: center;
      height: 32px;
    }
    .margin-20 {
      margin-bottom: 20px;
    }
    .margin-8 {
      margin-bottom: 8px;
    }
    .remain-table {
      font-family: PingFangSC, PingFangSC-Regular;
      font-weight: 400;
      text-align: left;
      color: rgba(0,0,0,0.70);
      &-hd {
        display: flex;
        height: 44px;
        border: 1px solid #D9D9D9;
        background-color: #F6F9FF;
        justify-content: space-between;
        align-items: center;
        padding: 0 12px;
        flex: 1;
        p {
          height: 100%;
          display: flex;
          align-items: center;
        }
        p:first-child {
          flex: 1;
          .el-input {
            flex: 1;
            margin-left: 10px;
          }
        }
        p:last-child {
          box-sizing: border-box;
          width: 90px;
          padding-left: 12px;
          .link {
            width: 80px;
            display: block;
            height: 24px;
            line-height: 22px;
            color: #1890FF;
            border: 1px solid #1890FF;
            color: #1890FF;
            font-size: 14px;
            cursor: pointer;
            text-align: center;
            border-radius: 2px;
            i {
              font-size: 14px;
            }
            &:hover {
              opacity: 0.8;
            }
          }
        }
      }
      &-input {
        display: flex;
        align-items: center;
        padding: 12px;
        border-right: 1px solid #D9D9D9;
        border-left: 1px solid #D9D9D9;
        p {
          flex: 1;
          display: flex;
          align-items: center;
          &:first-child {
            margin-right: 12px;
          }
          span {
            margin-right: 12px;
            font-size: 14px;
          }
          .el-input {
            flex: 1;
          }
        }
      }
      &-bd {
        height: auto;
        border: 1px solid #D9D9D9;
        border-top: none;
        min-height: 200px;
        box-sizing: border-box;
        .pro-item {
          display: flex;
          height: 40px;
          align-items: center;
          padding: 0 12px;
          border-bottom: 1px solid rgba(0,0,0,0.06);
          &-left {
            flex: 1;
            padding-right: 12px;
            color: rgba(0,0,0,0.70);
            p {
              color: rgba(0,0,0,0.70);
            }
          }
          &-right {
            width: 90px;
            padding-left: 12px;
            display: flex;
            justify-content: space-between;
            box-sizing: border-box;
            span {
              cursor: pointer;
              &:hover,
              &:active {
                opacity: 0.8;
              }
            }
            .red {
              color: #E92626;
              
            }
            .blue {
              color: #1890FF;
            }
          }
        }
        .pro-item.add {
          width: 100%;
          justify-content: center;
          color: #1890ff;
          cursor: pointer;
        }
        /deep/ .el-empty .el-empty__description{
          margin: 0!important;
        }
      }
    }
  }
  .add-footer {
    display: flex;
    justify-content: flex-end;
    p {
      margin: 0;
      width: 61px;
      height: 32px;
      line-height: 30px;
      background: #ffffff;
      border: 1px solid #e92626;
      border-radius: 2px;
      text-align: center;
      color: #e92626;
      cursor: pointer;
      &:hover,
      &:active {
        opacity: 0.8;
      }
    }
    p.btn-temporary {
      background: rgba(24,144,255,0.10);
      border: 1px solid #1890ff;
      color: #1890FF;
    }
    p.btn-save {
      background: #1890ff;
      color: #fff;
      border-color: #1890FF;
    }
    p + p {
      margin-left: 8px;
    }
  }
}
</style>