elizebeth/src/xt_pages/outpatientDoctorStation/components/prescriptionTemplateTable.vue

<template>

    <div class="prescriptionTable">
        <el-table v-if="prescription.advices && prescription.advices.length > 0" :data="prescription.advices" border
                  style="width: 99%;" :row-style="{ color: '#303133' }"
                  :header-cell-style="{backgroundColor: 'rgb(245, 247, 250)',color: '#606266'}" highlight-current-row>
            <el-table-column align="center" width="50" label="序号">
                <template slot-scope="scope">
                    <div style="display:flex;align-items:center;">
                        <el-input v-model="scope.row.groupno" placeholder=""></el-input>
                    </div>
                </template>
            </el-table-column>
            <el-table-column align="center" prop="drug_name" label="名称"  width="297" v-if="$store.getters.xt_user.org_id != 10206 && $store.getters.xt_user.org_id != 0 " >
                <template slot-scope="scope"><span :title="scope.row.drug_name">{{ scope.row.drug_name }}</span>
                </template>
            </el-table-column>

          <el-table-column align="center" prop="drug_name" label="名称"  width="297"  v-if="$store.getters.xt_user.org_id == 10206 || $store.getters.xt_user.org_id == 0">
            <template slot-scope="scope"><span :title="scope.row.drug_name">{{ scope.row.drug_name }}{{scope.row.drug.number}}</span>
            </template>
          </el-table-column>

          <el-table-column align="center" prop="single_dose" width="150" label="单次用量">
            <template slot-scope="scope">
              <div style="display:flex;align-items:center;">
                <el-input v-model="scope.row.single_dose" @input="getAllChange(scope)"
                          style="width:50%;"></el-input>
                <!-- <div>{{scope.row.single_dose_unit}}</div> -->
                <el-select v-model="scope.row.single_dose_unit" placeholder="请选择" style="width:50%;"
                           @change="getAllChange(scope)">
                  <el-option :label="scope.row.drug.min_unit" :value="scope.row.drug.min_unit"></el-option>
                  <el-option :label="scope.row.drug.dose_unit"
                             v-if="scope.row.drug.dose_unit != scope.row.drug.min_unit"
                             :value="scope.row.drug.dose_unit"></el-option>
                </el-select>
              </div>
            </template>
          </el-table-column>
            <el-table-column align="center" prop="delivery_way" width="110" label="用法">
                <template slot-scope="scope">
                    <el-select v-model="scope.row.delivery_way" placeholder="请选择">
                        <el-option
                                v-for="(item,index) in drugways"
                                :key="index"
                                :label="item.name"
                                :value="item.name">
                        </el-option>
                    </el-select>
                </template>
            </el-table-column>
            <el-table-column align="center" prop="execution_frequency" width="110" label="频率">
                <template slot-scope="scope">
                    <el-select v-model="scope.row.execution_frequency" placehold er="请选择" @change="getAllChange(scope)">
                        <el-option
                                v-for="item,index in efs"
                                :key="index"
                                :label="item.name"
                                :value="item.name">
                        </el-option>
                    </el-select>
                </template>
            </el-table-column>


            <el-table-column align="center" prop="day" width="90" label="天数">
                <template slot-scope="scope">
                    <div style="display:flex;align-items:center;">
                        <el-input v-model="scope.row.day" @input="getAllChange(scope)" placeholder=""></el-input>
                        {{'天'}}
                    </div>
                </template>
            </el-table-column>

            <el-table-column align="center" prop="prescribing_number" width="120" label="总量">
                <template slot-scope="scope">
                    <div style="display:flex;align-items:center;">
                        <el-input v-model="scope.row.prescribing_number" style="width:50%"
                                  @input="changePrescribingNumber(scope)" placeholder=""></el-input>
                        <!-- <div> {{scope.row.prescribing_number_unit}}</div> -->
                        <el-select v-model="scope.row.prescribing_number_unit" placeholder="请选择" style="width:50%;"
                                   @change="getAllChange(scope)">
                            <el-option :label="scope.row.drug.min_unit" :value="scope.row.drug.min_unit"></el-option>
                            <el-option :label="scope.row.drug.max_unit"
                                       v-if="scope.row.drug.min_unit != scope.row.drug.max_unit"
                                       :value="scope.row.drug.max_unit"></el-option>
                        </el-select>
                    </div>
                </template>
            </el-table-column>
            <el-table-column align="center" prop="retail_price" width="100" label="单价">
                <template slot-scope="scope">
                    <div style="display:flex;align-items:center;">
                        <el-input v-model="scope.row.retail_price" placeholder="" readonly></el-input>
                        <div>{{'元'}}</div>
                    </div>

                </template>
            </el-table-column>
            <el-table-column align="center" prop="remark" width="100" label="备注">
                <template slot-scope="scope">
                    <el-input v-model="scope.row.remark" :title="scope.row.remark" placeholder=""></el-input>
                </template>
            </el-table-column>

            <el-table-column align="center" prop="remark" width="80" label="推送频率">
                <template slot-scope="scope">
                    <div v-if="scope.row.frequency_type == 1">{{'每次必推'}}</div>
                    <div v-if="scope.row.frequency_type == 2">{{scope.row.day_count}}天/次</div>
                    <div v-if="scope.row.frequency_type == 3">{{scope.row.week_day}}</div>

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


            <el-table-column align="center" width="140" prop="name" label="操作">
                <template slot-scope="scope">
                    <!--<i class="el-icon-delete" @click="deleteDrug(scope.$index, scope.row)"></i>-->
                    <el-button size="mini" type="primary" @click="handleEdit(scope.row,scope.$index)">推送</el-button>
                    <el-button size="mini" type="danger" @click="deleteDrug(scope.row,scope.$index)">删除</el-button>
                </template>
            </el-table-column>
        </el-table>

        <el-table v-if="prescription.project &&prescription.project.length > 0" :data="prescription.project" border
                  style="width: 99%;" :row-style="{ color: '#303133' }"
                  :header-cell-style="{backgroundColor: 'rgb(245, 247, 250)',color: '#606266'}" highlight-current-row>
            <el-table-column align="center" width="40" label="序号">
              <template slot-scope="scope">
                {{scope.$index+1}}
              </template>
            </el-table-column>
            <el-table-column align="center" prop="project_name" label="名称" v-if="$store.getters.xt_user.org_id != 10206 && $store.getters.xt_user.org_id != 0">
                <template slot-scope="scope"><span :title="scope.row.project_name">{{ scope.row.project_name }}</span>
                </template>
            </el-table-column>
          <el-table-column align="center" prop="project_name" label="名称" v-if="$store.getters.xt_user.org_id == 10206 || $store.getters.xt_user.org_id == 0">
            <template slot-scope="scope"><span :title="scope.row.project_name">{{ scope.row.project_name }}{{scope.row.number}}</span>
            </template>
          </el-table-column>

            <el-table-column align="center" prop="statistical_classification" width="100" label="组">
                <template slot-scope="scope">{{scope.row.type ==
                    2?getGroup(scope.row.statistical_classification):'耗材'}}
                </template>
            </el-table-column>
            <el-table-column align="center" prop="single_dose" width="80" label="单次用量">
                <template slot-scope="scope">
                    <div style="display:flex;align-items:center;">
                        <el-input v-model="scope.row.single_dose" @input="getProjectSingleDose(scope)"
                                  placeholder=""></el-input>
                        <div>{{scope.row.unit}}</div>
                      <div v-if="scope.row.unit == ''">{{scope.row.good_info.default_count_unit}}</div>
                    </div>

                </template>
            </el-table-column>
            <el-table-column align="center" prop="delivery_way" width="80" label="用法">
                <template slot-scope="scope">
                    <el-autocomplete
                            style="width:100%;"
                            class="inline-input"
                            v-model="scope.row.delivery_way"
                            :fetch-suggestions="querySearch2"
                            placeholder="请输入内容"
                    ></el-autocomplete>
                </template>
            </el-table-column>
            <el-table-column align="center" prop="execution_frequency" width="80" label="频率">
                <template slot-scope="scope">
                    <el-input v-model="scope.row.execution_frequency" placeholder=""></el-input>
                </template>
            </el-table-column>
            <el-table-column align="center" prop="number_days" width="70" label="天数">
                <template slot-scope="scope">
                    <div style="display:flex;align-items:center;">
                        <el-input v-model="scope.row.number_days" @input="getProjectDay(scope)"
                                  placeholder=""></el-input>
                        <div>{{'天'}}</div>
                    </div>
                </template>
            </el-table-column>
            <el-table-column align="center" prop="total" width="70" label="总量">
                <template slot-scope="scope">
                    <div style="display:flex;align-items:center;">
                        <el-input v-model="scope.row.total" style="width:60%" placeholder=""></el-input>
                        <div>{{scope.row.unit}}</div>
                      <div v-if="scope.row.unit == ''">{{scope.row.good_info.default_count_unit}}</div>
                    </div>
                </template>
            </el-table-column>
            <el-table-column align="center" prop="name" width="70" label="单价">
                <template slot-scope="scope">
                    <div style="display:flex;align-items:center;">
                        <el-input v-model="scope.row.price" placeholder="" readonly></el-input>
                        <div>{{'元'}}</div>
                    </div>

                </template>
            </el-table-column>
            <el-table-column align="center" prop="name" width="50" label="备注">
                <template slot-scope="scope">
                    <el-input v-model="scope.row.remark" :title="scope.row.remark"></el-input>
                </template>
            </el-table-column>
            <el-table-column align="center" prop="remark" width="70" label="推送频率">
                <template slot-scope="scope">
                    <div v-if="scope.row.frequency_type == 1">{{'每次必推'}}</div>
                    <div v-if="scope.row.frequency_type == 2">{{scope.row.day_count}}天/次</div>
                    <div v-if="scope.row.frequency_type == 3">{{scope.row.week_day}}</div>

                </template>
            </el-table-column>
            <el-table-column align="center" width="140" prop="name" label="操作">
                <template slot-scope="scope">
                    <el-button size="mini" type="primary" @click="handleEdit(scope.row,scope.$index)">推送</el-button>
                    <el-button size="mini" type="danger" @click="deleteProject(scope.row,scope.$index)">删除
                    </el-button>
                    <!--<i class="el-icon-delete" @click="deleteProject(scope.row,scope.$index)"></i>-->
                    <!--<button class="el-icon-delete" @click="deleteProject(scope.row,scope.$index)">删除</>-->

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

        <div class="additionalBox">
            <div class="additionalOne" v-for="(item,index) in prescription.addition" :key="index">
                <span :title="item.item_name">{{item.item_name}}</span>
                <el-input v-model="item.price" placeholder="" style="width:50px;"></el-input>
                共
                <el-input v-model="item.count" placeholder="" style="width:50px;"></el-input>
                次
                <i class="el-icon-delete deleteIcon" @click="delAddition(index,item)"></i>
            </div>
        </div>


        <div>
            <el-dialog title="推送频率设置" :visible.sync="templateFormVisible" width="854px">
                <el-form
                        ref="templateForm"
                        label-width="90px"
                >
                    <el-row>
                        <el-col :span="24" >
                            <el-form-item label="周期提醒 :">
                                <el-radio-group v-model="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="frequency_type == 2">
                            <el-form-item prop="day_count">
                                <el-input style="width: 50px" v-model="day_count"></el-input>&nbsp;
                                天/一次
                            </el-form-item>
                        </el-col>

                        <el-col :span="24" v-if="frequency_type == 3">
                            <el-form-item prop="weekday">
                                <el-checkbox-group v-model="week_days">
                                    <el-checkbox label="周一" name="周一" key="1">周一</el-checkbox>
                                    <el-checkbox label="周二" name="周二" key="2">周二</el-checkbox>
                                    <el-checkbox label="周三" name="周三" key="3">周三</el-checkbox>
                                    <el-checkbox label="周四" name="周四" key="4">周四</el-checkbox>
                                    <el-checkbox label="周五" name="周五" key="5">周五</el-checkbox>
                                    <el-checkbox label="周六" name="周六" key="6">周六</el-checkbox>
                                    <el-checkbox label="周日" name="周日" key="7">周日</el-checkbox>
                                </el-checkbox-group>
                            </el-form-item>
                        </el-col>

                    </el-row>
                </el-form>
                <div slot="footer" class="dialog-footer">
                    <el-button @click="templateFormVisible = false">取消</el-button>
                    <el-button type="primary" @click="submitTemplate()">保 存</el-button>
                </div>
            </el-dialog>
        </div>


    </div>
