xiangan_pc/src/components/360View/specialExamine/index.vue

<template>
  <!--  专科检查-->
  <div class="examineBox">
    <div style="display: flex;">
      <el-table
        :data="tableData"
        style="width:100%;margin: 8px 8px 0 0"
      >
        <el-table-column
          width="70"
          align="center"
          type="index"
          label="序号"
        />
        <el-table-column
          align="center"
          prop="name"
          label="项目"
          width="90"
        >
          <template slot-scope="scope">
            <div>
              <span v-if="scope.row.sort === 1">
                <span style="margin-right: 16px">结膜：充血</span>
              </span>
              <span v-else-if="scope.row.sort === 2">
                <span style="margin-right: 16px">结膜：分泌物</span>
              </span>
              <span v-else-if="scope.row.sort === 3">
                <span style="margin-right: 16px">视盘：视神经</span>
              </span>
              <span v-else-if="scope.row.sort === 4">
                <span style="margin-right: 16px">视盘：CDR</span>
              </span>
              <span v-else>
                {{ scope.row.name }}
              </span>
            </div>
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          label="OD"
        >
          <template slot-scope="scope">
            <div>
<!--              <span v-if="scope.row.sort === 1">-->
<!--                <span style="margin-right: 16px">结膜：充血</span>{{ scope.row.odValue }}-->
<!--              </span>-->
<!--              <span v-else-if="scope.row.sort === 2">-->
<!--                <span style="margin-right: 16px">结膜：分泌物</span>{{ scope.row.odValue }}-->
<!--              </span>-->
<!--              <span v-else-if="scope.row.sort === 3">-->
<!--                <span style="margin-right: 16px">视盘：视神经</span>{{ scope.row.odValue }}-->
<!--              </span>-->
<!--              <span v-else-if="scope.row.sort === 4">-->
<!--                <span style="margin-right: 16px">视盘：CDR</span>{{ scope.row.odValue }}-->
<!--              </span>-->
              <span v-if="scope.row.sort === 5">
                <div v-if="scope.row.eyeType === 'OD'">
                  <p style="margin-right: 16px">球镜 DS：{{ scope.row.odSph }}</p>
                  <p style="margin-right: 16px">柱镜 DC：{{ scope.row.odCyl }}</p>
                  <p style="margin-right: 16px">轴位 Axis：{{ scope.row.odAx }}</p>
                  <p style="margin-right: 16px">矫正视力(VA)：{{ scope.row.odVa }}</p>
                  <p style="margin-right: 16px">下加光(ADD)：{{ scope.row.odAdd }}</p>
                </div>
              </span>
              <span v-else-if="scope.row.sort === 6">
                <div v-if="scope.row.eyeType === 'OD'">
                  <p style="margin-right: 16px">球镜 DS：{{ scope.row.odSph }}</p>
                  <p style="margin-right: 16px">柱镜 DC：{{ scope.row.odCyl }}</p>
                  <p style="margin-right: 16px">轴位 Axis：{{ scope.row.odAx }}</p>
                  <p style="margin-right: 16px">矫正视力VA：{{ scope.row.odVa }}</p>
                  <p style="margin-right: 16px">下加光(ADD)：{{ scope.row.odAdd }}</p>

                </div>
              </span>
              <span v-else>
                {{ scope.row.odValue }}
              </span>
            </div>
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          label="OS"
        >
          <template slot-scope="scope">
            <div>
