Vue_New/src/xt_pages/data/druguseTemplate.vue

<template>
  <div class="main-contain">
    <div class="position">
      <bread-crumb :crumbs='crumbs'></bread-crumb>
    </div>

    <el-dialog title="透析处方长期医嘱医生确认推送提醒" :visible.sync="dialogConfigVisible">
      <el-form>
        <el-form-item label="是否开启推送:">
          <el-radio-group v-model="is_open_remind" @change="changeRemind">
            <el-radio :label="1">开启</el-radio>
            <el-radio :label="2">不开启</el-radio>
          </el-radio-group>
        </el-form-item>
      </el-form>
    </el-dialog>


    <div class="app-container">
      <el-tabs>
        <el-tab-pane label="医嘱模板 ">
          <div>
            <div class="filter-container">
              <el-button size="small"
                         :loading="loading"
                         style="float: right;"
                         :disabled="is_init?true:false"
                         @click="initAdvice()"
                         type="primary">医嘱初始化
              </el-button>

              <el-button size="small"
                         style="float: right;margin-left: 10px;margin-right: 10px"
                         @click="dialogConfigVisible = true"
                         type="primary">长期医嘱提醒配置
              </el-button>

              <el-button
                class="filter-item"
                style="margin-left: 10px;margin-right: 10px"
                @click="handleCreateTemplate"
                type="primary"
                size="small"
                icon="el-icon-circle-plus-outline"
              >{{$t('table.add')}}
              </el-button>
            </div>



            <el-table
              :data="adviceTemplates"
              border
              fit
              :row-style="{ color: '#303133' }"
              :header-cell-style="{
            backgroundColor: 'rgb(245, 247, 250)',
            color: '#606266'
          }"
              @cell-mouse-leave="cellMouseLeave"
              @cell-mouse-enter="cellMouseEnter"
              :row-class-name="tableRowClassNames"
              :span-method="merge"
              style="width: 100%;min-height:500px;"
            >
              <el-table-column
                prop="id"
                label="模版名称"
                align="center"
                width="100">
                <template slot-scope="scope">
                  <span v-if="isShow(scope.$index, scope.row)">{{scope.row.name}}</span>
                  <span v-else></span>
                </template>
              </el-table-column>


              <el-table-column
                label="模版类型"
                align="center"
                width="100"
              >
                <template slot-scope="scope">
                  <div>{{scope.row.advice_type == 1 ? '长期' : '临时'}}</div>
                </template>

              </el-table-column>

              <el-table-column
                prop="amount1"
                align="center"
                label="医嘱内容">
                <template slot-scope="scope">

                  <el-dropdown trigger="click" v-if="scope.row.parent_id == 0">
                            <span class="el-dropdown-link" v-if="scope.row.parent_id == 0">
                                {{scope.row.advice_name}}<i class="el-icon-arrow-down el-icon--right"></i>
                            </span>

                    <el-dropdown-menu slot="dropdown">
                      <el-dropdown-item @click.native="openEdit(scope.$index, scope.row)">修改医嘱</el-dropdown-item>
                      <el-dropdown-item @click.native="openDelete(scope.$index, scope.row)">删除医嘱</el-dropdown-item>
                      <el-dropdown-item @click.native="openNewChild(scope.$index, scope.row)">新增子药</el-dropdown-item>
                    </el-dropdown-menu>
                  </el-dropdown>


                  <el-dropdown trigger="click" v-if="scope.row.parent_id > 0">
                            <span class="el-dropdown-link">
                                &emsp;&emsp;{{ scope.row.advice_name }}<i class="el-icon-arrow-down el-icon--right"></i>
                            </span>

                    <el-dropdown-menu slot="dropdown">
                      <el-dropdown-item
                        @click.native="openEdit(scope.$index, scope.row)">修改子药
                      </el-dropdown-item>
                      <el-dropdown-item
                        @click.native="openDeleteChild(scope.$index, scope.row)">删除子药
                      </el-dropdown-item>
                    </el-dropdown-menu>
                  </el-dropdown>


                </template>
              </el-table-column>


              <el-table-column
                prop="amount1"
                align="center"
                label="药品规格">
                <template slot-scope="scope">
                  <span v-if="scope.row.advice_desc">{{scope.row.advice_desc}}{{scope.row.drug_spec_unit}}</span>
                </template>
              </el-table-column>


              <el-table-column
                prop="amount2"
                width="90"
                align="center"
                label="开药数量">
                <template slot-scope="scope" v-if="scope.row.prescribing_number != ''">
                  <span>{{scope.row.prescribing_number}}{{scope.row.prescribing_number_unit}}</span>

                </template>
              </el-table-column>

              <el-table-column
                prop="amount2"
                width="90"
                align="center"
                label="单次用量">
                <template slot-scope="scope" v-if="scope.row.single_dose != ''">
                  <span>{{scope.row.single_dose}}{{scope.row.single_dose_unit}}</span>

                </template>
              </el-table-column>

              <el-table-column
                prop="amount3"
                align="center"
                label="给药途径">
                <template slot-scope="scope" v-if="scope.row.parent_id == 0">
                  <span>{{scope.row.delivery_way}}</span>
                </template>
              </el-table-column>


              <el-table-column
                prop="amount3"
                align="center"

                label="执行频率">
                <template slot-scope="scope" v-if="scope.row.parent_id == 0">
                  <span>{{scope.row.execution_frequency}}</span>
                </template>
              </el-table-column>




              <el-table-column prop="blood_flow_volume" align="center" label="提醒频率">
                <template slot-scope="scope">
                  <span v-if="scope.row.advice_type == 1 &&scope.row.frequency_type == 1">每次必推</span>
                  <span v-if="scope.row.advice_type == 1&&scope.row.frequency_type == 2">{{scope.row.day_count}}天/1次</span>
                  <span v-if="scope.row.advice_type == 1&&scope.row.frequency_type == 3">每周{{scope.row.week_days}}</span>
                </template>
              </el-table-column>

             <el-table-column prop="blood_flow_volume" align="center" label="排序">
                <template slot-scope="scope">
                  <span v-if="scope.row.sort == 0"></span>
                  <span v-if="scope.row.sort!=0">{{scope.row.sort}}</span>
                </template>
              </el-table-column>

              <el-table-column
                align="center"
                label="操作"
                width="180"
                class-name="small-padding fixed-width"
              >
                <template slot-scope="scope">
                  <el-tooltip class="item" effect="dark" content="编辑" placement="top">
                    <el-button
                      type="primary"
                      size="small"
                      icon="el-icon-edit-outline"
                      v-if="isShow(scope.$index, scope.row)"
                      @click="handleUpdateAdviceTemplate(scope.row, scope.$index)"
                    >
                    </el-button>
                  </el-tooltip>
                  <el-tooltip class="item" effect="dark" content="删除" placement="top">
                    <el-button
                      size="small"
                      type="danger"
                      icon="el-icon-delete"
                      @click="handleDeleteAdviceTemplate(scope.row, scope.$index)"
                    >
                    </el-button>
                  </el-tooltip>
                </template>
              </el-table-column>

            </el-table>


            <!--增删改查都是本地处理的dialog-->
            <el-dialog title="新增医嘱模版" :visible.sync="templateTableVisible" width="700px" :close-on-click-modal="false">
              <div>
                <el-form ref="form" :model="form" :rule="formRules" label-width="100px">
                  <el-form-item label="模版名称" style="width: 300px" prop="name">
                    <el-input v-model="form.name"></el-input>
                  </el-form-item>
                 <el-form-item label="排序" style="width: 300px" prop="name">
                    <el-input v-model="form.sort" v-type="number"></el-input>
                  </el-form-item>
                  <el-form-item label="模版类型" prop="advice_type">
                    <el-radio-group v-model="form.advice_type">
                      <el-radio :label="0">临时</el-radio>
                      <el-radio :label="1">长期</el-radio>
                    </el-radio-group>
                  </el-form-item>

                </el-form>
                <div class="txsj" style="text-align: center;margin-bottom: 30px">
                  <el-button round @click="newRecordAction">新增医嘱内容</el-button>
                  <el-button round @click="modifyRecordAction">修改医嘱内容</el-button>
                  <el-button round @click="deleteRecordAction">删除医嘱内容</el-button>
                </div>
                <el-table
                  ref="table" :data="adviceTableData"
                  border
                  highlight-current-row
                  max-height="300"
                  :header-cell-style="{ backgroundColor: 'rgb(245, 247, 250)'}"
                  :row-class-name="tableRow"
                  @row-click="onRowClick"
                  style="width: 100%">
                  <el-table-column label="医嘱内容" align="center" width="144">
                    <template slot-scope="scope">
                      {{scope.row.advice_name}}
                    </template>
                  </el-table-column>
                  <el-table-column align="center" label="药品规格">
                    <template slot-scope="scope">
                      <span v-if="scope.row.advice_desc">{{scope.row.advice_desc}}{{scope.row.drug_spec_unit}}</span>
                    </template>
                  </el-table-column>
                  <el-table-column prop="prescribing_number" align="center" label="开药数量">
                    <template slot-scope="scope" v-if="scope.row.prescribing_number != ''">
                      {{scope.row.prescribing_number}}{{scope.row.prescribing_number_unit}}
                    </template>
                  </el-table-column>
                  <el-table-column prop="single_dose" align="center" label="单次用量">
                    <template slot-scope="scope" v-if="scope.row.single_dose != ''">
                      {{scope.row.single_dose}}{{scope.row.single_dose_unit}}
                    </template>

                  </el-table-column>
                  <el-table-column prop="breathing_rate" align="center" label="给药途径">
                    <template slot-scope="scope">

                      {{scope.row.delivery_way}}
                    </template>

                  </el-table-column>
                  <el-table-column prop="blood_flow_volume" align="center" label="执行频率">
                    <template slot-scope="scope">
                      {{scope.row.execution_frequency}}
                    </template>
                  </el-table-column>

                  <el-table-column prop="blood_flow_volume" align="center" label="提醒频率" v-if="form.advice_type == 1">
                    <template slot-scope="scope">
                      <span v-if="scope.row.advice_type == 1 &&scope.row.frequency_type == 1">每次必推</span>
                      <span v-if="scope.row.advice_type == 1 &&scope.row.frequency_type == 2">{{scope.row.day_count}}天/1次</span>
                      <span v-if="scope.row.advice_type == 1 &&scope.row.frequency_type == 3">每周{{scope.row.weekdays}}</span>
                    </template>
                  </el-table-column>

                </el-table>
              </div>
              <div slot="footer" class="dialog-footer">
                <el-button @click="cancelTableHandle">取消</el-button>
                <el-button type="primary" @click="submitTableTemplate('form')">保 存</el-button>
              </div>
            </el-dialog>

            <!-- 新增子药 -->
            <el-dialog :title="dialogTitle" :before-close="closeform" :visible.sync="templateFormVisible" width="854px" >
              <el-form
                ref="templateForm"
                :rules="templateRules"
                :model="templateForm"
                label-width="90px"
              >

                <el-row >
                  <el-col :span="24">
                    <el-form-item label="医嘱内容:" required prop="advice_name">
                      <el-autocomplete
                          style="width:100%;"
                          class="inline-input"
                          v-model="templateForm.advice_name"
                          :fetch-suggestions="querySearch"
                          placeholder="请输入内容"
                          @input="changeDrugName"
                          @select="hangleSelectChange"
                      ></el-autocomplete>
                    </el-form-item>
                  </el-col>



                  <el-col :span="15">
                    <el-form-item label="药品规格 :" prop="advice_desc">
                      <el-col :span="8">


                       <el-autocomplete
                         style="width:100px;"
                         class="inline-input"
                         v-model="templateForm.advice_desc"
                         :fetch-suggestions="querySearch1"
                         placeholder="请输入内容"
                         @input="changeDrugDesc"
                       ></el-autocomplete>
                      </el-col>
                      <el-col class="line" :span="2">&nbsp;</el-col>
                      <el-col :span="14">
                        <el-select
                          v-model="templateForm.drug_spec_unit"
                          filterable
                          clearable
                          allow-create
                          placeholder="选择"
                        >
                          <el-option
                            v-for="item in unitsOption"
                            :key="item.id"
                            :label="item.name "
                            :value="item.name"
                          ></el-option>
                        </el-select>
                      </el-col>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="开药数量 :" prop="prescribing_number">
                      <el-col :span="9">
                        <el-input v-model="templateForm.prescribing_number"></el-input>
                      </el-col>
                      <el-col class="line" :span="1">&nbsp;</el-col>
                      <el-col :span="14">
                        <el-select
                          v-model="templateForm.prescribing_number_unit"
                          filterable
                          clearable
                          allow-create
                          placeholder="选择"
                        >
                          <el-option
                            v-for="item in unitsOption"
                            :key="item.id"
                            :label="item.name "
                            :value="item.name"
                          ></el-option>
                        </el-select>
                      </el-col>
                    </el-form-item>
                  </el-col>

                  <el-col :span="12">
                    <el-form-item label="单次用量 :" prop="single_dose">
                      <el-col :span="9">
                        <el-input v-model="templateForm.single_dose"></el-input>
                      </el-col>
                      <el-col class="line" :span="1">&nbsp;</el-col>
                      <el-col :span="14">
                        <el-select
                          v-model="templateForm.single_dose_unit"
                          filterable
                          clearable
                          allow-create
                          placeholder="选择"
                        >
                          <el-option
                            v-for="item in unitsOption"
                            :key="item.id"
                            :label="item.name "
                            :value="item.name"
                          ></el-option>
                        </el-select>
                      </el-col>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12" v-if="!isAddChild">
                    <el-form-item label="给药途径 :" prop="delivery_way">
                      <el-select
                        v-model="templateForm.delivery_way"
                        filterable
                        clearable
                        allow-create
                        placeholder="请选择(输入可搜索)"
                        style="width:100%"
                      >
                        <el-option
                          v-for="item in drugways"
                          :key="item.id"
                          :label="item.name "
                          :value="item.name"
                        ></el-option>
                      </el-select>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12" v-if="!isAddChild">
                    <el-form-item label="执行频率 :" prop="execution_frequency">
                      <el-select
                        v-model="templateForm.execution_frequency"
                        clearable
                        allow-create
                        filterable
                        placeholder="请选择(输入可搜索)"
                        style="width:100%"
                      >
                        <el-option
                          v-for="item in executionFrequencyOptions"
                          :key="item.id"
                          :label="item.name"
                          :value="item.name"
                        ></el-option>
                      </el-select>
                    </el-form-item>
                  </el-col>

                  <el-col :span="24" v-if="form.advice_type&&!isAddChild">
                    <el-form-item label="周期提醒 :">
                      <el-radio-group v-model="templateForm.frequency_type">
                        <el-radio :label="1">每次必推</el-radio>
                        <el-radio :label="2">天数频率</el-radio>
                        <el-radio :label="3">星期频率</el-radio>
                      </el-radio-group>
                    </el-form-item>
                  </el-col>


                  <el-col :span="12" v-if="templateForm.frequency_type == 2">
                    <el-form-item prop="day_count">
                      <el-input style="width: 50px" v-model="templateForm.day_count"></el-input>&nbsp;
                      天/一次
                    </el-form-item>
                  </el-col>

                  <el-col :span="24" v-if="templateForm.frequency_type == 3">
                    <el-form-item prop="weekday">
                      <el-checkbox-group v-model="templateForm.weekday">
                        <el-checkbox label="周一" name="type"></el-checkbox>
                        <el-checkbox label="周二" name="type"></el-checkbox>
                        <el-checkbox label="周三" name="type"></el-checkbox>
                        <el-checkbox label="周四" name="type"></el-checkbox>
                        <el-checkbox label="周五" name="type"></el-checkbox>
                        <el-checkbox label="周六" name="type"></el-checkbox>
                        <el-checkbox label="周日" name="type"></el-checkbox>
                      </el-checkbox-group>
                    </el-form-item>
                  </el-col>

                </el-row>
              </el-form>
              <div slot="footer" class="dialog-footer">
                <el-button @click="cancelHandle('templateForm'),closeform()">取消</el-button>
                <el-button type="primary" @click="submitTemplate('templateForm')">保 存</el-button>
              </div>
            </el-dialog>
            <!--TODO-->


            <el-dialog :title="editDialogTitle" :visible.sync="templateEditFormVisible" width="854px">
              <el-form
                ref="templateFormEdit"
                :rules="templateEditRules"
                :model="templateFormEdit"
                label-width="90px"
              >
                <el-row>
                  <el-col :span="24">
                    <el-form-item :label="edit_advice_name" required prop="advice_name">
                        <el-autocomplete
                          style="width:100%;"
                          class="inline-input"
                          v-model="templateFormEdit.advice_name"
                          :fetch-suggestions="querySearch"
                          placeholder="请输入内容"
                          @input="changeDrugNameTwo"
                          @select="hangdleSelectTwo"
                         ></el-autocomplete>
                    </el-form-item>
                  </el-col>
                  <el-col :span="15">

                    <el-form-item label="药品规格 :" prop="advice_desc">
                      <el-col :span="8">
                         <el-autocomplete
                         style="width:100px;"
                         class="inline-input"
                         v-model="templateFormEdit.advice_desc"
                         :fetch-suggestions="querySearch1"
                         placeholder="请输入内容"
                         @input="changeDrugDescTwo"
                       ></el-autocomplete>
                      </el-col>
                      <el-col class="line" :span="1">&nbsp;</el-col>
                      <el-col :span="14">
                        <el-select
                          v-model="templateFormEdit.drug_spec_unit"
                          filterable
                          clearable
                          allow-create
                          placeholder="选择"
                        >
                          <el-option
                            v-for="item in unitsOption"
                            :key="item.id"
                            :label="item.name "
                            :value="item.name"
                          ></el-option>
                        </el-select>
                      </el-col>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="开药数量 :" prop="prescribing_number">
                      <el-col :span="9">
                        <el-input v-model="templateFormEdit.prescribing_number"></el-input>
                      </el-col>
                      <el-col class="line" :span="1">&nbsp;</el-col>
                      <el-col :span="14">
                        <el-select
                          v-model="templateFormEdit.prescribing_number_unit"
                          filterable
                          clearable
                          allow-create
                          placeholder="选择"
                        >
                          <el-option
                            v-for="item in unitsOption"
                            :key="item.id"
                            :label="item.name "
                            :value="item.name"
                          ></el-option>
                        </el-select>
                      </el-col>
                    </el-form-item>
                  </el-col>

                  <el-col :span="12">
                    <el-form-item label="单次用量 :" prop="single_dose">
                      <el-col :span="9">
                        <el-input v-model="templateFormEdit.single_dose"></el-input>
                      </el-col>
                      <el-col class="line" :span="1">&nbsp;</el-col>
                      <el-col :span="14">
                        <el-select
                          v-model="templateFormEdit.single_dose_unit"
                          filterable
                          clearable
                          allow-create
                          placeholder="选择"
                        >
                          <el-option
                            v-for="item in unitsOption"
                            :key="item.id"
                            :label="item.name "
                            :value="item.name"
                          ></el-option>
                        </el-select>
                      </el-col>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12" v-if="templateFormEdit.parent_id == 0">
                    <el-form-item label="给药途径 :" prop="delivery_way">
                      <el-select
                        v-model="templateFormEdit.delivery_way"
                        filterable
                        clearable
                        allow-create
                        placeholder="请选择(输入可搜索)"
                        style="width:100%"
                      >
                        <el-option
                          v-for="item in drugways"
                          :key="item.id"
                          :label="item.name "
                          :value="item.name"
                        ></el-option>
                      </el-select>
                    </el-form-item>
                  </el-col>

                  <el-col :span="12" v-if="templateFormEdit.parent_id == 0">
                    <el-form-item label="执行频率 :" prop="execution_frequency">
                      <el-select
                        v-model="templateFormEdit.execution_frequency"
                        clearable
                        allow-create
                        filterable
                        placeholder="请选择(输入可搜索)"
                        style="width:100%"
                      >
                        <el-option
                          v-for="item in executionFrequencyOptions"
                          :key="item.id"
                          :label="item.name"
                          :value="item.name"
                        ></el-option>
                      </el-select>
                    </el-form-item>
                  </el-col>


                  <el-col :span="24">
                    <el-form-item label="周期提醒 :">
                      <el-radio-group v-model="templateFormEdit.frequency_type">
                        <el-radio :label="1">每次必推</el-radio>
                        <el-radio :label="2">天数频率</el-radio>
                        <el-radio :label="3">星期频率</el-radio>
                      </el-radio-group>
                    </el-form-item>
                  </el-col>


                  <el-col :span="12" v-if="templateFormEdit.frequency_type == 2">
                    <el-form-item prop="day_count">
                      <el-input style="width: 50px" v-model="templateFormEdit.day_count"></el-input>&nbsp;
                      天/一次
                    </el-form-item>
                  </el-col>

                  <el-col :span="24" v-if="templateFormEdit.frequency_type == 3">
                    <el-form-item>
                      <el-checkbox-group v-model="templateFormEdit.weekday">
                        <el-checkbox label="周一" name="type"></el-checkbox>
                        <el-checkbox label="周二" name="type"></el-checkbox>
                        <el-checkbox label="周三" name="type"></el-checkbox>
                        <el-checkbox label="周四" name="type"></el-checkbox>
                        <el-checkbox label="周五" name="type"></el-checkbox>
                        <el-checkbox label="周六" name="type"></el-checkbox>
                        <el-checkbox label="周日" name="type"></el-checkbox>
                      </el-checkbox-group>
                    </el-form-item>
                  </el-col>


                </el-row>
              </el-form>
              <div slot="footer" class="dialog-footer">
                <el-button @click="cancelEditHandle">取消</el-button>
                <el-button type="primary" @click="submitEditTemplate('templateFormEdit')">保 存</el-button>
              </div>
            </el-dialog>


            <!--增删改查都请求网络类型的dialog-->
            <el-dialog title="编辑医嘱模版" :visible.sync="templateTableTwoVisible" width="800px">
              <div>
                <el-form ref="form" :model="form" :rule="formRules" label-width="100px">
                  <el-form-item label="模版名称" style="width: 300px" prop="name">
                    <el-input v-model="form.name" ></el-input>
                  </el-form-item>

                   <el-form-item label="排序" style="width: 300px" prop="name">
                    <el-input v-model="form.sort" ></el-input>
                   </el-form-item>
                </el-form>


                <div class="txsj" style="text-align: center;margin-bottom: 30px">
                  <el-button round @click="newRecordActionTwo">新增医嘱内容</el-button>
                  <!--<el-button round @click="deleteRecordActionTwo">删除医嘱内容</el-button>-->
                  <!--<el-button round @click="modifyRecordActionTwo">修改医嘱内容</el-button>-->
                </div>


                <el-table :header-cell-style="{ backgroundColor: 'rgb(245, 247, 250)'}" ref="table"
                          :data="adviceTableDataTwo" border highlight-current-row max-height="300">
                  <el-table-column label="医嘱内容">
                    <template slot-scope="scope">
                      <span v-if="scope.row.parent_id == 0">{{scope.row.advice_name}}</span>
                      <span v-if="scope.row.parent_id > 0"> &emsp;{{scope.row.advice_name}}</span>
                    </template>
                  </el-table-column>
                  <el-table-column align="center" label="药品规格">
                    <!-- {{drugDesc(scope.row)}} -->
                    <template slot-scope="scope">
                      <span v-if="scope.row.advice_desc">{{scope.row.advice_desc}}{{scope.row.drug_spec_unit}}</span>
                    </template>
                  </el-table-column>
                  <el-table-column prop="prescribing_number" align="center" label="开药数量">
                    <template slot-scope="scope" v-if="scope.row.prescribing_number != ''">
                      {{scope.row.prescribing_number}}{{scope.row.prescribing_number_unit}}
                    </template>
                  </el-table-column>
                  <el-table-column align="center" label="单次用量">
                    <template slot-scope="scope" v-if="scope.row.single_dose != ''">
                      {{scope.row.single_dose}}{{scope.row.single_dose_unit}}
                    </template>

                  </el-table-column>
                  <el-table-column align="center" label="给药途径">
                    <template slot-scope="scope">
                      <span v-if="scope.row.parent_id == 0">{{scope.row.delivery_way}}</span>
                    </template>

                  </el-table-column>
                  <el-table-column align="center" label="执行频率">
                    <template slot-scope="scope">
                      <span v-if="scope.row.parent_id == 0">{{scope.row.execution_frequency}}</span>
                    </template>
                  </el-table-column>

                  <el-table-column align="center" label="提醒频率" v-if="form.advice_type == 1">
                    <template slot-scope="scope">
                      <span v-if="scope.row.frequency_type == 1">每次必推</span>
                      <span v-if="scope.row.frequency_type == 2">{{scope.row.day_count}}天/1次</span>
                      <span v-if="scope.row.frequency_type == 3">每周{{scope.row.week_days}}</span>
                    </template>
                  </el-table-column>
                </el-table>
              </div>
              <div slot="footer" class="dialog-footer">
                <el-button @click="cancelTableHandleTwo">取消</el-button>
                <el-button type="primary" @click="modifyTemplateName">保 存</el-button>
              </div>
            </el-dialog>


            <el-dialog title="新增医嘱" :visible.sync="templateFormTwoVisible" width="854px">
              <el-form
                ref="templateForm"
                :rules="templateEditRules"
                :model="templateForm"
                label-width="90px"
              >
                <el-row>
                  <el-col :span="24">
                    <el-form-item label="医嘱内容 :" required prop="advice_name">
                      <!-- <el-input v-model="templateForm.advice_name"></el-input> -->
                    <!-- <el-select
                        v-model="templateForm.advice_name"
                        filterable
                        clearable
                        allow-create
                        placeholder="请选择(输入可搜索)"
                        style="width:100%;"
                        @change="changeDrugName"
                    >
                      <el-option
                        v-for="(item,index) in all_drug"
                        :key="index"
                        :label="item.drug_name"
                        :value="item.drug_name"
                      ></el-option>
                     </el-select> -->

                       <el-autocomplete
                        style="width:100%;"
                        class="inline-input"
                        v-model="templateForm.advice_name"
                        :fetch-suggestions="querySearch"
                        placeholder="请输入内容"
                        @select="handleSelect"
                        @input="changeDrugName"
                       ></el-autocomplete>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">

                    <el-form-item label="药品规格 :" prop="advice_desc">
                      <el-col :span="9">
                        <!-- <el-input v-model="templateForm.advice_desc"></el-input> -->
                      <!-- <el-select
                          v-model="templateForm.advice_desc"
                          filterable
                          clearable
                          allow-create
                          placeholder="请选择(输入可搜索)"
                          @change="changeDrugDesc"
                        >
                        <el-option
                          v-for="item in drugSpec"
                          :key="item.id"
                          :label="item.drug_spec"
                          :value="item.drug_spec"
                        ></el-option>
                        </el-select> -->

                         <el-autocomplete
                          style="width:100px;"
                          class="inline-input"
                          v-model="templateForm.advice_desc"
                          :fetch-suggestions="querySearch1"
                          placeholder="请输入内容"
                          @select="handleSelect1"
                          @input="changeDrugDesc"
                         ></el-autocomplete>
                      </el-col>
                      <el-col class="line" :span="1">&nbsp;</el-col>
                      <el-col :span="14">
                        <el-select
                          v-model="templateForm.drug_spec_unit"
                          filterable
                          clearable
                          allow-create
                          placeholder="选择"
                        >
                          <el-option
                            v-for="item in unitsOption"
                            :key="item.id"
                            :label="item.name "
                            :value="item.name"
                          ></el-option>
                        </el-select>
                      </el-col>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="开药数量 :" prop="prescribing_number">
                      <el-col :span="9">
                        <el-input v-model="templateForm.prescribing_number"></el-input>
                      </el-col>
                      <el-col class="line" :span="1">&nbsp;</el-col>
                      <el-col :span="14">
                        <el-select
                          v-model="templateForm.prescribing_number_unit"
                          filterable
                          clearable
                          allow-create
                          placeholder="选择"
                        >
                          <el-option
                            v-for="item in unitsOption"
                            :key="item.id"
                            :label="item.name "
                            :value="item.name"
                          ></el-option>
                        </el-select>
                      </el-col>
                    </el-form-item>
                  </el-col>

                  <el-col :span="12">
                    <el-form-item label="单次用量 :" prop="single_dose">
                      <el-col :span="9">
                        <el-input v-model="templateForm.single_dose"></el-input>
                      </el-col>
                      <el-col class="line" :span="1">&nbsp;</el-col>
                      <el-col :span="14">
                        <el-select
                          v-model="templateForm.single_dose_unit"
                          filterable
                          clearable
                          allow-create
                          placeholder="选择"
                        >
                          <el-option
                            v-for="item in unitsOption"
                            :key="item.id"
                            :label="item.name "
                            :value="item.name"
                          ></el-option>
                        </el-select>
                      </el-col>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <!--bug619-->
