SOURCE

var Main = {
 data () {
    return {
      editableTabsValue: '0',
      tableStyle: {

      },
      dialogSubmitVisible: false,
      isShowPaitentDialog: false,
      isShowConfirmDialog: false,
      editableTabs: [],
      tabIndex: 0,
      JpType: '', // 煎配方式
      MedUsage: '', // 用法
      MedPerDay: '', // 频次
      MedPerDosQty: '', // 用量
      isPatientPopoverShow: false,
      patient: {
      },
      patientList: [
        {
          'PatientID': '1000',
          'PatientCode': '1000',
          'PatientName': '蒋洋',
          'Sex': '男',
          'Age': '39',
          'PhoneNumber': '12345678901',
          'PatientAddress': '南京市雨花抬区1号',
          'IDCard': '43060326548565545'
        },
        {
          'PatientID': '1000',
          'PatientCode': '1000',
          'PatientName': '万明',
          'Sex': '男',
          'Age': '39',
          'PhoneNumber': '12345678901',
          'PatientAddress': '南京市雨花抬区1号',
          'IDCard': '43060326548565545'
        },
        {
          'PatientID': '1000',
          'PatientCode': '1000',
          'PatientName': '杜霞',
          'Sex': '男',
          'Age': '39',
          'PhoneNumber': '12345678901',
          'PatientAddress': '南京市雨花抬区1号',
          'IDCard': '43060326548565545'
        },
        {
          'PatientID': '1000',
          'PatientCode': '1000',
          'PatientName': '常静',
          'Sex': '男',
          'Age': '39',
          'PhoneNumber': '12345678901',
          'PatientAddress': '南京市雨花抬区1号',
          'IDCard': '43060326548565545'
        }
      ],
      formRecord: {
        BMD: ''

      },
      preChinaOptions: {
        title: '',
        page: false,
        border: true,
        align: 'center',
        // dialogType:"drawer",
        // dialogFullscreen: true,
        dialogFootAlign: 'center',
        dialogWidth: '70%',
        menuAlign: 'center',
        column: [
          {
            label: '药品编码',
            prop: 'ProductCode',
            formslot: true

          },
          {
            label: '药品名称',
            prop: 'ProductName',
            span: 16,
            formWidth: '200px',
            addDisabled: true,
            rules: [
              { required: true, message: '请输入药品名称', trigger: 'blur' }
            ]
          },
          {
            label: '规格',
            prop: 'ProductSpec',
            span: 16,
            addDisabled: true
          },
          {
            label: '单位',
            prop: 'UOM',
            span: 16,
            addDisabled: true
          },
          {
            label: '数量',
            prop: 'Qty',
            span: 16,
            rules: [
              { required: true, message: '请输入药品名称', trigger: 'blur' }
            ]
          },
          {
            label: '医生嘱托',
            prop: 'DoctorEntrust',
            type: 'textarea',
            formslot: false
          },
          {
            label: '生产厂家',
            prop: 'Manufacturer',
            addDisplay: false
          },
          {
            label: '单价',
            prop: 'PriceList',
            addDisplay: false
          },
          {
            label: '金额',
            addDisplay: false,
            prop: 'PresAmount'
          }
        ]
      },
      preWestOptions: {
        title: '',
        page: false,
        border: true,
        align: 'center',
        // dialogType:"drawer",
        // dialogFullscreen: true,
        dialogFootAlign: 'center',
        dialogWidth: '50%',
        menuAlign: 'center',
        column: [
          {
            label: '药品编码',
            prop: 'ProductCode',
            formslot: true
          },
          {
            label: '药品名称',
            prop: 'ProductName',
            span: 16,
            formWidth: '200px',
            addDisabled: true,
            rules: [
              { required: true, message: '请选择药品', trigger: 'blur' }
            ]
          },
          {
            label: '规格',
            prop: 'ProductSpec',
            span: 16,
            addDisabled: true
          },
          {
            label: '单位',
            prop: 'UOM',
            span: 16,
            addDisabled: true
          },
          {
            label: '数量',
            prop: 'Qty',
            span: 16,
            rules: [
              { required: true, message: '请输入数量', trigger: 'blur' }
            ]
          },
          {
            label: '用法',
            prop: 'MedUsageName',
            span: 16,
            formslot: true
          },
          {
            label: '频次',
            prop: 'MedPerDayName',
            span: 16,
            formslot: true
          },
          {
            label: '医生嘱托',
            prop: 'DoctorEntrust',
            type: 'textarea',
            formslot: false
          },
          {
            label: '生产厂家',
            prop: 'Manufacturer',
            addDisplay: false
          },
          {
            label: '单价',
            prop: 'PriceList',
            addDisplay: false
          },
          {
            label: '金额',
            addDisplay: false,
            prop: 'PresAmount'
          }
        ]
      },
      page: {
        currentPage: 1,
        total: 0,
        pageSize: 20
      },
      preTabData: {
      },
      preListCach: [],
      visible: false,
      curentRow: {},
      chemistList: [],
      number: 2,
      chemistCach: [
        {
          'ProductID': '1021516',
          'ProductCode': 'jszj-1001001',
          'ProductName': '阿莫西林胶囊',
          'ProductSpec': '0.25g*20粒',
          'ProductTypeName': '西药1',
          'ProductValue': 'amxljn',
          'ProductArea': '',
          'Manufacturer': '华北制药股份有限公司',
          'ProductCategory': '',
          'PriceList': '2.3',
          'UOM': '盒',
          'MedPerDosQty': '0.5',
          'MedPerDosUOM': 'g',
          'MedPerDosUOMName': 'g',
          'MedPerDay': 'TID',
          'MedPerDayName': '每日三次',
          'MedUsage': 'PO',
          'MedUsageName': '口服',
          'PackageQty': '5'
        },
        {
          'ProductID': '1021517',
          'ProductCode': 'jszj-1001002',
          'ProductName': '骨康胶囊',
          'ProductSpec': '0.4g*12粒/板*4板/盒',
          'ProductTypeName': '西药1',
          'ProductValue': 'gkjn',
          'ProductArea': '',
          'Manufacturer': '贵州维康子帆药业股份有限公司 ',
          'ProductCategory': '',
          'PriceList': '41.03',
          'UOM': '盒',
          'MedPerDosQty': '1.2',
          'MedPerDosUOM': 'g',
          'MedPerDosUOMName': 'g',
          'MedPerDay': 'TID',
          'MedPerDayName': '每日三次',
          'MedUsage': 'PO',
          'MedUsageName': '口服',
          'PackageQty': '19'
        },
        {
          'ProductID': '1021518',
          'ProductCode': 'jszj-1001003',
          'ProductName': '金嗓开音丸',
          'ProductSpec': '360丸（水蜜丸）',
          'ProductTypeName': '中成药1',
          'ProductValue': 'jskyw',
          'ProductArea': '',
          'Manufacturer': '西安碑林药业股份有限公司 ',
          'ProductCategory': '',
          'PriceList': '16.2',
          'UOM': '瓶',
          'MedPerDosQty': '60',
          'MedPerDosUOM': '粒',
          'MedPerDosUOMName': '粒',
          'MedPerDay': 'BID',
          'MedPerDayName': '每日两次',
          'MedUsage': 'PO',
          'MedUsageName': '口服',
          'PackageQty': '360'
        },
        {
          'ProductID': '1021521',
          'ProductCode': 'jszj-1001004',
          'ProductName': '恩替卡韦片（博路定）',
          'ProductSpec': '0.5mg*7片',
          'ProductTypeName': '西药1',
          'ProductValue': 'etqwpbld',
          'ProductArea': '',
          'Manufacturer': '上海施贵宝',
          'ProductCategory': '',
          'PriceList': '191.99',
          'UOM': '盒',
          'MedPerDosQty': '0.5',
          'MedPerDosUOM': 'mg',
          'MedPerDosUOMName': 'mg',
          'MedPerDay': 'QD',
          'MedPerDayName': '每日一次',
          'MedUsage': 'PO',
          'MedUsageName': '口服',
          'PackageQty': '4'
        },
        {
          'ProductID': '1021524',
          'ProductCode': 'jszj-1001005',
          'ProductName': '心可舒片',
          'ProductSpec': '0.3g*48片',
          'ProductTypeName': '中成药1',
          'ProductValue': 'xksp',
          'ProductArea': '',
          'Manufacturer': '山东沃华',
          'ProductCategory': '',
          'PriceList': '24.1',
          'UOM': '盒',
          'MedPerDosQty': '1.24',
          'MedPerDosUOM': 'g',
          'MedPerDosUOMName': 'g',
          'MedPerDay': 'TID',
          'MedPerDayName': '每日三次',
          'MedUsage': 'PO',
          'MedUsageName': '口服',
          'PackageQty': '14'
        },
        {
          'ProductID': '1021527',
          'ProductCode': 'jszj-1001006',
          'ProductName': '胆宁片（基）（低',
          'ProductSpec': '0.36g*100片',
          'ProductTypeName': '中成药1',
          'ProductValue': 'dnpjd',
          'ProductArea': '',
          'Manufacturer': '上海和黄药业有限公司',
          'ProductCategory': '',
          'PriceList': '26.09',
          'UOM': '瓶',
          'MedPerDosQty': '1.8',
          'MedPerDosUOM': 'g',
          'MedPerDosUOMName': 'g',
          'MedPerDay': 'TID',
          'MedPerDayName': '每日三次',
          'MedUsage': 'PO',
          'MedUsageName': '口服',
          'PackageQty': '36'
        },
        {
          'ProductID': '1021528',
          'ProductCode': 'jszj-1001007',
          'ProductName': '血脂康胶囊',
          'ProductSpec': '0.3g*24粒',
          'ProductTypeName': '中成药1',
          'ProductValue': 'xzkjn',
          'ProductArea': '',
          'Manufacturer': '北大维信',
          'ProductCategory': '',
          'PriceList': '30',
          'UOM': '盒',
          'MedPerDosQty': '0.6',
          'MedPerDosUOM': 'g',
          'MedPerDosUOMName': 'g',
          'MedPerDay': 'BID',
          'MedPerDayName': '每日两次',
          'MedUsage': 'PO',
          'MedUsageName': '口服',
          'PackageQty': '7'
        },
        {
          'ProductID': '1021528',
          'ProductCode': 'jszj-1001007',
          'ProductName': '血脂康胶囊',
          'ProductSpec': '0.3g*24粒',
          'ProductTypeName': '中成药1',
          'ProductValue': 'xzkjn',
          'ProductArea': '',
          'Manufacturer': '北大维信',
          'ProductCategory': '',
          'PriceList': '30',
          'UOM': '盒',
          'MedPerDosQty': '0.6',
          'MedPerDosUOM': 'g',
          'MedPerDosUOMName': 'g',
          'MedPerDay': 'BID',
          'MedPerDayName': '每日两次',
          'MedUsage': 'PO',
          'MedUsageName': '口服',
          'PackageQty': '7'
        },
        {
          'ProductID': '1021528',
          'ProductCode': 'jszj-1001007',
          'ProductName': '血脂康胶囊',
          'ProductSpec': '0.3g*24粒',
          'ProductTypeName': '中成药1',
          'ProductValue': 'xzkjn',
          'ProductArea': '',
          'Manufacturer': '北大维信',
          'ProductCategory': '',
          'PriceList': '30',
          'UOM': '盒',
          'MedPerDosQty': '0.6',
          'MedPerDosUOM': 'g',
          'MedPerDosUOMName': 'g',
          'MedPerDay': 'BID',
          'MedPerDayName': '每日两次',
          'MedUsage': 'PO',
          'MedUsageName': '口服',
          'PackageQty': '7'
        },
        {
          'ProductID': '8787878',
          'ProductCode': 'jszj-1001008',
          'ProductName': '血脂康胶囊',
          'ProductSpec': '0.3g*24粒',
          'ProductTypeName': '中成药1',
          'ProductValue': 'xzkjn',
          'ProductArea': '',
          'Manufacturer': '北大维信',
          'ProductCategory': '',
          'PriceList': '30',
          'UOM': '盒',
          'MedPerDosQty': '0.6',
          'MedPerDosUOM': 'g',
          'MedPerDosUOMName': 'g',
          'MedPerDay': 'BID',
          'MedPerDayName': '每日两次',
          'MedUsage': 'PO',
          'MedUsageName': '口服',
          'PackageQty': '7'
        },
        {
          'ProductID': '8788787',
          'ProductCode': 'jszj-1001009',
          'ProductName': '血脂康胶囊',
          'ProductSpec': '0.3g*24粒',
          'ProductTypeName': '中成药1',
          'ProductValue': 'xzkjn',
          'ProductArea': '',
          'Manufacturer': '北大维信',
          'ProductCategory': '',
          'PriceList': '30',
          'UOM': '盒',
          'MedPerDosQty': '0.6',
          'MedPerDosUOM': 'g',
          'MedPerDosUOMName': 'g',
          'MedPerDay': 'BID',
          'MedPerDayName': '每日两次',
          'MedUsage': 'PO',
          'MedUsageName': '口服',
          'PackageQty': '7'
        },
        {
          'ProductID': '5445',
          'ProductCode': 'jszj-10010010',
          'ProductName': '血脂康胶囊',
          'ProductSpec': '0.3g*24粒',
          'ProductTypeName': '中成药1',
          'ProductValue': 'xzkjn',
          'ProductArea': '',
          'Manufacturer': '北大维信',
          'ProductCategory': '',
          'PriceList': '30',
          'UOM': '盒',
          'MedPerDosQty': '0.6',
          'MedPerDosUOM': 'g',
          'MedPerDosUOMName': 'g',
          'MedPerDay': 'BID',
          'MedPerDayName': '每日两次',
          'MedUsage': 'PO',
          'MedUsageName': '口服',
          'PackageQty': '7'
        },
        {
          'ProductID': '5445',
          'ProductCode': 'jszj-10010022',
          'ProductName': '血脂康胶囊',
          'ProductSpec': '0.3g*24粒',
          'ProductTypeName': '中成药1',
          'ProductValue': 'xzkjn',
          'ProductArea': '',
          'Manufacturer': '北大维信',
          'ProductCategory': '',
          'PriceList': '30',
          'UOM': '盒',
          'MedPerDosQty': '0.6',
          'MedPerDosUOM': 'g',
          'MedPerDosUOMName': 'g',
          'MedPerDay': 'BID',
          'MedPerDayName': '每日两次',
          'MedUsage': 'PO',
          'MedUsageName': '口服',
          'PackageQty': '7'
        },
        {
          'ProductID': '5445',
          'ProductCode': 'jszj-10010023',
          'ProductName': '血脂康胶囊',
          'ProductSpec': '0.3g*24粒',
          'ProductTypeName': '中成药1',
          'ProductValue': 'xzkjn',
          'ProductArea': '',
          'Manufacturer': '北大维信',
          'ProductCategory': '',
          'PriceList': '30',
          'UOM': '盒',
          'MedPerDosQty': '0.6',
          'MedPerDosUOM': 'g',
          'MedPerDosUOMName': 'g',
          'MedPerDay': 'BID',
          'MedPerDayName': '每日两次',
          'MedUsage': 'PO',
          'MedUsageName': '口服',
          'PackageQty': '7'
        }
      ],
      medUsageList: [
        {
          'value': 'BS',
          'name': '鼻饲'
        },
        {
          'value': 'PO',
          'name': '口服'
        },
        {
          'value': 'WY',
          'name': '外用'
        },
        {
          'value': 'glyy-00001',
          'name': '静推'
        },
        {
          'value': 'glyy-00002',
          'name': '静滴'
        }
      ],
      jpTypeList: [
        {
          'value': '1',
          'name': '代煎'
        },
        {
          'value': '2',
          'name': '代配'
        },
        {
          'value': '3',
          'name': '单包'
        }
      ],
      medPerDayList: [
        {
          'value': '12MN',
          'name': '午夜12点'
        },
        {
          'value': '12N',
          'name': '中午12点'
        },
        {
          'value': 'AC',
          'name': '饭前'
        },
        {
          'value': 'AM',
          'name': '上午'
        },
        {
          'value': 'BID',
          'name': '每日两次'
        },
        {
          'value': 'BIW',
          'name': '每周两次'
        },
        {
          'value': 'DC',
          'name': '停止、取消'
        },
        {
          'value': 'GTT',
          'name': '滴'
        },
        {
          'value': 'H',
          'name': '皮下注射'
        },
        {
          'value': 'HS',
          'name': '临睡前'
        },
        {
          'value': 'ID',
          'name': '皮内注射'
        },
        {
          'value': 'IM',
          'name': '肌肉注射'
        },
        {
          'value': 'IV',
          'name': '静脉注射'
        },
        {
          'value': 'PC',
          'name': '饭后'
        },
        {
          'value': 'PM',
          'name': '下午'
        },
        {
          'value': 'PRN',
          'name': '需要时（长期）'
        },
        {
          'value': 'Q12H',
          'name': '每十二小时一次'
        },
        {
          'value': 'Q1H',
          'name': '每小时一次'
        },
        {
          'value': 'Q2H',
          'name': '每两小时一次'
        },
        {
          'value': 'Q3H',
          'name': '每三小时一次 '
        },
        {
          'value': 'Q4H',
          'name': '每四小时一次'
        },
        {
          'value': 'Q6H',
          'name': '每六小时一次'
        },
        {
          'value': 'Q8H',
          'name': '每八小时一次'
        },
        {
          'value': 'QD',
          'name': '每日一次'
        }
      ]
    }
  },
  created () {
    var list = []
    for (var index = 0; index < 6; index++) {
      list.push({
        id: index + 10000,
        name: 'test' + index,
        role: 'developer',
        sex: '1',
        date13: '2019-05-01',
        age: 20
      })
    }
    // this.tableData = list
  },
  methods: {
    touchstart (e) {
      console.log(e)
    },
    selectPatient () {
      this.isShowPaitentDialog = true
    },
    selectPatientInfo (row) {
      this.patient = row
    },
    onChangePatientInput (value) {
      if (value.length > 0) {
        this.isPatientPopoverShow = true
      } else {
        this.isPatientPopoverShow = false
      }
    },
    addWestTab (targetName) {
      let newTabName = (++this.tabIndex) + ''
      let list = {}
      list.Lines = []
      this.preTabData[newTabName] = list
      this.editableTabs.push({
        title: newTabName + '-西药处方',
        name: newTabName,
        type: 2
      })
      this.editableTabsValue = newTabName
    },
    addChinaTab (targetName) {
      let newTabName = (++this.tabIndex) + ''
      let list = {}
      list.MedUsage = ''
      list.JpType = ''
      list.MedPerDay = ''
      list.Lines = []
      this.preTabData[newTabName] = list

      this.editableTabs.push({
        title: newTabName + '-中药处方',
        name: newTabName,
        type: 1
      })
      this.initSelectData(1, newTabName)
      this.editableTabsValue = newTabName
      this.$nextTick(() => {
        // this.$refs.chinaForm[this.editableTabs.length-1].resetFields()
      })
      // this.$refs.chinaForm[this.editableTabs.length-1].resetField()
    },
    removeTab (targetName) {
      let tabs = this.editableTabs
      let activeName = this.editableTabsValue
      if (activeName === targetName) {
        tabs.forEach((tab, index) => {
          if (tab.name === targetName) {
            let nextTab = tabs[index + 1] || tabs[index - 1]
            if (nextTab) {
              activeName = nextTab.name
            }
          }
        })
      }
      this.editableTabsValue = activeName
      this.editableTabs = tabs.filter(tab => tab.name !== targetName)
      delete this.preTabData[targetName]
    },
    async insertEvent (row) {
      let record = {
        name: '',
        sex: '',
        age: ''
      }
      // this.tableData.push(record)
      let { row: newRow } = await this.$refs.xTable[this.editableTabs.length - 1].insertAt(record, row)
      await this.$refs.xTable[this.editableTabs.length - 1].setActiveRow(newRow)
      // this.preTabData[this.editableTabsValue].Lines.push(newRow)
    },
    editMethod ({ row, column }) {
      // 重写默认的覆盖式，改为追加式
      // this.$refs.xTable[this.editableTabs.length-1].setActiveCell(row, column.property)
      // 返回 false 阻止默认行为
      return false
    },
    editActivied ({ row, rowIndex, $rowIndex, column, columnIndex, $columnIndex, cell }) {
      if (column.property === 'MedUsageName') {
        this.$nextTick(() => {
          this.$refs.medUsageRefs[0].toggleMenu()
        })
      } else if (column.property === 'MedPerDayName') {
        this.$nextTick(() => {
          this.$refs.medPerDayRefs[0].toggleMenu()
        })
      } else if (column.property === 'Qty') {
        this.$nextTick(() => {
          // this.$refs.inputNumberRefs[0].focus()
          // this.$refs.inputNumberRefs[0].selectionStart = 0
          // this.$refs.inputNumberRefs[0].focused = true
          // this.$refs.inputNumberRefs[0].select()
          // this.$refs.inputNumberRefs[0].$refs.input_number.focus()
        })
      }
    },
    keydownEvent (data, event) {
      if (event.keyCode === 13) {
        // this.editClosedEvent(data)
        let keys = this.$refs.xTable[this.editableTabs.length - 1].getTableColumn().tableColumn
        let index = 0
        // let isRight = false
        // let isBottom = false
        // let isNewCreate = false
        let columnName = null
        for (let i = data.$columnIndex + 1; i < keys.length; i++) {
          let columnObj = keys[i]
          if (columnObj.editRender) {
            columnName = keys[i].property
            index++
            break
          }
        }
        if (index > 0) {
          this.$refs.xTable[this.editableTabs.length - 1].setActiveCell(data.row, columnName)
        } else {
          if (data.$rowIndex === data.data.length - 1) {
            this.insertEvent(-1)
          } else {
            this.$refs.xTable[this.editableTabs.length - 1].setActiveRow(data.data[data.$rowIndex + 1])
          }
        }
      }
    },
    onProductCodeKeyEvent (data, event) {
      if (this.chemistList.length > 0) {
        switch (event.keyCode) {
          case 38:
            // 向上
            let rowData = this.$refs.chemistTableRefs.getCurrentRecord()
            let index = this.$refs.chemistTableRefs.getRowIndex(rowData)
            if (index > 0) {
              rowData = this.chemistList[index - 1]
              this.$refs.chemistTableRefs.setCurrentRow(rowData)
              this.$refs.chemistTableRefs.scrollToRow(rowData)
            }
            break
          case 40:
            // 向下
            rowData = this.$refs.chemistTableRefs.getCurrentRecord()
            index = this.$refs.chemistTableRefs.getRowIndex(rowData)

            if (index < this.chemistList.length - 1) {
              rowData = this.chemistList[index + 1]
              this.$refs.chemistTableRefs.setCurrentRow(rowData)
              this.$refs.chemistTableRefs.scrollToRow(rowData)
            }
            break
          case 13:
            if (this.visible) {
              rowData = this.$refs.chemistTableRefs.getCurrentRecord()
              if (rowData && Object.keys(rowData).length > 0) {
                this.rowLongClickChemist(rowData)
              }
            }
            this.keydownEvent(data, event)
            break
        }
      }
    },
    onChangeInput (value) {
      if (this.$refs.diagnoseInput[0].focused && value.length > 0) {
        this.visible = true
        this.chemistList = this.chemistCach.filter(result => {
          return result.ProductCode.toString().indexOf(value) > -1
        })
        if (this.chemistList.length > 0) {
          this.$nextTick(() => {
            this.$refs.chemistTableRefs.setCurrentRow(this.chemistList[0])
          })
        }
      } else {
        this.visible = false
        // this.$refs.table.setCurrentRow(this.gridData[1])
      }
    },
    onChangeMedUsageName (data, option, e) {
      this.keydownEvent(data, e)
    },
    rowClick (row, event, column) {

    },
    rowClickChemist (row, column, event) {
      Object.assign(this.curentRow, row)
    },
    rowLongClickChemist (row, column, cell, event) {
      Object.assign(this.curentRow, row)
      this.visible = false
    },
    getList (page, params) {

    },
    onMedUsageChange (value) {
      console.log('medusage: ' + value)
    },
    initSelectData (type, name) {
      if (type === 1) {
        if (this.preTabData[name].MedPerDay) {
          this.MedPerDay = this.preTabData[name].MedPerDay
        } else {
          this.MedPerDay = ''
        }
        if (this.preTabData[name].JpType) {
          this.JpType = this.preTabData[name].JpType
        } else {
          this.JpType = ''
        }
        if (this.preTabData[name].MedUsage) {
          this.MedUsage = this.preTabData[name].MedUsage
        } else {
          this.MedUsage = ''
        }
      }
    },
    onTabClick (tab) {
      this.initSelectData(this.editableTabs[tab.index].type, tab.name)
    },

    saveTableData (row, done, loading) {
      let _this = this
      this.$message.success('模拟网络请求')
      if (!this.preTabData[_this.editableTabsValue]) {
        this.preTabData[this.editableTabsValue] = []
      }
      setTimeout(() => {
        this.$message.success('关闭按钮等待')
        loading()
      }, 1000)
      setTimeout(() => {
        _this.$message.success('新增数据' + JSON.stringify(_this.curentRow))
        _this.preTabData[_this.editableTabsValue].Lines.push(this.curentRow)
        _this.curentRow = {}
        done()
        _this.$refs.crud[this.editableTabsValue - 1].init()
      }, 2000)
    },
    delRowTableDel (form, index) {
      this.preTabData[this.editableTabsValue].Lines.splice(index, 1)
      this.$refs.crud[this.editableTabsValue - 1].init()
    },
    submitInfo () {
      if (!this.patient || Object.keys(this.patient).length === 0) {
        this.$message.error('请选择患者！')
        return
      }
      if (!this.preTabData || Object.keys(this.preTabData).length === 0) {
        this.$message.error('请添加处方信息！')
        return
      }
      this.isShowConfirmDialog = true
    }
  }
  };
  var Ctor = Vue.extend(Main);
  new Ctor().$mount('#app')