<!--              <span v-if="scope.row.sort === 1">-->
<!--                <span style="margin-right: 16px">结膜：充血</span>{{ scope.row.osValue }}-->
<!--              </span>-->
<!--              <span v-else-if="scope.row.sort === 2">-->
<!--                <span style="margin-right: 16px">结膜：分泌物</span>{{ scope.row.osValue }}-->
<!--              </span>-->
<!--              <span v-else-if="scope.row.sort === 3">-->
<!--                <span style="margin-right: 16px">视盘：视神经</span>{{ scope.row.osValue }}-->
<!--              </span>-->
<!--              <span v-else-if="scope.row.sort === 4">-->
<!--                <span style="margin-right: 16px">视盘：CDR</span>{{ scope.row.osValue }}-->
<!--              </span>-->
              <span v-if="scope.row.sort === 5">
                <div v-if="scope.row.eyeType === 'OS'">
                  <p style="margin-right: 16px">球镜 DS：{{ scope.row.odSph }}</p>
                  <p style="margin-right: 16px">柱镜 DC：{{ scope.row.odCyl }}</p>
                  <p style="margin-right: 16px">轴位 Axis：{{ scope.row.odAx }}</p>
                  <p style="margin-right: 16px">矫正视力(VA)：{{ scope.row.odVa }}</p>
                  <p style="margin-right: 16px">下加光(ADD)：{{ scope.row.odAdd }}</p>
                </div>
              </span>
              <span v-else-if="scope.row.sort === 6">
                <div v-if="scope.row.eyeType === 'OS'">
                  <p style="margin-right: 16px">球镜 DS：{{ scope.row.odSph }}</p>
                  <p style="margin-right: 16px">柱镜 DC：{{ scope.row.odCyl }}</p>
                  <p style="margin-right: 16px">轴位 Axis：{{ scope.row.odAx }}</p>
                  <p style="margin-right: 16px">矫正视力VA：{{ scope.row.odVa }}</p>
                  <p style="margin-right: 16px">下加光(ADD)：{{ scope.row.odAdd }}</p>
                </div>
              </span>
              <span v-else>
                {{ scope.row.osValue }}
              </span>
            </div>
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          label="OU"
          width="80"
        >
          <template slot-scope="scope">
            <div>
              <span v-if="scope.row.sort === 1">
                <span style="margin-right: 16px" />{{ scope.row.ouValue }}
              </span>
              <span v-else-if="scope.row.sort === 5">
                <div v-if="scope.row.eyeType === 'OU'">
                  <p style="margin-right: 16px">球镜 DS：{{ scope.row.odSph }}</p>
                  <p style="margin-right: 16px">柱镜 DC：{{ scope.row.odCyl }}</p>
                  <p style="margin-right: 16px">轴位 Axis：{{ scope.row.odAx }}</p>
                  <p style="margin-right: 16px">等效球镜：{{ scope.row.odSe }}</p>
                </div>
              </span>
              <span v-else-if="scope.row.sort === 6">
                <div v-if="scope.row.eyeType === 'OU'">
                  <p style="margin-right: 16px">球镜 DS：{{ scope.row.odSph }}</p>
                  <p style="margin-right: 16px">柱镜 DC：{{ scope.row.odCyl }}</p>
                  <p style="margin-right: 16px">轴位 Axis：{{ scope.row.odAx }}</p>
                  <p style="margin-right: 16px">矫正视力VA：{{ scope.row.odVa }}</p>
                </div>
              </span>
              <span v-else>
                {{ scope.row.ouValue }}
              </span>
            </div>
          </template>
        </el-table-column>
        <el-table-column label="操作" align="center">
          <template slot-scope="scope">
            <span
              class="cell-cursor"
              style="margin-left: 5px;"
              :class="scope.$index === 0 ? 'table-column-disable' : ''"
              @click="handleMove(scope, 'up', tableData)"
            >上移</span>
            <span
              class="cell-cursor"
              style="margin-left: 5px;"
              :class="scope.$index === tableData.length - 1 ? 'table-column-disable' : ''"
              @click="handleMove(scope, 'down', tableData)"
            >下移</span>
            <span
              class="cell-cursor"
              style="margin-left: 5px;color: #FF4D4F"
              @click="handleDel(scope.$index, tableData)"
            >
              删除
              <!--            <i class="el-icon-delete"></i>-->
            </span>
          </template>
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>
<script>
import eventBus from '@/page-subspecialty/utils/eventBus'
import treeSelect from '@/components/360View/itemSelect'
const Base64 = require('js-base64').Base64

export default {
  name: 'SpecialExamine',
  components: {
    treeSelect
  },
  mixins: [],
  props: {
    patientIdNumber: {
      type: String,
      default: ''
    },
    patientId: {
      type: String,
      default: ''
    },
    caseId: {
      type: String,
      default: ''
    },
    isSearch: {
      type: String,
      default: ''
    }
  },
  inject: ['refresh'],
  data() {
    return {
      userData: {},
      collectId: '',
      tableData: []
    }
  },
  watch: {
    caseId: {
      handler: function(newV, oldV) {
        this.getOutPatientList()
      }
    }
  },
  created() {
  },
  beforeDestroy() {
    eventBus.$off('sendDataToExamine')
  },
  mounted() {
    this.getOutPatientList()
    eventBus.$on('sendDataToExamine', data => {
      this.tableData = JSON.parse(JSON.stringify(data))
    })
  },
  methods: {
    // 获取表单数据
    async getOutPatientList() {
      const { data: res } = await this.$http.get('/case/getCaseByCaseId', {
        params: {
          caseId: this.caseId,
          patientId: this.patientId,
          platform: this.isSearch,
          flag: '4'
        }
      })
      if (res.code === 0) {
        this.tableData = res.data ? JSON.parse(res.data.jsonText) : []
        this.collectId = res.data ? res.data.id : ''
      } else {
        this.$message.error(res.msg)
      }
    },
    // 保存
    async saveExamine() {
      const params = {
        flag: '4',
        caseId: this.caseId,
        jsonText: JSON.stringify(this.tableData),
        name: '专科检查',
        patientId: this.patientId,
        platform: this.isSearch
      }
      let url = ''
      if (this.collectId) {
        url = '/case/update'
        params.id = this.collectId
      } else {
        url = '/case/save'
      }
      const { data: res } = await this.$http.post(url, params)
      if (res.code === 0) {
        await this.getOutPatientList()
      } else {
        this.$message.error(res.msg)
      }
    },
    // 上下移动
    handleMove(scope, moveType, list) {
      const { $index } = scope
      if (moveType === 'up') {
        if ($index === 0) return
        const isUp = list[$index - 1]
        list.splice($index - 1, 1)
        list.splice($index, 0, isUp)
      } else {
        if ($index === list.length - 1) return
        const isDown = list[$index + 1]
        list.splice($index + 1, 1)
        list.splice($index, 0, isDown)
      }
    },
    // 删除
    handleDel(index, list) {
      list = list.splice(index, 1)
    }
  }
}
</script>
<style lang="scss" scoped>
.examineBox{
  width: 100%;
  height: 100%;
  padding-top: 16px;
  box-sizing: border-box;
  overflow-y: auto;
  position: relative;
  .btnBox{
    position: fixed;
    right: 84px;
    text-align: right;
    margin-right: 16px;
    background-color: white;
    z-index: 999;
  }
  .moveIcon{
    position: absolute;
    left: calc(50% + 120px);
    top: 40px;
    z-index: 9;
  }
  .cell-cursor {
    cursor: pointer;
    color: #1e79ff;
  }
  .table-column-disable {
    color: #dddd;
  }
}
</style>
<style lang="scss">
.examineBox{
  .el-form-item__content{
    text-align: left;
  }
}
</style>