</template>

<script>
  import { getDictionaryDataConfig } from '@/utils/data'
  import { delHisAddition, delHisAdvice, delHisProject, getInitData } from '@/api/his/his'
  import { delHisPrescriptionAdviceTemplate, delHisPrescriptionProjectTemplate } from '@/api/his/his_config'

  export default {
    props: {
      preDrugs: Array,
      activeType: Number,
      addtions_charge: Array,
      prescription: {
        type: Object,
        default: function() {
          return {
            name: '',
            advices: [],
            project: [],
            drugways: [],
            efs: []
          }
        }
      }
    },
    data() {
      return {
        week_days: [],

        current_row: null,
        current_index: 0,
        templateFormVisible: false,
        frequency_type: 1,
        day_count: 0,
        advices: [],
        tableData: [],
        newoptions: [{
          value: '1',
          label: '1'
        }, {
          value: '2',
          label: '2'
        }, {
          value: '3',
          label: '3'
        }, {
          value: '4',
          label: '4'
        }, {
          value: '5',
          label: '5'
        }],
        value: '1',
        input: 1
      }
    },

    methods: {
      submitTemplate() {
        console.log(this.current_index)

        console.log( this.prescription.project[this.current_index])
        if (this.prescription.advices && this.prescription.advices.length > 0 && this.prescription.project && this.prescription.project.length == 0) {
          this.prescription.advices[this.current_index].frequency_type = this.frequency_type
          this.prescription.advices[this.current_index].day_count = this.day_count
          this.prescription.advices[this.current_index].week_day = this.week_days.join(",")

        }

        if (this.prescription.advices && this.prescription.advices.length == 0 && this.prescription.project && this.prescription.project.length > 0) {
          this.prescription.project[this.current_index].frequency_type = this.frequency_type
          this.prescription.project[this.current_index].day_count = this.day_count
          this.prescription.project[this.current_index].week_day =this.week_days.join(",")
        }
        this.templateFormVisible = false
      },
      handleEdit(row, index) {
        this.current_row = row
        this.current_index = index
        this.frequency_type = this.current_row.frequency_type
        this.day_count = this.current_row.day_count
        this.week_days = this.current_row.week_day.split(",")
        this.templateFormVisible = true


      },
      lili(data){
        console.log("data",this.prescription)

      },
      createFilter(queryString) {
        return (restaurant) => {
          return (restaurant.name.toLowerCase().indexOf(queryString.toLowerCase()) === 0)
        }
      },
      querySearch2(queryString, cb) {
        var restaurants = this.getDictionaryDataConfig('system', 'project_use')
        restaurants.map(item => {
          item.value = item.name
        })
        var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants
        // 调用 callback 返回建议列表的数据
        cb(results)
      },
      delAddition(index, addition) {
        this.$confirm('附加费删除后不可恢复，是否确认删除', '删除', {
          confirmButtonText: '确 定',
          cancelButtonText: '取 消',
          type: 'warning'
        }).then(() => {
          this.$nextTick(function() {
            if (addition.id == 0) {
              this.prescription.addition.splice(index, 1)
            } else {
              let params = {
                'id': addition.id
              }
              delHisAddition(params).then(response => {
                if (response.data.state == 0) {
                  this.$message.error(response.data.msg)
                  return false
                } else {
                  var temp2 = this.deepClone(this.prescription.addition)
                  temp2.splice(index, 1)
                  this.prescription.addition = temp2
                  this.$message.success(response.data.data.msg)
                }
              })
            }
          })

        })
          .catch(() => {
          })

      },
      getInitData() {
        getInitData().then(response => {
          if (response.data.state == 0) {
            this.$message.error(response.data.msg)
            return false
          } else {
            this.drugways = response.data.data.drugways
            this.efs = response.data.data.efs
          }
        })

      },
      deleteDrug: function(row, index) {

        this.$confirm('药品删除后不可恢复，是否确认删除', '删除', {
          confirmButtonText: '确 定',
          cancelButtonText: '取 消',
          type: 'warning'
        }).then(() => {
          this.$nextTick(function() {
            if (row.advice_id == 0) {
              this.prescription.advices.splice(index, 1)
            } else {
              let params = {
                'id': row.advice_id
              }
              console.log(row)

              console.log(params)
              delHisPrescriptionAdviceTemplate(params).then(response => {
                if (response.data.state == 0) {
                  this.$message.error(response.data.msg)
                  return false
                } else {
                  var temp2 = this.deepClone(this.prescription.advices)
                  temp2.splice(index, 1)
                  this.prescription.advices = temp2
                  this.$message.success(response.data.data.msg)
                }
              })

            }

          })

        })
          .catch(() => {
          })

      }, deepClone(source) {
        if (!source && typeof source !== 'object') {
          throw new Error('error arguments', 'shallowClone')
        }
        const targetObj = source.constructor === Array ? [] : {}
        Object.keys(source).forEach((keys) => {
          if (source[keys] && typeof source[keys] === 'object') {
            targetObj[keys] = this.deepClone(source[keys])
          } else {
            targetObj[keys] = source[keys]
          }
        })
        return targetObj
      },

      setNewData: function(data) {
        this.prescription = data

        // this.prescription.advices = data.advices
      },
      getDictionaryDataConfig(module, filed_name) {
        return getDictionaryDataConfig(module, filed_name)
      },
      getGroup(id) {
        var name = ''
        var statistics_category = getDictionaryDataConfig('system', 'statistics_category')
        console.log('2235', statistics_category)
        for (let i = 0; i < statistics_category.length; i++) {
          if (id == statistics_category[i].id) {
            name = statistics_category[i].name
          }
        }
        return name
      },
      deleteProject(row, i) {
        if (this.prescription.order_status == 2) {
          this.$message.error('该处方已经结算，无法删除')
          return
        }
        this.$confirm('项目删除后不可恢复，是否确认删除', '删除', {
          confirmButtonText: '确 定',
          cancelButtonText: '取 消',
          type: 'warning'
        }).then(() => {
          if (row.id == 0) {
            this.prescription.project.splice(i, 1)

          } else {
            let params = {
              'id': row.id
            }
            delHisPrescriptionProjectTemplate(params).then(response => {
              if (response.data.state == 0) {
                this.$message.error(response.data.msg)
                return false
              } else {
                for (let i = 0; i < this.prescription.project.length; i++) {
                  if (this.prescription.project[i].id == row.id) {
                    this.prescription.project.splice(i, 1)
                  }
                }
                this.$message.success(response.data.data.msg)
              }
            })
          }
        })
          .catch(() => {
          })

      },
      getAllChange(scope) {
        if (scope.row.drug.min_unit == scope.row.single_dose_unit) {
          if (scope.row.prescribing_number_unit == scope.row.drug.min_unit) {
            console.log(1)
            scope.row.prescribing_number = scope.row.single_dose * this.getNum(scope.row.execution_frequency) * scope.row.day
          } else {
            console.log(12)
            scope.row.prescribing_number = Math.ceil((scope.row.single_dose * this.getNum(scope.row.execution_frequency)) * scope.row.day / scope.row.drug.min_number)
          }
        } else {
          if (scope.row.prescribing_number_unit == scope.row.drug.min_unit) {
            console.log(123)
            scope.row.prescribing_number = Math.ceil((scope.row.single_dose * this.getNum(scope.row.execution_frequency) * scope.row.day) / scope.row.drug.dose)
          } else {
            console.log(1234)
            scope.row.prescribing_number = Math.ceil((scope.row.single_dose * this.getNum(scope.row.execution_frequency) * scope.row.day) / scope.row.drug.dose / scope.row.drug.min_number)
          }
        }
        if (scope.row.prescribing_number == 0) {
          scope.row.prescribing_number = 1
        }
        // if(scope.row.prescribing_number_unit == scope.row.drug.min_unit){
        //   // scope.row.retail_price = scope.row.drug.min_price * scope.row.prescribing_number
        //   if(scope.row.prescribing_number > scope.row.drug.total){
        //     this.$message.error(scope.row.drug_name + '库存不足')
        //   }
        // }else{
        //   if((parseInt(scope.row.prescribing_number) * scope.row.drug.min_number) > scope.row.drug.total){
        //     this.$message.error(scope.row.drug_name + '库存不足')
        //   }
        //   // scope.row.retail_price = scope.row.drug.retail_price * scope.row.prescribing_number
        // }

      },
      changePrescribingNumber(scope) {
        // if(scope.row.prescribing_number_unit == scope.row.drug.min_unit){
        //   if(parseInt(scope.row.prescribing_number) > scope.row.drug.total){
        //     this.$message.error(scope.row.drug_name + '库存不足')
        //   }
        // }else{
        //   if((parseInt(scope.row.prescribing_number) * scope.row.drug.min_number) > scope.row.drug.total){
        //     this.$message.error(scope.row.drug_name + '库存不足')
        //   }
        // }
      },      getAllChange(scope) {
        if (scope.row.drug.min_unit == scope.row.single_dose_unit) {
          if (scope.row.prescribing_number_unit == scope.row.drug.min_unit) {
            console.log(1)
            scope.row.prescribing_number = scope.row.single_dose * (scope.row.execution_frequency ? this.getNum(scope.row.execution_frequency) : 1) * (scope.row.day ? scope.row.day : 1)
          } else {
            console.log(12)
            scope.row.prescribing_number = Math.ceil((scope.row.single_dose * (scope.row.execution_frequency ? this.getNum(scope.row.execution_frequency) : 1)) * (scope.row.day ? scope.row.day : 1) / scope.row.drug.min_number)
          }
        } else {
          if (scope.row.prescribing_number_unit == scope.row.drug.min_unit) {
            console.log(123)
            scope.row.prescribing_number = Math.ceil((scope.row.single_dose * (scope.row.execution_frequency ? this.getNum(scope.row.execution_frequency) : 1) * (scope.row.day ? scope.row.day : 1)) / scope.row.drug.dose)
          } else {
            console.log(1234)
            scope.row.prescribing_number = Math.ceil((scope.row.single_dose * (scope.row.execution_frequency ? this.getNum(scope.row.execution_frequency) : 1) * (scope.row.day ? scope.row.day : 1)) / scope.row.drug.dose / scope.row.drug.min_number)
          }
        }
        if (scope.row.prescribing_number == 0) {
          scope.row.prescribing_number = 1
        }
        if (scope.row.prescribing_number_unit == scope.row.drug.min_unit) {
          // scope.row.retail_price = scope.row.drug.min_number / scope.row.retail_price
          if (scope.row.prescribing_number > scope.row.drug.total) {
            if(this.$store.getters.xt_user.org_id != 10206) {
              this.$message.error(scope.row.drug_name + '库存不足')
            }
          }
        } else {
          if ((parseInt(scope.row.prescribing_number) * scope.row.drug.min_number) > scope.row.drug.total) {
            if(this.$store.getters.xt_user.org_id != 10206) {
              this.$message.error(scope.row.drug_name + '库存不足')
            }
          }
          // scope.row.retail_price = scope.row.drug.retail_price * scope.row.prescribing_number
        }

      },

      getSingleDose(scope) {
        this.prescription.advices[scope.$index].prescribing_number = scope.row.single_dose * scope.row.day
      },
      getDay(scope) {
        this.prescription.advices[scope.$index].prescribing_number = scope.row.single_dose * scope.row.day
      },
      getProjectSingleDose(scope) {
        this.prescription.project[scope.$index].total = scope.row.single_dose * scope.row.number_days
        if (this.prescription.project[scope.$index].total == 0) {
          this.prescription.project[scope.$index].total = 1
        }
      },
      getProjectDay(scope) {
        this.prescription.project[scope.$index].total = scope.row.single_dose * scope.row.number_days
        if (this.prescription.project[scope.$index].total == 0) {
          this.prescription.project[scope.$index].total = 1
        }
      }
    }, mounted() {
      this.getInitData()

    },
    watch: {
      // "prescription.advices":{
      //   handler(newVal,oldVal){
      //     newVal.map(item => {
      //       item.prescribing_number = item.single_dose * item.day
      //       if(item.single_dose != oldVal[index].single_dose || item.number_days != oldVal[index].number_days){
      //         item.total = item.single_dose * item.number_days
      //       }

      //     })
      //   },
      //   deep:true
      // },
      // "prescription.project":{
      //   handler(newVal,oldVal){
      //     newVal.map((item,index) => {
      //       if(item.single_dose != oldVal[index].single_dose || item.number_days != oldVal[index].number_days){
      //         item.total = item.single_dose * item.number_days
      //       }

      //     })
      //   },
      //   deep:true
      // }
    }

  }
</script>

<style lang="scss">
    .prescriptionTable {

    .el-input__inner {
        padding: 0 5px;
    }

    .additionalBox {
        margin-top: 20px;
        display: flex;
        flex-wrap: wrap;

    .additionalOne {
        margin-right: 20px;
        margin-bottom: 10px;
        display: flex;
        align-items: center;

    > span {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        width: 80px;
        display: inline-block;
        font-size: 14px;
    }

    }
    .deleteIcon {
        color: red;
        margin-left: 5px;
    }

    }
    .el-table th .cell, .el-table td .cell {
        padding: 0 2px;
        white-space: pre-line;
    }

    .el-icon-delete {
        color: red;
    }

    }
</style>