<!--                    <el-button @click="lili">调试</el-button>-->
                    <el-form-item label="给药途径 :" prop="delivery_way">
                      <el-select
                        v-model="templateForm.delivery_way"
                        filterable
                        clearable
                        allow-create
                        placeholder="请选择(输入可搜索)"
                        style="width:100%"
                      >
                        <el-option
                          v-for="item in drugways"
                          :key="item.id"
                          :label="item.name "
                          :value="item.name"
                        ></el-option>
                      </el-select>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="执行频率 :" prop="execution_frequency">
                      <el-select
                        v-model="templateForm.execution_frequency"
                        clearable
                        allow-create
                        filterable
                        placeholder="请选择(输入可搜索)"
                        style="width:100%"
                      >
                        <el-option
                          v-for="item in executionFrequencyOptions"
                          :key="item.id"
                          :label="item.name"
                          :value="item.name"
                        ></el-option>
                      </el-select>
                    </el-form-item>
                  </el-col>


                  <el-col :span="24" v-if="form.advice_type == 1">
                    <el-form-item label="周期提醒 :">
                      <el-radio-group v-model="templateForm.frequency_type">
                        <el-radio :label="1">每次必推</el-radio>
                        <el-radio :label="2">天数频率</el-radio>
                        <el-radio :label="3">星期频率</el-radio>
                      </el-radio-group>
                    </el-form-item>
                  </el-col>


                  <el-col :span="12" v-if="templateForm.frequency_type == 2">
                    <el-form-item prop="day_count">
                      <el-input style="width: 50px" v-model="templateForm.day_count"></el-input>&nbsp;
                      天/一次
                    </el-form-item>
                  </el-col>

                  <el-col :span="24" v-if="templateForm.frequency_type == 3">
                    <el-form-item>
                      <el-checkbox-group v-model="templateForm.weekday">
                        <el-checkbox label="周一" name="type"></el-checkbox>
                        <el-checkbox label="周二" name="type"></el-checkbox>
                        <el-checkbox label="周三" name="type"></el-checkbox>
                        <el-checkbox label="周四" name="type"></el-checkbox>
                        <el-checkbox label="周五" name="type"></el-checkbox>
                        <el-checkbox label="周六" name="type"></el-checkbox>
                        <el-checkbox label="周日" name="type"></el-checkbox>
                      </el-checkbox-group>
                    </el-form-item>
                  </el-col>
                </el-row>


              </el-form>
              <div slot="footer" class="dialog-footer">
                <el-button @click="cancelHandleTwo">取消</el-button>
                <el-button type="primary" @click="submitTemplateTwo('templateForm')">保 存</el-button>
              </div>
            </el-dialog>
            <!--<el-dialog title="编辑医嘱" :visible.sync="templateEditFormTwoVisible" width="700px">-->
            <!--<el-form-->
            <!--ref="templateFormEdit"-->
            <!--:rules="templateEditRules"-->
            <!--:model="templateFormEdit"-->
            <!--label-width="90px"-->
            <!--&gt;-->
            <!--<el-form-item label="医嘱名称 :" required prop="advice_name">-->
            <!--<el-input v-model="templateFormEdit.advice_name" style="width:50%"></el-input>-->
            <!--</el-form-item>-->

            <!--<el-row>-->
            <!--<el-col :span="12">-->
            <!--<el-form-item label="药品规格 :" prop="drug_spec">-->
            <!--<el-col :span="8">-->
            <!--<el-input v-model="templateFormEdit.drug_spec"></el-input>-->
            <!--</el-col>-->
            <!--<el-col class="line" :span="2">&nbsp;</el-col>-->
            <!--<el-col :span="14">-->
            <!--<el-select-->
            <!--v-model="templateFormEdit.drug_spec_unit"-->
            <!--filterable-->
            <!--clearable-->
            <!--allow-create-->
            <!--placeholder="选择"-->
            <!--&gt;-->
            <!--<el-option-->
            <!--v-for="item in unitsOption"-->
            <!--:key="item.id"-->
            <!--:label="item.name "-->
            <!--:value="item.name"-->
            <!--&gt;</el-option>-->
            <!--</el-select>-->
            <!--</el-col>-->
            <!--</el-form-item>-->
            <!--</el-col>-->
            <!--<el-col :span="12">-->
            <!--<el-form-item label="单次用量 :" prop="single_dose">-->
            <!--<el-col :span="8">-->
            <!--<el-input v-model="templateFormEdit.single_dose"></el-input>-->
            <!--</el-col>-->
            <!--<el-col class="line" :span="2">&nbsp;</el-col>-->
            <!--<el-col :span="14">-->
            <!--<el-select-->
            <!--v-model="templateFormEdit.single_dose_unit"-->
            <!--filterable-->
            <!--clearable-->
            <!--allow-create-->
            <!--placeholder="选择"-->
            <!--&gt;-->
            <!--<el-option-->
            <!--v-for="item in unitsOption"-->
            <!--:key="item.id"-->
            <!--:label="item.name "-->
            <!--:value="item.name"-->
            <!--&gt;</el-option>-->
            <!--</el-select>-->
            <!--</el-col>-->
            <!--</el-form-item>-->
            <!--</el-col>-->
            <!--<el-col :span="12">-->
            <!--<el-form-item label="开药数量 :" prop="prescribing_number">-->
            <!--<el-col :span="8">-->
            <!--<el-input v-model="templateFormEdit.prescribing_number"></el-input>-->
            <!--</el-col>-->
            <!--<el-col class="line" :span="2">&nbsp;</el-col>-->
            <!--<el-col :span="14">-->
            <!--<el-select-->
            <!--v-model="templateFormEdit.prescribing_number_unit"-->
            <!--filterable-->
            <!--clearable-->
            <!--allow-create-->
            <!--placeholder="选择"-->
            <!--&gt;-->
            <!--<el-option-->
            <!--v-for="item in unitsOption"-->
            <!--:key="item.id"-->
            <!--:label="item.name "-->
            <!--:value="item.name"-->
            <!--&gt;</el-option>-->
            <!--</el-select>-->
            <!--</el-col>-->
            <!--</el-form-item>-->
            <!--</el-col>-->
            <!--<el-col :span="12">-->
            <!--<el-form-item label="给药途径 :" prop="delivery_way">-->
            <!--<el-select-->
            <!--v-model="templateFormEdit.delivery_way"-->
            <!--filterable-->
            <!--clearable-->
            <!--allow-create-->
            <!--placeholder="请选择(输入可搜索)"-->
            <!--style="width:90%"-->
            <!--&gt;-->
            <!--<el-option-->
            <!--v-for="item in drugways"-->
            <!--:key="item.id"-->
            <!--:label="item.name "-->
            <!--:value="item.name"-->
            <!--&gt;</el-option>-->
            <!--</el-select>-->
            <!--</el-form-item>-->
            <!--</el-col>-->
            <!--</el-row>-->
            <!--<el-row>-->

            <!--<el-col :span="12">-->
            <!--<el-form-item label="执行频率 :" prop="execution_frequency">-->
            <!--<el-select-->
            <!--v-model="templateFormEdit.execution_frequency"-->
            <!--clearable-->
            <!--allow-create-->
            <!--filterable-->
            <!--placeholder="请选择(输入可搜索)"-->
            <!--style="width:90%"-->
            <!--&gt;-->
            <!--<el-option-->
            <!--v-for="item in executionFrequencyOptions"-->
            <!--:key="item.id"-->
            <!--:label="item.name"-->
            <!--:value="item.name"-->
            <!--&gt;</el-option>-->
            <!--</el-select>-->
            <!--</el-form-item>-->
            <!--</el-col>-->
            <!--</el-row>-->
            <!--</el-form>-->
            <!--<div slot="footer" class="dialog-footer">-->
            <!--<el-button @click="cancelEditHandleTwo">取消</el-button>-->
            <!--<el-button type="primary" @click="submitEditTemplateTwo('templateFormEdit')">保 存</el-button>-->
            <!--</div>-->
            <!--</el-dialog>-->


          </div>
        </el-tab-pane>
        <el-tab-pane label="给药途径">
          <div class="">
            <div class="filter-container">
              <el-button
                class="filter-item"
                style="margin-left: 10px;"
                @click="handleCreateDrugWay"
                type="primary"
                icon="el-icon-circle-plus-outline"
                size="small"
              >{{$t('table.add')}}
              </el-button>
            </div>

            <el-table
              :data="drugways"
              border
              fit
              :row-style="{ color: '#303133' }"
              :header-cell-style="{
            backgroundColor: 'rgb(245, 247, 250)',
            color: '#606266'
          }"
              highlight-current-row
              style="width: 100%;min-height:500px;"
            >
              <el-table-column align="center" label="名称">
                <template slot-scope="scope">
                  <span>{{scope.row.name}}</span>
                </template>
              </el-table-column>
              <el-table-column
                align="center"
                :label="$t('table.actions')"
                width="230"
                class-name="small-padding fixed-width"
              >
                <template slot-scope="scope">
                  <el-button type="text" size="mini" v-show="scope.row.org_id==0" disabled>系统设定</el-button>
                  <el-button
                    v-show="scope.row.org_id!=0"
                    type="primary"
                    size="small"
                    icon="el-icon-edit-outline"
                    @click="handleUpdateDrugWay(scope.row, scope.$index)"
                  >
                  </el-button>
                  <el-button
                    v-show="scope.row.org_id!=0"
                    size="small"
                    type="danger"
                    icon="el-icon-delete"
                    @click="handleDeleteDrugWay(scope.row, scope.$index)"
                  >
                  </el-button>
                </template>
              </el-table-column>
            </el-table>
            <el-dialog :title="dialogTitle" :visible.sync="drugwayFormVisible" width="700px">
              <el-form
                ref="drugwayForm"
                :rules="drugwayRules"
                :model="drugwayForm"
                label-width="90px"
              >
                <el-form-item label="给药途径 :" required prop="name">
                  <el-input v-model="drugwayForm.name" placeholder="给药途径"></el-input>
                </el-form-item>
                <el-form-item label="bbx01 :" required prop="name" v-if="$store.getters.xt_user.org_id == 10206 || $store.getters.xt_user.org_id == 0">
                  <el-input v-model="drugwayForm.code" placeholder="bbx01"></el-input>
                </el-form-item>

                <el-form-item label="编码 :" required prop="name" v-if="$store.getters.xt_user.org_id != 10206 && $store.getters.xt_user.org_id !=0">
                  <el-input v-model="drugwayForm.code" placeholder="给药途径编码"></el-input>
                </el-form-item>

                <el-form-item label="bby01 :" required prop="name">
                  <el-input v-model="drugwayForm.bby01" placeholder="bby01"></el-input>
                </el-form-item>
              </el-form>
              <div slot="footer" class="dialog-footer">
                <el-button @click="drugwayFormVisible = false">取消</el-button>
                <el-button type="primary" @click="submitDrugWay('drugwayForm')">保 存</el-button>
              </div>
            </el-dialog>
          </div>
        </el-tab-pane>
        <el-tab-pane label="执行频率">
          <div class="">
            <div class="filter-container">
              <el-button
                class="filter-item"
                style="margin-left: 10px;"
                @click="handleCreateEF"
                type="primary"
                icon="el-icon-circle-plus-outline"
                size="small"
              >{{$t('table.add')}}
              </el-button>
            </div>

            <el-table
              :data="executionFrequencyOptions"
              border
              fit
              :row-style="{ color: '#303133' }"
              :header-cell-style="{
            backgroundColor: 'rgb(245, 247, 250)',
            color: '#606266'
          }"
              highlight-current-row
              style="width: 100%;min-height:500px;"
            >
              <el-table-column align="center" label="名称">
                <template slot-scope="scope">
                  <span>{{scope.row.name}}</span>
                </template>
              </el-table-column>
              <el-table-column
                align="center"
                :label="$t('table.actions')"
                width="230"
                class-name="small-padding fixed-width"
              >
                <template slot-scope="scope">
                  <el-button type="text" size="mini" v-show="scope.row.org_id==0" disabled>系统设定</el-button>
                  <el-button
                    v-show="scope.row.org_id!=0"
                    type="primary"
                    size="small"
                    icon="el-icon-edit-outline"
                    @click="handleUpdateEF(scope.row, scope.$index)"
                  >
                  </el-button>
                  <el-button
                    v-show="scope.row.org_id!=0"
                    size="small"
                    type="danger"
                    icon="el-icon-delete"
                    @click="handleDeleteEF(scope.row, scope.$index)"
                  >
                  </el-button>
                </template>
              </el-table-column>
            </el-table>
            <el-dialog :title="dialogTitle" :visible.sync="efFormVisible" width="700px">
              <el-form ref="efForm" :rules="efRules" :model="efForm" label-width="90px">
                <el-form-item label="执行频率 :" required prop="name">
                  <el-input v-model="efForm.name" placeholder="执行频率"></el-input>

                </el-form-item>


                <el-form-item label="执行频率 :" >
                  <el-input v-model="efForm.code" placeholder="编码"></el-input>
                </el-form-item>


              </el-form>
              <div slot="footer" class="dialog-footer">
                <el-button @click="efFormVisible = false">取消</el-button>
                <el-button type="primary" @click="submitEF('efForm')">保 存</el-button>
              </div>
            </el-dialog>
          </div>
        </el-tab-pane>
      </el-tabs>
    </div>
  </div>