<script src="//unpkg.com/vue">
</script>
<script src="//unpkg.com/xe-utils">
</script>
<script src="//unpkg.com/vxe-table">
</script>
<script src="//unpkg.com/element-ui@2.13.0/lib/index.js"></script>

<link rel="stylesheet" type="text/css" href="//unpkg.com/element-ui@2.13.0/lib/theme-chalk/index.css">
<!-- 使用 umd 引用方式需要注意是否锁定版本，默认指向最新版本 -->
<div id="app">
  <template>
    <div>
     <div class="diagnose-center">
      <el-row :gutter="10">
        <el-col :span="12">
          <el-button type="primary" icon="el-icon-position" size="small"  @click="addWestTab(editableTabsValue)">新开西药</el-button>
          <el-button type="primary" icon="el-icon-position" size="small" @click="addChinaTab(editableTabsValue)">新开中药</el-button>
        </el-col>
        <el-col :span="12" style="text-align: right">
          <el-button type="primary"  icon="el-icon-position" size="small" @click="submitInfo">提交</el-button>
        </el-col>
      </el-row>

    </div>
    <el-tabs tab-position="left" @tab-click="onTabClick" v-model="editableTabsValue" type="card" closable @tab-remove="removeTab">
      <el-tab-pane
          v-for="(item, index) in editableTabs"
          :label="item.title"
          :key="'tab_'+ index"
          :name="item.name"
      >
        <vxe-toolbar>
          <template v-slot:buttons>

            <vxe-button ref="insertFinally" @click="insertEvent(-1)">在最后行插入</vxe-button>
            <vxe-button @click="$refs.xTable.removeSelecteds()">删除选中</vxe-button>
          </template>
        </vxe-toolbar>
        <vxe-table
            border
            show-overflow
            ref="xTable"
            height="400"
            highlight-cell
            :mouse-config="{selected: true}"
            :data="preTabData[item.name].Lines"
            @edit-actived="editActivied"
            :edit-config="{trigger: 'click', mode: 'cell', icon: 'fa fa-pencil'}">
          <vxe-table-column type="checkbox" width="60">
          </vxe-table-column>
          <vxe-table-column width="40" type="seq" ></vxe-table-column>
          <vxe-table-column  field="ProductCode" title="药品编码"  :edit-render="{name: 'input',events: {keydown: keydownEvent}}">
            <template v-slot:edit="data">
              <el-input autofocus  @keydown.native="(event)=> keydownEvent(data,event)" ref="diagnoseInput"    v-model="data.row.ProductCode"  ></el-input>

            </template>
          </vxe-table-column>
          <vxe-table-column field="ProductName" title="药品信息"></vxe-table-column>
          <vxe-table-column field="Qty" title="数量" sortable :edit-render="{name: 'ElInputNumber', props: {max: 100, min: 1,controlsPosition: 'right',autofocus: true}}">
            <template v-slot:edit="data">
             <el-input   @keydown.native="(event)=> keydownEvent(data,event)"  v-model="data.row.Qty"  ></el-input>
            </template>
          </vxe-table-column>
          <vxe-table-column   field="MedUsageName" title="用法" sortable :edit-render="{name: 'input',options: medUsageList,optionProps:{label:'name',value: 'value'}, events: {keydown: keydownEvent}}">
          </vxe-table-column>
          <vxe-table-column field="MedPerDayName" title="频次" sortable :edit-render="{name: 'input',options: medPerDayList,optionProps:{label:'name',value: 'value'}, events: {keydown: keydownEvent}}">
          </vxe-table-column>
          <vxe-table-column field="DoctorEntrust" title="医嘱" sortable :edit-render="{name: 'input', events: {keydown: keydownEvent},autoselect: false,autofuces: true}"></vxe-table-column>
        </vxe-table>

      </el-tab-pane>
    </el-tabs>
    </div>
  </template>
</div>

@import url("//unpkg.com/vxe-table/lib/index.css");