</template>


<style>
  @import "../../../static/css/table_row.css";

  .filter-item {
    float: right;
  }
</style>

<script>
  import {
    CreateAdviceTemplate,
    CreateDrugDic,
    CreateDrugWay,
    CreateExecutionFrequency,
    CreateSingleAdviceTemplate,
    CreateSubAdvice,
    DeleteAdviceTemplate,
    DeleteDrugDic,
    DeleteDrugWay,
    DeleteExecutionFrequency,
    DeleteParentAdviceTemplate,
    getAllAdviceConfig,
    getAllAdviceTemplate,
    postAdviceTemplate,
    UpdateAdviceTemplate,
    UpdateDrugDic,
    UpdateDrugWay,
    UpdateExecutionFrequency,
    updateTemplateName,
    getDoctorAdviceConfig,
    postDoctorAdviceConfig,
    PostInitAdviceTemplate,
    getDoctorInitConfig,
  } from '@/api/advice'
  import BreadCrumb from '@/xt_pages/components/bread-crumb'

  import { getDataConfig } from '@/utils/data'
  import { getSelfMedicalList } from "@/api/drug/drug"
  export default {
    name: 'tab',
    components: { BreadCrumb },
    data() {
      return {
        day_count: '',

        crumbs: [
          { path: false, name: '管理中心' },
          { path: 'data/druguse', name: '医嘱模版' }
        ],
        rowIndex: -1,
        current_template_id: 0,
        currentObject: {},
        tempArr: [],
        sameRowArr: [],
        advice_content_name: '',
        table_current_index: -1,
        adviceTableData: [],
        templateName: '',
        adviceTableDataTwo: [],
        table_current_index_two: -1,
        currentIndex: -1,
        isEdit: false,
        dialogTitle: '',
        is_open_remind:0,
        is_init:0,
        isAddChild: false,
        parent_id: 0,
        editDialogTitle: '编辑医嘱',
        drugdicFormVisible: false,
        drugwayFormVisible: false,
        templateFormVisible: false,
        templateTableTwoVisible: false,
        templateEditFormVisible: false,
        edit_advice_name: '',
        templateTableVisible: false,
        templateFormTwoVisible: false,
        templateEditFormTwoVisible: false,
        efFormVisible: false,
        activeName: 'drugdic',
        hoverOrderArr: [],
        createdTimes: 0,
        drugdics: [],
        adviceTemplates: [],
        current_template_name: '',
        editForm: {
          name: ''

        },
        loading:false,
        drugways: [],
        executionFrequencyOptions: [],
        drugdicRules: {
          name: [{ required: true, message: '请填写医嘱内容' }]
        },
        formRules: {
          name: [
            { required: true, message: '请输入模版名称', trigger: 'blur' }
          ],
          advice_type: [
            { required: true, message: '请选择模版类型', trigger: 'change' }
          ]
        },

        drugwayRules: {
          name: [{ required: true, message: '请填写给药途径' }]
        },
        efRules: {
          name: [{ required: true, message: '请填写执行频率' }]
        },
        templateRules: {
          advice_name: [{ required: true, message: '请填写医嘱内容' }]

        },
        templateEditRules: {
          advice_name: [{ required: true, message: '请填写医嘱内容' }]
        },
        templateForm: {
          frequency_type: 1,
          day_count: '',
          weekday: [],
          drug_spec: '',
          drug_spec_unit: '',
          advice_name: '',
          advice_desc: '',
          single_dose: '',
          single_dose_unit: '',
          prescribing_number: '',
          prescribing_number_unit: '',
          delivery_way: '',
          execution_frequency: '',
          id: 0,
          drug_id:0,
          way:0
        },
        dialogConfigVisible:false,
        templateFormEdit: {
          frequency_type: 0,
          day_count: '',
          weekday: [],
          week_days: '',
          drug_spec: '',
          drug_spec_unit: '',
          advice_name: '',
          advice_desc: '',
          single_dose: '',
          single_dose_unit: '',
          prescribing_number: '',
          prescribing_number_unit: '',
          delivery_way: '',
          execution_frequency: '',
          id: 0
        },
        drugdicForm: {
          name: '',
          spec: '',
          spec_unit: '',
          form: '',
          form_unit: '',
          id: 0
        },
        form: {
          name: '',
          advice_type: 0,
          sort:"",
        },
        drugwayForm: {
          name: '',
          id: 0,
          code:"",
          bby01:"",
        },
        efForm: {
          name: '',
          id: 0,
          code: "",
        },

        drugforms: [
          { lable: 1, name: '胶囊' },
          { lable: 2, name: '注射剂' },
          { lable: 3, name: '片剂' },
          { lable: 4, name: '注射液' },
          { lable: 5, name: '栓剂' },
          { lable: 6, name: '膏' },
          { lable: 7, name: '颗粒剂' },
          { lable: 8, name: '粉剂' },
          { lable: 9, name: '口服液' },
          { lable: 10, name: '干混悬剂' },
          { lable: 11, name: '丸剂' },
          { lable: 12, name: '气雾剂' },
          { lable: 13, name: '内服溶液' },
          { lable: 14, name: '外用溶液' },
          { lable: 15, name: '软膏剂' },
          { lable: 16, name: '胶剂' }
        ],
         medicals:[],
         drugSpec:[],
         all_drug:[],
         current_drug_name:"",
         current_drug_spec: "",
         drug_id: 0,
         src_type:"",
         way:0
      }
    },
    created() {
      this.getAdviceConfig()
      this.unitsOption = getDataConfig('hemodialysis', 'units')
      this.getDoctorAdviceConfig()
      this.getDoctorInitConfig()

       //获取自备药
      this.getSelfMedicalList()
    },
    methods: {
      lili(){
        console.log()
      },
      initAdvice(){
        this.$confirm('是否进行医嘱初始化操作?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          let params = {
            is_init:1
          }
          this.loading = true
          PostInitAdviceTemplate(params).then(response => {
            if (response.data.state == 1) {
              this.is_init = response.data.data.init_config.is_init
              this.getAdviceConfig()
              this.loading = false

            } else {
              this.loading = false
              this.$message.error(response.data.msg)
            }
          })
        }).catch(() => {
          this.loading = false
        });
      },
      getDoctorAdviceConfig(){
        getDoctorAdviceConfig().then(response => {
          if (response.data.state == 1) {
            this.is_open_remind = response.data.data.config.is_open_remind
          } else {
            this.$message.error(response.data.msg)
          }
        })
      },
      getDoctorInitConfig(){
        getDoctorInitConfig().then(response => {
          if (response.data.state == 1) {
            if(response.data.data.advice_init == null){
              this.is_init = 0
            }else{
              this.is_init = response.data.data.advice_init.is_init
            }

          } else {
            this.$message.error(response.data.msg)
          }
        })
      },
      adviceNameShow({ row, column, rowIndex, columnIndex }) {
        if (columnIndex == 1) {
          return 'templateadvicenamedisplay'
        } else {
          return ''
        }
      },
      showCreatedTimes() {
        this.createdTimes = this.createdTimes + 1
      },
      handleUpdateDrugDic(row, index) {
        this.currentIndex = index
        this.drugdicForm = {
          name: row.name,
          spec: row.spec,
          spec_unit: row.spec_unit,
          form: row.form,
          form_unit: row.form_unit,
          id: row.id
        }

        this.drugdicFormVisible = true
        this.dialogTitle = '编辑医嘱模版'
        this.isEdit = true
      },
      handleCreateDrugDic() {
        this.drugdicForm = {
          name: '',
          spec: '',
          spec_unit: '',
          form: '',
          form_unit: '',
          id: 0
        }
        this.drugdicFormVisible = true
        this.dialogTitle = '新增医嘱模版'
        this.isEdit = false
      },
      cancelHandle(formName) {
        this.table_current_index = -1
        this.resetForm(formName)
        if (this.isAddChild) {
          this.templateFormVisible = false
        } else {
          this.templateFormVisible = false
          this.templateTableVisible = true
        }
      },
      handleCreateTemplate() {
        this.form.advice_type = 0
        this.templateTableVisible = true
      },
      newRecordAction() {
        console.log("AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA")
        this.dialogTitle = '新增医嘱内容'
        this.advice_content_name = '医嘱内容'
        this.isEdit = false
        this.parent_id = 0
        this.isAddChild = false
        this.templateTableVisible = false
        this.templateFormVisible = true

      },
      deleteRecordAction: function() {
        if (this.table_current_index == -1) {
          this.$message.error('请选择一条医嘱记录')
          return
        }
        this.$confirm('删除记录', '是否删除该医嘱记录', {
          confirmButtonText: '确 定',
          cancelButtonText: '取 消',
          type: 'warning'
        }).then(() => {
          this.adviceTableData.splice(this.table_current_index, 1)
          this.table_current_index = -1
        }).catch(() => {
        })
      },
      tableRow({ row, rowIndex }) {
        // 把每一行的索引放进row
        row.index = rowIndex
      },
      onRowClick(row, event, column) {
        this.table_current_index = row.index
      },
      modifyRecordAction: function() {
        if (this.table_current_index == -1) {
          this.$message.error('请选择一条医嘱记录')
          return
        }

        this.isEdit = true
        const adviceTable = this.adviceTableData[this.table_current_index]
        for (var index in adviceTable) {
          this.templateForm[index] = adviceTable[index]
        }
        this.templateForm.weekday = adviceTable.weekdays.split(',')

        this.templateFormVisible = true
        this.templateTableVisible = false
        this.dialogTitle = '编辑医嘱内容'
        this.advice_content_name = '医嘱内容'
      }, cancelTableHandle: function() {
        this.$confirm('放弃编辑', '是否放弃编辑,已编辑的数据将无法恢复', {
          confirmButtonText: '确 定',
          cancelButtonText: '取 消',
          type: 'warning'
        }).then(() => {
          this.adviceTableData = []
          this.form.name = ''
          this.templateFormVisible = false
          this.templateTableVisible = false
        }).catch(() => {
        })
      },

      //添加医嘱模版
      submitTableTemplate(formName) {
        if (this.adviceTableData.length <= 0) {
          this.$message.error('至少添加一条医嘱信息')
          return
        }

        const params = {
          'data': this.adviceTableData
        }

        let name = encodeURIComponent(this.form.name)
        console.log("params",params)
        let sort = this.form.sort

        postAdviceTemplate(params, name,sort, this.form.advice_type).then(response => {

          if (response.data.state == 0) {
            this.$message.error(response.data.msg)
            return false
          } else {
            this.$message.success('添加模版成功')

            var template = response.data.data.template
            if (template.DoctorAdviceTemplate.length > 0) {
              for (let i = 0; i < template.DoctorAdviceTemplate.length; i++) {
                const object = {}
                const DoctorAdviceTemplate = template.DoctorAdviceTemplate[i]
                for (const key in DoctorAdviceTemplate) {
                  object[key] = DoctorAdviceTemplate[key]
                }
                object['name'] = template.name
                object['isNoSub'] = 2
                object['sort'] = template.sort
                this.adviceTemplates.unshift(object)
              }
            }
            this.handleSpanTempArr()

            this.form.name = ''
            this.adviceTableData = []
            this.templateFormVisible = false
            this.templateTableVisible = false
          }
        })
      },
      resetForm(formName) {
        this.$refs[formName].resetFields()
      },
      handleDeleteDrugDic(row, index) {
        this.$confirm('确认删除此医嘱模板?', '删除', {
          confirmButtonText: '确 定',
          cancelButtonText: '取 消',
          type: 'warning'
        })
          .then(() => {
            DeleteDrugDic(row.id).then(response => {
              if (response.data.state == 0) {
                this.$message.error(response.data.msg)
                return false
              } else {
                this.$message.success('删除成功')
                this.drugdics.splice(index, 1)
              }
            })
          })
          .catch(() => {
          })
      },
      handleDeleteAdviceTemplate(row, index) {
        this.$confirm('确认删除此医嘱模板?', '删除', {
          confirmButtonText: '确 定',
          cancelButtonText: '取 消',
          type: 'warning'
        })
          .then(() => {
            DeleteParentAdviceTemplate(row.template_id).then(response => {
              if (response.data.state == 0) {
                this.$message.error(response.data.msg)
                return false
              } else {
                this.$message.success('删除成功')

                // console.log(this.adviceTemplates.length)
                // for(let i = 0;i < this.adviceTemplates.length; i++){
                //   if(this.adviceTemplates[i].template_id == row.template_id){
                //     this.adviceTemplates.splice(i,1);
                //   }
                // }
                this.getAdviceConfig()
              }
            })
          })
          .catch(() => {
          })
      },
      submitDrugDic(formName) {
        this.$refs[formName].validate(valid => {
          if (valid) {
            if (this.isEdit) {
              UpdateDrugDic(this.drugdicForm.id, this.drugdicForm).then(
                response => {
                  if (response.data.state == 0) {
                    this.$message.error(response.data.msg)
                    return false
                  } else {
                    this.$message.success('修改成功')

                    this.drugdicFormVisible = false
                    this.resetForm(formName)
                    var drugdic = response.data.data.drugdic
                    this.drugdics[this.currentIndex].name = drugdic.name
                    this.drugdics[this.currentIndex].spec = drugdic.spec
                    this.drugdics[this.currentIndex].spec_unit =
                      drugdic.spec_unit
                    this.drugdics[this.currentIndex].form = drugdic.form
                    this.drugdics[this.currentIndex].form_unit =
                      drugdic.form_unit
                    this.drugdics[this.currentIndex].updated_time =
                      drugdic.updated_time
                    this.currentIndex = -1
                    return false
                  }
                }
              )
            } else {
              CreateDrugDic(this.drugdicForm).then(response => {
                if (response.data.state == 0) {
                  this.$message.error(response.data.msg)
                  return false
                } else {
                  this.$message.success('添加成功')

                  this.drugdicFormVisible = false
                  this.resetForm(formName)
                  this.drugdics.unshift(response.data.data.drugdic)
                  return false
                }
              })
            }
          }
        })
      },
      handleSelect1(){
       this.templateForm.drug_id =  val.id
       this.templateForm.way = 1
      },
      handleSelect(val){
        console.log("val23232li",val)
        this.templateForm.drug_id =  val.id
        this.templateForm.way = 1
        var tmp = val.drug_specs[0]
        console.log("tmp",tmp)
        console.log("unitsOption",this.unitsOption)
        this.templateForm.advice_desc = tmp.dose+tmp.dose_unit+"*"+tmp.min_number+tmp.min_unit+"/"//药品规格
        this.templateForm.drug_spec_unit = tmp.max_unit
        this.templateForm.prescribing_number = tmp.prescribing_number//开药数量
        this.templateForm.prescribing_number_unit = tmp.prescribing_number_unit
        this.templateForm.single_dose = tmp.single_dose//单次用量
        this.templateForm.single_dose_unit = tmp.drug_dose_unit
        this.templateForm.delivery_way = tmp.delivery_way//给药途径
        this.templateForm.execution_frequency = tmp.execution_frequency//执行频率
        this.templateForm.drug_id = tmp.id
      },
      submitTemplate(formName) {

        // if(this.src_type == ""){
        //     this.templateForm.way = 0
        //     this.templateForm.drug_id = 0
        // }

        if(this.src_type == 2){ //自备药
            var arr = this.templateForm.advice_name.split("(自备药)")
            this.templateForm.advice_name = arr[0]
        }
        // console.log("2222",this.templateForm)

        this.$refs[formName].validate(valid => {
          this.templateForm.single_dose = parseFloat(this.templateForm.single_dose)
          this.templateForm.prescribing_number = parseFloat(this.templateForm.prescribing_number)

          if (isNaN(this.templateForm.single_dose)) {
            this.templateForm.single_dose = 0
          }
          if (isNaN(this.templateForm.prescribing_number)) {
            this.templateForm.prescribing_number = 0
          }

          if (valid) {
            const templateFormTwo = {}
            templateFormTwo.template_id = this.current_template_id
            templateFormTwo.advice_name = this.templateForm.advice_name
            templateFormTwo.advice_desc = this.templateForm.advice_desc
            templateFormTwo.drug_spec = this.templateForm.drug_spec
            templateFormTwo.drug_spec_unit = this.templateForm.drug_spec_unit
            templateFormTwo.single_dose = this.templateForm.single_dose
            templateFormTwo.single_dose_unit = this.templateForm.single_dose_unit
            templateFormTwo.prescribing_number = this.templateForm.prescribing_number
            templateFormTwo.prescribing_number_unit = this.templateForm.prescribing_number_unit
            templateFormTwo.delivery_way = this.templateForm.delivery_way
            templateFormTwo.execution_frequency = this.templateForm.execution_frequency
            templateFormTwo.parent_id = this.parent_id
            templateFormTwo.drug_id = this.templateForm.drug_id
            templateFormTwo.way   = this.templateForm.way

            if (this.isAddChild) {
              CreateSubAdvice(templateFormTwo).then(response => {
                if (response.data.state == 0) {
                  this.$message.error(response.data.msg)
                  this.closeform()
                  return false
                } else {
                  this.$message.success('添加成功')
                  var spliceIndex = -1
                  for (let index = this.adviceTemplates.length - 1; ; index--) {
                    if (this.adviceTemplates[index].parent_id === templateFormTwo.parent_id) {
                      spliceIndex = index
                      break
                    } else if (this.adviceTemplates[index].id === templateFormTwo.parent_id) {
                      spliceIndex = index
                      break
                    }
                  }
                  if (spliceIndex > -1) {
                    spliceIndex += 1
                    if (spliceIndex === this.adviceTemplates.length) {
                      const template = response.data.data.template
                      template['isNoSub'] = 2
                      this.adviceTemplates.push(template)
                    } else {
                      const template = response.data.data.template
                      template['isNoSub'] = 2
                      var swapData = this.adviceTemplates.splice(spliceIndex)
                      this.adviceTemplates.push(template)
                      this.adviceTemplates = this.adviceTemplates.concat(swapData)
                    }
                  }
                  this.handleSpanTempArr()
                  this.templateFormVisible = false
                  this.resetForm(formName)
                  this.closeform()
                  return false
                }
              })
            } else {

              const templateFormTwo = {}
              templateFormTwo.advice_name = this.templateForm.advice_name
              templateFormTwo.advice_desc = this.templateForm.advice_desc
              templateFormTwo.drug_spec = this.templateForm.drug_spec
              templateFormTwo.drug_spec_unit = this.templateForm.drug_spec_unit
              templateFormTwo.single_dose = this.templateForm.single_dose
              templateFormTwo.single_dose_unit = this.templateForm.single_dose_unit
              templateFormTwo.prescribing_number = this.templateForm.prescribing_number
              templateFormTwo.prescribing_number_unit = this.templateForm.prescribing_number_unit
              templateFormTwo.delivery_way = this.templateForm.delivery_way
              templateFormTwo.execution_frequency = this.templateForm.execution_frequency
              templateFormTwo.parent_id = this.parent_id
              templateFormTwo.drug_id = this.templateForm.drug_id
              templateFormTwo.way  = this.templateForm.way

              if (this.templateForm.frequency_type == 1) {
                templateFormTwo.frequency_type = this.templateForm.frequency_type
                templateFormTwo.day_count = '0'
                templateFormTwo.weekdays = ''

              } else if (this.templateForm.frequency_type == 2) {

                templateFormTwo.frequency_type = this.templateForm.frequency_type
                templateFormTwo.day_count = this.templateForm.day_count
                templateFormTwo.weekdays = ''

              } else if (this.templateForm.frequency_type == 3) {
                templateFormTwo.frequency_type = this.templateForm.frequency_type
                templateFormTwo.day_count = '0'
                templateFormTwo.weekdays = this.templateForm.weekday.filter(function(s) {
                  return s && s.trim()
                }).join(',')

              }

              this.templateForm.advice_name = ''
              this.templateForm.advice_desc = ''
              this.templateForm.frequency_type = 1
              this.templateForm.day_count = ''
              this.templateForm.weekday = []

              console.log(templateFormTwo)
              if (this.isEdit) {
                for (let i = 0; i < this.adviceTableData.length; i++) {
                  if (i == this.table_current_index) {
                    this.adviceTableData[i].advice_name = templateFormTwo.advice_name
                    this.adviceTableData[i].advice_desc = templateFormTwo.advice_desc
                    this.adviceTableData[i].drug_spec = templateFormTwo.drug_spec
                    this.adviceTableData[i].drug_spec_unit = templateFormTwo.drug_spec_unit
                    this.adviceTableData[i].single_dose = templateFormTwo.single_dose
                    this.adviceTableData[i].single_dose_unit = templateFormTwo.single_dose_unit
                    this.adviceTableData[i].prescribing_number = templateFormTwo.prescribing_number
                    this.adviceTableData[i].prescribing_number_unit = templateFormTwo.prescribing_number_unit
                    this.adviceTableData[i].delivery_way = templateFormTwo.delivery_way
                    this.adviceTableData[i].execution_frequency = templateFormTwo.execution_frequency
                    this.adviceTableData[i].frequency_type = templateFormTwo.frequency_type
                    this.adviceTableData[i].day_count = templateFormTwo.day_count
                    this.adviceTableData[i].weekdays = templateFormTwo.weekdays
                    this.adviceTableData[i].drug_id =  templateFormTwo.drug_id
                    this.adviceTableData[i].way   = templateFormTwo.way

                  }
                }
              } else {
                this.adviceTableData.unshift(templateFormTwo)
                console.log(this.adviceTableData)
              }
              this.templateFormVisible = false
              this.templateTableVisible = true
            }

            this.$refs[formName].resetFields()
          }
        })
      },
      handleCreateDrugWay() {
        this.drugwayForm = {
          name: '',
          code:'',
          id: 0,
          bby01:"",
        }
        this.drugwayFormVisible = true
        this.dialogTitle = '新增给药途径'
        this.isEdit = false
      },

      handleUpdateDrugWay(row, index) {
        console.log(row.code)
        this.currentIndex = index
        this.drugwayForm = {
          name: row.name,
          id: row.id,
          code:row.code,
          bby01:row.bby01
        }

        this.drugwayFormVisible = true
        this.dialogTitle = '编辑给药途径'
        this.isEdit = true
      },
      submitDrugWay(formName) {
        this.$refs[formName].validate(valid => {
          if (valid) {
            if (this.isEdit) {
              UpdateDrugWay(this.drugwayForm.id, this.drugwayForm).then(
                response => {
                  if (response.data.state == 0) {
                    this.$message.error(response.data.msg)
                    return false
                  } else {
                    this.$message.success('修改成功')

                    this.drugwayFormVisible = false
                    this.resetForm(formName)
                    var drugway = response.data.data.drugway
                    this.drugways[this.currentIndex].name = drugway.name
                    this.drugways[this.currentIndex].code = drugway.code
                    this.drugways[this.currentIndex].bby01 = drugway.bby01


                    this.drugways[this.currentIndex].updated_time =
                      drugway.updated_time
                    this.currentIndex = -1
                    return false
                  }
                }
              )
            } else {
              CreateDrugWay(this.drugwayForm).then(response => {
                if (response.data.state == 0) {
                  this.$message.error(response.data.msg)
                  return false
                } else {
                  this.$message.success('添加成功')
                  this.drugwayFormVisible = false
                  this.resetForm(formName)
                  this.drugways.unshift(response.data.data.drugway)
                  return false
                }
              })
            }
          }
        })
      },
      handleDeleteDrugWay(row, index) {
        this.$confirm('确认删除此给药途径?', '删除', {
          confirmButtonText: '确 定',
          cancelButtonText: '取 消',
          type: 'warning'
        })
          .then(() => {
            DeleteDrugWay(row.id).then(response => {
              if (response.data.state == 0) {
                this.$message.error(response.data.msg)
                return false
              } else {
                this.$message.success('删除成功')

                this.drugways.splice(index, 1)
              }
            })
          })
          .catch(() => {
          })
      },
      handleCreateEF() {
        this.efForm = {
          name: '',
          id: 0
        }
        this.efFormVisible = true
        this.dialogTitle = '新增执行频率'
        this.isEdit = false
      },
      handleUpdateEF(row, index) {
        this.currentIndex = index
        this.efForm = {
          name: row.name,
          id: row.id,
          code: row.code
        }

        this.efFormVisible = true
        this.dialogTitle = '编辑执行频率'
        this.isEdit = true
      },
      submitEF(formName) {
        this.$refs[formName].validate(valid => {
          if (valid) {
            if (this.isEdit) {
              UpdateExecutionFrequency(this.efForm.id, this.efForm).then(
                response => {
                  if (response.data.state == 0) {
                    this.$message.error(response.data.msg)
                    return false
                  } else {
                    this.$message.success('修改成功')

                    this.efFormVisible = false
                    this.resetForm(formName)
                    var ef = response.data.data.ef
                    this.executionFrequencyOptions[this.currentIndex].name =
                      ef.name
                    this.executionFrequencyOptions[
                      this.currentIndex
                      ].updated_time = ef.updated_time
                    this.currentIndex = -1
                    return false
                  }
                }
              )
            } else {
              CreateExecutionFrequency(this.efForm).then(response => {
                if (response.data.state == 0) {
                  this.$message.error(response.data.msg)
                  return false
                } else {
                  this.$message.success('添加成功')

                  this.efFormVisible = false
                  this.resetForm(formName)
                  this.executionFrequencyOptions.unshift(response.data.data.ef)
                  return false
                }
              })
            }
          }
        })
      },
      handleDeleteEF(row, index) {
        this.$confirm('确认删除此执行频率?', '删除', {
          confirmButtonText: '确 定',
          cancelButtonText: '取 消',
          type: 'warning'
        })
          .then(() => {
            DeleteExecutionFrequency(row.id).then(response => {
              if (response.data.state == 0) {
                this.$message.error(response.data.msg)
                return false
              } else {
                this.$message.error('删除成功')

                this.executionFrequencyOptions.splice(index, 1)
              }
            })
          })
          .catch(() => {
          })
      },

      getAdviceConfig() {
        this.adviceTemplates = []
        getAllAdviceConfig().then(response => {
          if (response.data.state == 1) {
            this.drugways = response.data.data.drugways
            this.executionFrequencyOptions = response.data.data.efs
            this.drugdics = response.data.data.drugs
            const len = response.data.data.advice_templates.length

            for (let i = 0; i < len; i++) {
              // 对于空医嘱模版的处理
              if (response.data.data.advice_templates[i] != null && response.data.data.advice_templates[i].DoctorAdviceTemplate.length == 0) {
                const object = {}
                object['name'] = response.data.data.advice_templates[i].name
                object['isNoSub'] = 1
                object['template_id'] = response.data.data.advice_templates[i].id
                object['sort'] = response.data.data.advice_templates[i].sort
                this.adviceTemplates.push(object)
              }

              // 非空模版的处理
              for (let y = 0; y < response.data.data.advice_templates[i].DoctorAdviceTemplate.length; y++) {
                if (response.data.data.advice_templates[i].id == response.data.data.advice_templates[i].DoctorAdviceTemplate[y].template_id) {
                  const object = {}
                  const DoctorAdviceTemplate = response.data.data.advice_templates[i].DoctorAdviceTemplate[y]
                  for (const key in DoctorAdviceTemplate) {
                    object[key] = DoctorAdviceTemplate[key]
                  }
                  object['isNoSub'] = 2
                  object['name'] = response.data.data.advice_templates[i].name
                  object['sort'] = response.data.data.advice_templates[i].sort
                  this.adviceTemplates.push(object)


                }
              }
            }
             this.adviceTemplates.sort(this.sortData)
             console.log("列表",this.adviceTemplates)
            // 处理单元格合并的数据
            this.handleSpanTempArr()
          }
        })
      }, isShow(index, row) {
        if (index > 0 && row.name == this.adviceTemplates[index - 1].name) {
          return false
        }
        return true
      }, cancelEditHandle() {
        // this.templateTableVisible = true
        this.templateEditFormVisible = false
      },

      //编辑医嘱
      submitEditTemplate(formName) {

        //  var drug_id = 0
        //  for(let i=0;i<this.all_drug.length;i++){
        //    if(this.templateFormEdit.advice_name == this.all_drug[i].drug_name){
        //       drug_id = this.all_drug[i].id
        //    }
        //  }
        // this.templateFormEdit.drug_id = drug_id

        console.log("编辑子药",this.templateFormEdit)

        this.$refs[formName].validate(valid => {

          this.templateFormEdit.single_dose = parseFloat(this.templateFormEdit.single_dose)
          this.templateFormEdit.prescribing_number = parseFloat(this.templateFormEdit.prescribing_number)

          if (isNaN(this.templateFormEdit.single_dose)) {
             this.templateFormEdit.single_dose = 0
          }
          if (isNaN(this.templateFormEdit.prescribing_number)) {
            this.templateFormEdit.prescribing_number = 0
          }
          if (valid) {
            console.log(this.templateFormEdit)

            if (this.templateFormEdit.frequency_type == 1) {

              this.templateFormEdit.day_count = 0
              this.templateFormEdit.week_days = ''

            } else if (this.templateFormEdit.frequency_type == 2) {
              this.templateFormEdit.day_count = parseInt(this.templateFormEdit.day_count)
              this.templateFormEdit.week_days = ''

            } else if (this.templateFormEdit.frequency_type == 3) {
              this.templateFormEdit.day_count = 0
              this.templateFormEdit.week_days = this.templateFormEdit.weekday.filter(function(s) {
                return s && s.trim()
              }).join(',')
            }

            UpdateAdviceTemplate(this.templateFormEdit.id, this.templateFormEdit,this.templateFormEdit.drug_id).then(
              response => {
                if (response.data.state == 0) {
                  this.$message.error(response.data.msg)
                  return false
                } else {
                  this.$message.success('修改成功')
                  this.templateEditFormVisible = false
                  this.resetForm(formName)
                  var template = response.data.data.template
                  this.adviceTemplates[this.currentIndex].advice_name = template.advice_name
                  this.adviceTemplates[this.currentIndex].advice_desc = template.advice_desc
                  this.adviceTemplates[this.currentIndex].drug_spec = template.drug_spec
                  this.adviceTemplates[this.currentIndex].drug_spec_unit = template.drug_spec_unit
                  this.adviceTemplates[this.currentIndex].single_dose = template.single_dose
                  this.adviceTemplates[this.currentIndex].single_dose_unit = template.single_dose_unit
                  this.adviceTemplates[this.currentIndex].delivery_way = template.delivery_way
                  this.adviceTemplates[this.currentIndex].execution_frequency = template.execution_frequency
                  this.adviceTemplates[this.currentIndex].prescribing_number = template.prescribing_number
                  this.adviceTemplates[this.currentIndex].prescribing_number_unit = template.prescribing_number_unit
                  this.adviceTemplates[this.currentIndex].day_count = template.day_count
                  this.adviceTemplates[this.currentIndex].week_days = template.week_days
                  this.adviceTemplates[this.currentIndex].frequency_type = template.frequency_type
                  // this.adviceTemplates[this.currentIndex].drug_id = template.drug_id
                  this.currentIndex = -1
                  return false
                }
              }
            )
          }
        })
      },
      drugDesc(row) {
        if (row.isNoSub == 2) {
          if (row.drug_spec.length <= 0) {
            return ''
          } else {
            if (row.prescribing_number == 0) {
              return row.drug_spec + '' + row.drug_spec_unit
            } else {
              return row.drug_spec + '' + row.drug_spec_unit + ' * ' + row.prescribing_number + row.prescribing_number_unit
            }
          }
        }
      }, drugDescTwo(row) {
        if (row.drug_spec.length <= 0) {
          return ''
        } else {
          if (row.prescribing_number == 0) {
            return row.drug_spec + '' + row.drug_spec_unit
          } else {
            return row.drug_spec + '' + row.drug_spec_unit + ' * ' + row.prescribing_number + row.prescribing_number_unit
          }
        }
      },
       newRecordActionTwo() {
        this.templateFormTwoVisible = true
      }, deleteRecordActionTwo() {
        if (this.table_current_index_two == -1) {
          this.$message.error('请选择一条医嘱记录')
          return
        }
        this.$confirm('删除记录', '是否删除该医嘱记录', {
          confirmButtonText: '确 定',
          cancelButtonText: '取 消',
          type: 'warning'
        }).then(() => {
          const id = this.adviceTableDataTwo[this.table_current_index_two].id
          const template_id = this.adviceTableDataTwo[this.table_current_index_two].template_id

          DeleteAdviceTemplate(id, template_id).then(response => {
            if (response.data.state == 0) {
              this.$message.error(response.data.msg)
              return false
            } else {
              this.$message.success('删除成功')

              for (let i = 0; i < this.adviceTemplates.length; i++) {
                console.log(this.adviceTemplates[i].id)
                if (this.adviceTemplates[i].id == this.adviceTableDataTwo[this.table_current_index_two].id) {
                  this.adviceTemplates.splice(i, 1)
                }
              }
              this.adviceTableDataTwo.splice(this.table_current_index_two, 1)

              this.table_current_index_two = -1
            }
          })
        }).catch(() => {
        })
      }, modifyRecordActionTwo() {
        if (this.table_current_index_two == -1) {
          this.$message.error('请选择一条医嘱记录')
          return
        }

        this.templateFormEdit = {
          drug_spec: this.adviceTableDataTwo[this.table_current_index_two].drug_spec,
          drug_spec_unit: this.adviceTableDataTwo[this.table_current_index_two].drug_spec_unit,
          advice_name: this.adviceTableDataTwo[this.table_current_index_two].advice_name,
          advice_desc: this.adviceTableDataTwo[this.table_current_index_two].advice_desc,
          single_dose: this.adviceTableDataTwo[this.table_current_index_two].single_dose,
          single_dose_unit: this.adviceTableDataTwo[this.table_current_index_two].single_dose_unit,
          prescribing_number: this.adviceTableDataTwo[this.table_current_index_two].prescribing_number,
          prescribing_number_unit: this.adviceTableDataTwo[this.table_current_index_two].prescribing_number_unit,
          delivery_way: this.adviceTableDataTwo[this.table_current_index_two].delivery_way,
          execution_frequency: this.adviceTableDataTwo[this.table_current_index_two].execution_frequency,
          id: this.adviceTableDataTwo[this.table_current_index_two].id
        }
        this.templateEditFormTwoVisible = true
      }, tableRowClassNameTwo({ row, rowIndex }) {
        // 把每一行的索引放进row
        row.index = rowIndex
      },
      onRowClickTwo(row, event, column) {
        this.table_current_index_two = row.index
      }, cancelHandleTwo() {
        this.templateFormTwoVisible = false
      },
      submitTemplateTwo(formName) {

        this.templateForm['template_id'] = this.current_template_id
        this.templateForm['advice_type'] = this.form.advice_type


        if (this.templateForm.frequency_type == 1) {
          this.templateForm.day_count = 0
          this.templateForm.week_days = ''
        } else if (this.templateForm.frequency_type == 2) {
          this.templateForm.day_count = parseInt(this.templateForm.day_count)
          this.templateForm.week_days = ''
        } else if (this.templateForm.frequency_type == 3) {
          this.templateForm.day_count = 0
          this.templateForm.week_days = this.templateForm.weekday.filter(function(s) {
            return s && s.trim()
          }).join(',')
          this.templateForm.way = 1
        }
        this.templateForm.way = 1
        console.log("编辑模板",this.templateForm)

        // 编辑创建医嘱模版
        CreateSingleAdviceTemplate(this.templateForm).then(response => {
          if (response.data.state == 0) {
            this.$message.error(response.data.msg)
            return false
          } else {
            const source = response.data.data.template
            const objects = {}
            for (const keys in source) {
              objects[keys] = source[keys]
            }
            objects['name'] = this.current_template_name
            objects['isNoSub'] = 2

            this.adviceTableDataTwo.unshift(response.data.data.template)
            this.getAdviceConfig()
            this.resetForm(formName)
            this.templateFormTwoVisible = false
            this.$message.success('添加成功')
            this.templateForm.day_count = ''
            this.templateForm.weekday = []
            this.templateForm.frequency_type = 1

            return false
          }
        })
      }, cancelTableHandleTwo() {
        this.templateTableTwoVisible = false
        this.adviceTableDataTwo = []
      }, cancelEditHandleTwo() {
        this.templateEditFormTwoVisible = false
      },
      submitEditTemplateTwo(formName) {
        this.$refs[formName].validate(valid => {
          this.templateFormEdit.single_dose = parseFloat(this.templateFormEdit.single_dose)
          this.templateFormEdit.prescribing_number = parseFloat(this.templateFormEdit.prescribing_number)

          if (isNaN(this.templateFormEdit.single_dose)) {
            this.templateFormEdit.single_dose = 0
          }
          if (isNaN(this.templateFormEdit.prescribing_number)) {
            this.templateFormEdit.prescribing_number = 0
          }
          if (valid) {
            UpdateAdviceTemplate(this.templateFormEdit.id, this.templateFormEdit).then(
              response => {
                if (response.data.state == 0) {
                  this.$message.error(response.data.msg)
                  return false
                } else {
                  this.$message.success('修改成功')

                  this.templateEditFormTwoVisible = false
                  this.resetForm(formName)
                  var template = response.data.data.template
                  this.adviceTableDataTwo[this.table_current_index_two].advice_name = template.advice_name
                  this.adviceTableDataTwo[this.table_current_index_two].advice_desc = template.advice_desc
                  this.adviceTableDataTwo[this.table_current_index_two].drug_spec = template.drug_spec
                  this.adviceTableDataTwo[this.table_current_index_two].drug_spec_unit = template.drug_spec_unit
                  this.adviceTableDataTwo[this.table_current_index_two].single_dose = template.single_dose
                  this.adviceTableDataTwo[this.table_current_index_two].single_dose_unit = template.single_dose_unit
                  this.adviceTableDataTwo[this.table_current_index_two].delivery_way = template.delivery_way
                  this.adviceTableDataTwo[this.table_current_index_two].execution_frequency = template.execution_frequency
                  this.adviceTableDataTwo[this.table_current_index_two].prescribing_number = template.prescribing_number
                  this.adviceTableDataTwo[this.table_current_index_two].prescribing_number_unit = template.prescribing_number_unit

                  for (let i = 0; i < this.adviceTemplates.length; i++) {
                    if (this.adviceTemplates[i].id == this.adviceTableDataTwo[this.table_current_index_two].id) {
                      this.adviceTemplates[i].advice_name = template.advice_name
                      this.adviceTemplates[i].advice_desc = template.advice_desc
                      this.adviceTemplates[i].drug_spec = template.drug_spec
                      this.adviceTemplates[i].drug_spec_unit = template.drug_spec_unit
                      this.adviceTemplates[i].single_dose = template.single_dose
                      this.adviceTemplates[i].single_dose_unit = template.single_dose_unit
                      this.adviceTemplates[i].delivery_way = template.delivery_way
                      this.adviceTemplates[i].execution_frequency = template.execution_frequency
                      this.adviceTemplates[i].prescribing_number = template.prescribing_number
                      this.adviceTemplates[i].prescribing_number_unit = template.prescribing_number_unit
                    }
                  }
                  return false
                }
              }
            )
          }
        })
      }, merge({ row, column, rowIndex, columnIndex }) {
        if (columnIndex === 0 || columnIndex === 1 || columnIndex === 9) {
          const _row = this.tempArr[rowIndex]
          const _col = _row > 0 ? 1 : 0
          return {
            rowspan: _row,
            colspan: _col
          }
        }
      }, tableRowClassNames({ row, rowIndex }) {
        const arr = this.hoverOrderArr
        for (let i = 0; i < arr.length; i++) {
          if (rowIndex == arr[i]) {
            return 'success-row'
          }
        }
      },
      cellMouseEnter: function(row, column, cell, event) {
        if (column.label == '模版名称') {
          this.sameRowArr.forEach((arr, i) => {
            if (arr.indexOf(row.index) != -1) {
              this.hoverOrderArr = arr
            }
          })
        } else if (column.label == '操作') {
          this.sameRowArr.forEach((arr, i) => {
            if (arr.indexOf(row.index) != -1) {
              this.hoverOrderArr = arr
            }
          })
        } else {
          this.hoverOrderArr = []
        }
      }, cellMouseLeave: function(row, column, cell, event) {
        this.hoverOrderArr = []
      },

      // 修改医嘱模版
       openEdit(index, row) {
        console.log("row22222",row)
        this.hoverOrderArr = []
        this.currentIndex = index
        this.templateFormEdit.drug_spec_unit = row.drug_spec_unit
        this.templateFormEdit.drug_spec = row.drug_spec
        this.templateFormEdit.advice_desc = row.advice_desc
        this.templateFormEdit.advice_name = row.advice_name
        this.templateFormEdit.delivery_way = row.delivery_way
        this.templateFormEdit.execution_frequency = row.execution_frequency
        this.templateFormEdit.prescribing_number = row.prescribing_number
        this.templateFormEdit.prescribing_number_unit = row.prescribing_number_unit
        this.templateFormEdit.single_dose = row.single_dose
        this.templateFormEdit.single_dose_unit = row.single_dose_unit
        this.templateFormEdit.id = row.id
        this.templateFormEdit.parent_id = row.parent_id
        this.templateFormEdit.day_count = row.day_count
        this.templateFormEdit.frequency_type = row.frequency_type
        this.templateFormEdit.weekday = row.week_days.split(',')
        this.templateFormEdit.drug_id = row.drug_id
        this.templateFormEdit.way  = row.way
        this.templateEditFormVisible = true
        if (row.parent_id > 0) {
          this.editDialogTitle = '编辑子药'
          this.edit_advice_name = '子药名称'
        } else {
          this.editDialogTitle = '编辑医嘱'
          this.edit_advice_name = '医嘱内容'
        }
      },
      openDelete(index, row) {
        this.hoverOrderArr = []

        this.$confirm('删除记录', '是否删除该医嘱', {
          confirmButtonText: '确 定',
          cancelButtonText: '取 消',
          type: 'warning'
        }).then(() => {
          const id = row.id
          const template_id = row.template_id
          const parent_id = row.parent_id
          DeleteAdviceTemplate(id, template_id, parent_id).then(response => {
            if (response.data.state == 0) {
              this.$message.error(response.data.msg)
              return false
            } else {
              this.$message.success('删除成功')

              if (row.parent_id > 0) { // 删除子医嘱
                this.adviceTemplates.splice(index, 1)
              } else { // 如果医嘱下面包含子医嘱，删除医嘱和子医嘱
                // 删除子医嘱
                for (let i = 0; i < this.adviceTemplates.length; i++) {
                  if (this.adviceTemplates[i].parent_id == row.id) {
                    this.adviceTemplates.splice(i--, 1)
                  }
                }
                // 删除医嘱
                this.adviceTemplates.splice(index, 1)

                // 当该模版下没有医嘱的时候，创建一个空模版
                let count = 0 // 用于计数
                for (let i = 0; i < this.adviceTemplates.length; i++) {
                  if (this.adviceTemplates[i].template_id == row.template_id) {
                    count = count + 1
                  }
                }
                if (count == 0) {
                  const object = {}
                  object['name'] = row.name
                  object['isNoSub'] = 1
                  object['template_id'] = row.template_id
                  this.adviceTemplates.splice(index, 0, object)
                }
              }

              // 处理单元格合并的数据
              this.handleSpanTempArr()
            }
          })
        }).catch(() => {
        })
      }, openDeleteChild(index, row) {
        this.hoverOrderArr = []

        this.$confirm('删除子药', '是否删除该子药', {
          confirmButtonText: '确 定',
          cancelButtonText: '取 消',
          type: 'warning'
        }).then(() => {
          const id = row.id
          const template_id = row.template_id
          const parent_id = row.parent_id
          DeleteAdviceTemplate(id, template_id, parent_id).then(response => {
            if (response.data.state == 0) {
              this.$message.error(response.data.msg)
              return false
            } else {
              this.$message.success('删除成功')

              if (row.parent_id > 0) { // 删除子医嘱
                this.adviceTemplates.splice(index, 1)
              } else { // 如果医嘱下面包含子医嘱，删除医嘱和子医嘱
                // 删除子医嘱
                for (let i = 0; i < this.adviceTemplates.length; i++) {
                  if (this.adviceTemplates[i].parent_id == row.id) {
                    this.adviceTemplates.splice(i--, 1)
                  }
                }
                // 删除医嘱
                this.adviceTemplates.splice(index, 1)

                // 当该模版下没有医嘱的时候，创建一个空模版
                let count = 0 // 用于计数
                for (let i = 0; i < this.adviceTemplates.length; i++) {
                  if (this.adviceTemplates[i].template_id == row.template_id) {
                    count = count + 1
                  }
                }
                if (count == 0) {
                  const object = {}
                  object['name'] = row.name
                  object['isNoSub'] = 1
                  object['template_id'] = row.template_id
                  this.adviceTemplates.splice(index, 0, object)
                }
              }

              // 处理单元格合并的数据
              this.handleSpanTempArr()
            }
          })
        }).catch(() => {
        })
      },
      openNewChild(index, row) {
        this.hoverOrderArr = []

        this.current_template_id = row.template_id
        this.parent_id = row.id
        this.isAddChild = true
        this.isEdit = false
        this.templateFormVisible = true
        this.dialogTitle = '新增子药'
        this.advice_content_name = '子药名称'
      },
      handleSpanTempArr() {
        this.tempArr = []

        for (let i = 0; i < this.adviceTemplates.length; i++) {
          if (i === 0) {
            this.tempArr.push(1)
            this.pos = 0
          } else {
            // 判断当前元素与上一个元素是否相同
            if (this.adviceTemplates[i].template_id === this.adviceTemplates[i - 1].template_id) {
              this.tempArr[this.pos] += 1
              this.tempArr.push(0)
            } else {
              this.tempArr.push(1)
              this.pos = i
            }
          }
        }

        let sameRowArr = [], sIdx = 0
        this.adviceTemplates.forEach((item, index) => {
          item.index = index
          if (index === 0) {
            sameRowArr.push([index])
          } else {
            if (item.template_id === this.adviceTemplates[index - 1].template_id) {
              sameRowArr[sIdx].push(index)
            } else {
              sIdx = sIdx + 1
              sameRowArr.push([index])
            }
          }
        })
        this.sameRowArr = sameRowArr
      },
       handleUpdateAdviceTemplate(row, index) {

        this.current_template_id = row.template_id
        this.current_template_name = row.name
        this.form.name = row.name
        this.form.advice_type = row.advice_type
        if(row.sort == 0){
          row.sort = ""
        }else{
          this.form.sort = row.sort
        }
        this.templateTableTwoVisible = true
        this.adviceTableDataTwo = []

        for (let i = 0; i < this.adviceTemplates.length; i++) {
          if (this.adviceTemplates[i].template_id == row.template_id) {
            this.adviceTableDataTwo.push(this.adviceTemplates[i])
          }
        }
        this.getAdviceConfig()
      },
      modifyTemplateName() {
        const params = {
          template_name: this.form.name,
          template_id: this.current_template_id,
          sort:this.form.sort,
        }

        updateTemplateName(params).then(response => {
          if (response.data.state == 0) {
            this.$message.error(response.data.msg)
            return false
          } else {
            this.$message.success('修改成功')

            this.templateTableTwoVisible = false

            for (let i = 0; i < this.adviceTemplates.length; i++) {
              if (this.adviceTemplates[i].template_id == this.current_template_id) {
                this.adviceTemplates[i].name = response.data.data.template_name
              }
            }
          }
        })
      }, changeRemind(val) {
        let params = {
          'is_open_remind': val,
        }

        postDoctorAdviceConfig(params).then(response => {
          if (response.data.state == 1) {
            this.is_open_remind = response.data.data.is_open_remind
            if (response.data.data.is_open_remind == 1) {
              this.$message.success('开启成功')
            } else {
              this.$message.success('关闭成功')
            }
          } else {
            this.$message.error(response.data.msg)

          }
        })

      },

      rand(min, max) {
        return Math.floor(Math.random() * (max - min)) + min;
     },
    //
    getSelfMedicalList(){
        const params = {
          patient_id:this.$route.query.patient_id
        }
      getSelfMedicalList(params).then(response=>{
         if (response.data.state == 1) {
            this.arr_drug = []
            var medicalList = response.data.data.private_drug_list
            var base_drug_list = response.data.data.base_drug_list
            var base_drug_cofig = response.data.data.base_drug_config
            var private_drug_cofig = response.data.data.private_drug_config


            if(private_drug_cofig != null&&private_drug_cofig.drug_start == 1) {

              for (let i = 0; i < medicalList.length; i++) {
                if(medicalList[i].drug_specs != null) {
                  for (let a = 0; a < medicalList[i].drug_specs.length; a++) {
                    medicalList[i].drug_specs[a]['type'] = 2
                  }
                }
                let obj = {
                  drug_name: "",
                  drug_desc: "",
                  delivery_way: "",
                  execution_frequency: "",
                  single_dose: "",
                  single_dose_unit: "",
                  prescribing_number: "",
                  prescribing_number_unit: "",
                  type_id: "",
                  type: "",
                  custom_id: "",
                  drug_specs: [],
                  id:"",
                }

                medicalList[i].drug_name = medicalList[i].drug_name + "(自备药)"
                obj.drug_name = medicalList[i].drug_name
                obj.delivery_way = medicalList[i].delivery_way
                obj.execution_frequency = medicalList[i].execution_frequency
                obj.single_dose = medicalList[i].single_dose
                obj.prescribing_number = medicalList[i].prescribing_number
                obj.type_id = medicalList[i].id
                obj.type = 2
                obj.custom_id = this.rand(10000000, 99999999)
                obj.drug_specs = medicalList[i].drug_specs
                obj.id = medicalList[i].id
                this.all_drug.push(obj)
              }
            }


            for (let i = 0; i < base_drug_list.length; i++) {
              if(base_drug_list[i].drug_specs != null) {
                for (let a = 0; a < base_drug_list[i].drug_specs.length; a++) {
                  base_drug_list[i].drug_specs[a]['type'] = 1
                }
              }
                let obj = {
                  drug_name: "",
                  drug_desc: "",
                  delivery_way: "",
                  execution_frequency: "",
                  single_dose: "",
                  single_dose_unit: "",
                  prescribing_number: "",
                  prescribing_number_unit: "",
                  type_id: "",
                  type: "",
                  custom_id: "",
                  drug_specs: [],
                  id:""
                }

                obj.drug_name = base_drug_list[i].drug_name
                obj.delivery_way = base_drug_list[i].delivery_way
                obj.execution_frequency = base_drug_list[i].execution_frequency
                obj.single_dose = base_drug_list[i].single_dose
                obj.prescribing_number = base_drug_list[i].prescribing_number
                obj.type_id = base_drug_list[i].id
                obj.type = 1
                obj.custom_id = this.rand(10000000, 99999999)
                obj.drug_specs = base_drug_list[i].drug_specs
                obj.id = base_drug_list[i].id
                this.all_drug.push(obj)
              }
            }
        })

    },


    changeDrugName(name){
       this.current_drug_name = name
       this.templateForm.advice_desc = ''
      this.drugSpec = []
      for (let i = 0; i < this.all_drug.length; i++) {
        if (this.all_drug[i].drug_name == name) {
            this.drugSpec = this.all_drug[i].drug_specs
          }
       }
    },
    changeDrugDesc(name) {
        this.current_drug_spec = name
        for (let i = 0; i < this.drugSpec.length; i++) {
          if (this.drugSpec[i].drug_spec == name) {
            this.templateForm.advice_desc = this.drugSpec[i].drug_spec
            this.templateForm.prescribing_number = this.drugSpec[i].prescribing_number.toString()
            this.templateForm.single_dose = this.drugSpec[i].single_dose.toString()
            this.templateForm.delivery_way = this.drugSpec[i].delivery_way.toString()
            this.templateForm.execution_frequency = this.drugSpec[i].execution_frequency.toString()
            this.drug_id = this.drugSpec[i].id
            this.src_type = this.drugSpec[i].type
            this.templateForm.drug_id = this.drugSpec[i].id
            this.templateForm.single_dose_unit = this.drugSpec[i].min_unit
            this.templateForm.prescribing_number_unit = this.drugSpec[i].min_unit
            this.templateForm.drug_spec_unit = this.drugSpec[i].min_unit
            this.templateForm.way = this.drugSpec[i].type
          }
        }
      },

      changeDrugNameTwo(name){
        this.current_drug_name = name
        this.templateFormEdit.advice_desc = ''
        this.drugSpec = []
        for (let i = 0; i < this.all_drug.length; i++) {
          if (this.all_drug[i].drug_name == name) {
              this.drugSpec = this.all_drug[i].drug_specs
            }
        }
      },
      hangdleSelectTwo(val){
        console.log("我的223232",val)

        this.templateFormEdit.drug_id = val.id
      },
      changeDrugDescTwo(name) {
        this.current_drug_spec = name
        for (let i = 0; i < this.drugSpec.length; i++) {
          if (this.drugSpec[i].drug_spec == name) {
            this.templateFormEdit.advice_desc = this.drugSpec[i].drug_spec
            this.templateFormEdit.prescribing_number = this.drugSpec[i].prescribing_number.toString()
            this.templateFormEdit.single_dose = this.drugSpec[i].single_dose.toString()
            this.templateFormEdit.delivery_way = this.drugSpec[i].delivery_way.toString()
            this.templateFormEdit.execution_frequency = this.drugSpec[i].execution_frequency.toString()
            this.templateFormEdit.single_dose_unit = this.drugSpec[i].min_unit
            this.templateFormEdit.drug_spec_unit = this.drugSpec[i].drug_spec_unit
            this.templateFormEdit.prescribing_number_unit = this.drugSpec[i].prescribing_number_unit
          }
        }
      },




     querySearch(queryString, cb) {
        console.log('queryString',queryString)
        var restaurants = this.all_drug;
        restaurants.map(item => {
          item.value = item.drug_name
        })
        var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants;
        // 调用 callback 返回建议列表的数据
        console.log('results',results)
        cb(results);
     },

     createFilter(queryString) {
        return (restaurant) => {
          return (restaurant.drug_name.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
        };
     },

     querySearch1(queryString, cb) {
        console.log('queryString',queryString)
        var restaurants = this.drugSpec;
         console.log(restaurants)
        restaurants.map(item => {
          item.value = item.drug_spec
        })
        var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants;
        // 调用 callback 返回建议列表的数据
        console.log('results',results)
        cb(results);
      },
     sortData(a, b) {
       return a.sort - b.sort
     },
     hangleSelectChange(val){
        console.log("==val==",val)
       var tmp = val.drug_specs[0]
       console.log("tmp",tmp)
       this.templateForm.advice_desc=this.drugSpec[0].drug_spec
       this.templateForm.drug_spec_unit=this.drugSpec[0].min_unit
       this.templateForm.prescribing_number=this.drugSpec[0].prescribing_number
       this.templateForm.prescribing_number_unit=this.drugSpec[0].prescribing_number_unit
       this.templateForm.single_dose=this.drugSpec[0].single_dose
       this.templateForm.single_dose_unit=this.drugSpec[0].min_unit
       this.templateForm.delivery_way=this.drugSpec[0].delivery_way
       this.templateForm.execution_frequency=this.drugSpec[0].execution_frequency
       this.templateForm.advice_desc=tmp.dose+tmp.dose_unit+"*"+tmp.min_number+tmp.min_unit+"/"//药品规格
       // console.log("templateForm2222222222",this.templateForm)
       // console.log("all_drug",this.all_drug)
       // console.log("drugSpec2222222",this.drugSpec)
      this.templateForm.way = 1
      this.templateForm.drug_id = val.id
    },
      closeform(){//清除表单数据
        this.templateForm.advice_name=""
        this.templateForm.advice_desc=""
        this.templateForm.drug_spec_unit=""
        this.templateForm.prescribing_number=""
        this.templateForm.prescribing_number_unit=""
        this.templateForm.single_dose=""
        this.templateForm.single_dose_unit=""
        this.templateForm.delivery_way=""
        this.templateForm.execution_frequency=""
      }
    }
  }
</script>
<style>
  .center th .cell {
    text-align: center !important;
  }

  .templateadvicenamedisplay .cell {
    float: left;
    text-align: left;
  }
  .el-table td,
  .el-table th.is-leaf,
  .el-table--border,
  .el-table--group {
    border-color: #d0d3da;
  }
  .el-table--border::after,
  .el-table--group::after,
  .el-table::before {
    background-color: #d0d3da;
  }
</style>