<template>
  <div id="operation-record" style=" background: #fff; padding: 10px 20px 50px 20px;page-break-after:always">
    <div v-if="!onlyRead && isPlatform" class="btnBox">
      <el-button v-print="'#threeFunc'" size="small" @click="handleSaveTable">打印</el-button>
      <el-button type="primary" size="small" @click="handleSaveTable">保存</el-button>
      <el-button type="danger" size="small" @click="handleDelete">删除</el-button>
    </div>
    <div id="threeFunc" style="width: 840px;padding-right: 8px" class="printBox">
      <div class="flex j-c">
        <img width="450" src="@/assets/img/xianganlogo.png">
      </div>
      <p style="color:#000000;font-size:32px;margin:2px 0 20px 0;text-align:center;font-weight: 700;letter-spacing: 8px">
        三级视功能检查报告单
      </p>
      <div style="display: flex;justify-content: space-around">
        <span>登记号：<el-input v-model="dataForm.patientId" style="width: 120px" size="small" placeholder="" /></span>
        <span>姓名：<el-input v-model="dataForm.patientName" style="width: 120px" size="small" placeholder="" /></span>
        <span>性别：<el-input v-model="dataForm.patientSex" style="width: 120px" size="small" placeholder="" /></span>
        <span>年龄：<el-input v-model="dataForm.patientAge" style="width: 120px" size="small" placeholder="" /></span>
      </div>
      <div class="operation-record-table">
        <el-table :data="tableData" :span-method="objectSpanMethod" border style="width: 820px; margin-top: 10px">
          <el-table-column label="" width="210" align="center" :resizable="false">
            <template slot-scope="scope">
              <div v-if="scope.row.name === 'ODOS'" class="machineBox" style="position: relative;height: 270px;">
                <div style="display: flex">
                  <p style="width: 50%">OD</p>
                  <p style="width: 50%">OS</p>
                </div>
                <div style="display: flex;">
                  <el-table
                    border
                    :show-header="false"
                    :data="machineData"
                    style="width: 40%;height:100%;margin: 0px 32px 0 16px"
                  >
                    <el-table-column
                      label=""
                    >
                      <template slot-scope="scope">
                        <div v-if="scope.row.name == '1'">
                          <div class="width-120 center">
                            <el-popover
                              ref="popover1"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOd1', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOd1" v-popover:popover1 placeholder="" />
                          </div>
                        </div>
                        <div v-if="scope.row.name == '2'">
                          <div class="width-120 center">
                            <el-popover
                              ref="popover1n"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOd1n', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOd1n" v-popover:popover1n placeholder="" />
                          </div>
                        </div>
                        <div v-if="scope.row.name == '3'">
                          <div class="width-120 center">
                            <el-popover
                              ref="popover2"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOd4', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOd4" v-popover:popover2 placeholder="" />
                          </div>
                        </div>
                        <div v-if="scope.row.name == '4'">
                          <div class="width-120 center">
                            <el-popover
                              ref="popover2n"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOd4n', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOd4n" v-popover:popover2n placeholder="" />
                          </div>
                        </div>
                        <div v-if="scope.row.name == '5'">
                          <div class="width-120 center">
                            <el-popover
                              ref="popover3"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOd7', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOd7" v-popover:popover3 placeholder="" />
                          </div>
                        </div>
                        <div v-if="scope.row.name == '6'">
                          <div class="width-120 center">
                            <el-popover
                              ref="popover4"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOd7n', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOd7n" v-popover:popover4 placeholder="" />
                          </div>
                        </div>
                      </template>
                    </el-table-column>
                    <el-table-column
                      label=""
                    >
                      <template slot-scope="scope">
                        <div v-if="scope.row.name == '1'">
                          <div class="width-120 center">
                            <el-popover
                              ref="popover4n"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOd2', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOd2" v-popover:popover4n placeholder="" />
                          </div>
                        </div>
                        <div v-if="scope.row.name == '2'">
                          <div class="width-120 center">
                            <el-popover
                              ref="popover5"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOd2n', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOd2n" v-popover:popover5 placeholder="" />
                          </div>
                        </div>
                        <div v-if="scope.row.name == '3'">
                          <div class="width-120 center">
                            <el-popover
                              ref="popover5n"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOd5', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOd5" v-popover:popover5n placeholder="" />
                          </div>
                        </div>
                        <div v-if="scope.row.name == '4'">
                          <div class="width-120 center">
                            <el-popover
                              ref="popover6"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOd5n', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOd5n" v-popover:popover6 placeholder="" />
                          </div>
                        </div>
                        <div v-if="scope.row.name == '5'">
                          <div class="width-120 center">
                            <el-popover
                              ref="popover6n"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOd8', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOd8" v-popover:popover6n placeholder="" />
                          </div>
                        </div>
                        <div v-if="scope.row.name == '6'">
                          <div class="width-120 center">
                            <el-popover
                              ref="popover7"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOd8n', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOd8n" v-popover:popover7 placeholder="" />
                          </div>
                        </div>
                      </template>
                    </el-table-column>
                    <el-table-column
                      label=""
                    >
                      <template slot-scope="scope">
                        <div v-if="scope.row.name == '1'">
                          <div class="width-120 center">
                            <el-popover
                              ref="popover7n"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOd3', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOd3" v-popover:popover7n placeholder="" />
                          </div>
                        </div>
                        <div v-if="scope.row.name == '2'">
                          <div class="width-120 center">
                            <el-popover
                              ref="popover8"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOd3n', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOd3n" v-popover:popover8 placeholder="" />
                          </div>
                        </div>
                        <div v-if="scope.row.name == '3'">
                          <div class="width-120 center">
                            <el-popover
                              ref="popover8n"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOd6', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOd6" v-popover:popover8n placeholder="" />
                          </div>
                        </div>
                        <div v-if="scope.row.name == '4'">
                          <div class="width-120 center">
                            <el-popover
                              ref="popover9"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOd6n', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOd6n" v-popover:popover9 placeholder="" />
                          </div>
                        </div>
                        <div v-if="scope.row.name == '5'">
                          <div class="width-120 center">
                            <el-popover
                              ref="popover9n"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOd9', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOd9" v-popover:popover9n placeholder="" />
                          </div>
                        </div>
                        <div v-if="scope.row.name == '6'">
                          <div class="width-120 center">
                            <el-popover
                              ref="popover10"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOd9n', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOd9n" v-popover:popover10 placeholder="" />
                          </div>
                        </div>
                      </template>
                    </el-table-column>
                  </el-table>
                  <el-table
                    border
                    :show-header="false"
                    :data="machineData"
                    style="width: 40%;margin: 0 16px"
                  >
                    <el-table-column
                      label=""
                    >
                      <template slot-scope="scope">
                        <div v-if="scope.row.name == '1'">
                          <div class="width-120 center">
                            <el-popover
                              ref="pop1"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOs1', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOs1" v-popover:pop1 placeholder="" />
                          </div>
                        </div>
                        <div v-if="scope.row.name == '2'">
                          <div class="width-120 center">
                            <el-popover
                              ref="pop1n"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOs1n', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOs1n" v-popover:pop1n placeholder="" />
                          </div>
                        </div>
                        <div v-if="scope.row.name == '3'">
                          <div class="width-120 center">
                            <el-popover
                              ref="pop2"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOs4', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOs4" v-popover:pop2 placeholder="" />
                          </div>
                        </div>
                        <div v-if="scope.row.name == '4'">
                          <div class="width-120 center">
                            <el-popover
                              ref="pop2n"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOs4n', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOs4n" v-popover:pop2n placeholder="" />
                          </div>
                        </div>
                        <div v-if="scope.row.name == '5'">
                          <div class="width-120 center">
                            <el-popover
                              ref="pop3"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOs7', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOs7" v-popover:pop3 placeholder="" />
                          </div>
                        </div>
                        <div v-if="scope.row.name == '6'">
                          <div class="width-120 center">
                            <el-popover
                              ref="pop3n"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOs7n', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOs7n" v-popover:pop3n placeholder="" />
                          </div>
                        </div>
                      </template>
                    </el-table-column>
                    <el-table-column
                      label=""
                    >
                      <template slot-scope="scope">
                        <div v-if="scope.row.name == '1'">
                          <div class="width-120 center">
                            <el-popover
                              ref="pop4"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOs2', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOs2" v-popover:pop4 placeholder="" />
                          </div>
                        </div>
                        <div v-if="scope.row.name == '2'">
                          <div class="width-120 center">
                            <el-popover
                              ref="pop4n"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOs2n', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOs2n" v-popover:pop4n placeholder="" />
                          </div>
                        </div>
                        <div v-if="scope.row.name == '3'">
                          <div class="width-120 center">
                            <el-popover
                              ref="pop5"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOs5', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOs5" v-popover:pop5 placeholder="" />
                          </div>
                        </div>
                        <div v-if="scope.row.name == '4'">
                          <div class="width-120 center">
                            <el-popover
                              ref="pop5n"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOs5n', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOs5n" v-popover:pop5n placeholder="" />
                          </div>
                        </div>
                        <div v-if="scope.row.name == '5'">
                          <div class="width-120 center">
                            <el-popover
                              ref="pop6"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOs8', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOs8" v-popover:pop6 placeholder="" />
                          </div>
                        </div>
                        <div v-if="scope.row.name == '6'">
                          <div class="width-120 center">
                            <el-popover
                              ref="pop6n"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOs8n', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOs8n" v-popover:pop6n placeholder="" />
                          </div>
                        </div>
                      </template>
                    </el-table-column>
                    <el-table-column
                      label=""
                    >
                      <template slot-scope="scope">
                        <div v-if="scope.row.name == '1'">
                          <div class="width-120 center">
                            <el-popover
                              ref="pop7"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOs3', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOs3" v-popover:pop7 placeholder="" />
                          </div>
                        </div>
                        <div v-if="scope.row.name == '2'">
                          <div class="width-120 center">
                            <el-popover
                              ref="pop7n"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOs3n', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOs3n" v-popover:pop7n placeholder="" />
                          </div>
                        </div>
                        <div v-if="scope.row.name == '3'">
                          <div class="width-120 center">
                            <el-popover
                              ref="pop8"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOs6', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOs6" v-popover:pop8 placeholder="" />
                          </div>
                        </div>
                        <div v-if="scope.row.name == '4'">
                          <div class="width-120 center">
                            <el-popover
                              ref="pop8n"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOs6n', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOs6n" v-popover:pop8n placeholder="" />
                          </div>
                        </div>
                        <div v-if="scope.row.name == '5'">
                          <div class="width-120 center">
                            <el-popover
                              ref="pop9"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOs9', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOs9" v-popover:pop9 placeholder="" />
                          </div>
                        </div>
                        <div v-if="scope.row.name == '6'">
                          <div class="width-120 center">
                            <el-popover
                              ref="pop9n"
                              placement="bottom"
                              width="560"
                            >
                              <Keyboard :layouts="myLayout" @input="handleInput('jfwjcOs9n', $event)" />
                            </el-popover>
                            <el-input v-model="dataForm.jfwjcOs9n" v-popover:pop9n placeholder="" />
                          </div>
                        </div>
                      </template>
                    </el-table-column>
                  </el-table>
                </div>
                <div class="Rline">R</div>
                <div class="Rline-os">L</div>
                <div class="Lline">L</div>
                <div class="Lline-os">R</div>
              </div>
              <div v-else-if="scope.row.name === 'TITMUS(近)'" class="flex">
                <span>TITMUS(近):</span>
                <el-select v-model="dataForm.titmus" placeholder="" clearable style="display: inline-block;width: 95px;margin-left: 8px">
                  <el-option
                    v-for="item in titmusList"
                    :key="item.id"
                    :label="item.name"
                    :value="item.name"
                  />
                </el-select>
              </div>
              <div v-else-if="scope.row.name === '签名'" style="display: flex;justify-content: space-between;padding: 0 16px">
                <div class="width-180" style="text-align: left">
                  <span style="display: inline-block;margin: 8px 16px 0 0">视光师:</span>
                  <img v-if="dataForm.sgsSign" :src="dataForm.sgsSign" alt="" style="width: 80px;height: 50px;border-style:none;">
                </div>
                <div class="width-180" style="text-align: left;margin-top: 10px">
                  日期：<el-date-picker
                    v-model="dataForm.riQi"
                    type="date"
                    placeholder="选择日期"
                  />
                </div>
              </div>
              <span v-else :class="[scope.row.type === 'title' ? 'weight7' : '']">{{ scope.row.name }}</span>
            </template>
          </el-table-column>
          <el-table-column label="" width="" :resizable="false" prop="type">
            <template slot-scope="scope">
              <div v-if="scope.row.name == '屈光状态'">
                <div class="width-120 center">
                  <el-input v-model="dataForm.qgztOd1" placeholder="">
                    <template slot="prepend">OD:</template>
                  </el-input>
                  <el-input v-model="dataForm.qgztOd2" placeholder="">
                    <template slot="prepend">/</template>
                  </el-input>
                  <el-input v-model="dataForm.qgztOd3" placeholder="">
                    <template slot="prepend">X</template>
                  </el-input>
                </div>
              </div>
              <div v-if="scope.row.name == '屈光状态a'">
                <div class="width-120 center">
                  <el-input v-model="dataForm.qgztOs1" placeholder="">
                    <template slot="prepend">OS:</template>
                  </el-input>
                  <el-input v-model="dataForm.qgztOs2" placeholder="">
                    <template slot="prepend">/</template>
                  </el-input>
                  <el-input v-model="dataForm.qgztOs3" placeholder="">
                    <template slot="prepend">X</template>
                  </el-input>
                </div>
              </div>
              <div v-if="scope.row.name == 'CT+Prism'">
                <div class="center">
                  <el-input v-model="dataForm.ctPrism" placeholder="" style="width: 120px" />
                  <el-select v-model="dataForm.ctPrismDw" placeholder="" clearable style="display: inline-block;width: 100px;margin-left: 8px">
                    <el-option
                      v-for="item in ctList"
                      :key="item.id"
                      :label="item.name"
                      :value="item.name"
                    />
                  </el-select>
                </div>
              </div>
              <div v-if="scope.row.name == '检查画片' && scope.row.type == '1'">
                <div class="center">
                  <el-select v-model="dataForm.tssjcJchp" placeholder="" clearable style="display: inline-block;width: 180px;margin-left: 8px">
                    <el-option
                      v-for="item in checkList"
                      :key="item.id"
                      :label="item.name"
                      :value="item.name"
                    />
                  </el-select>
                </div>
              </div>
              <div v-if="scope.row.name == '主观斜视角'">
                <div class="width-180 center">
                  <el-input v-model="dataForm.tssjcZgxsj1" placeholder="" @change="handleZg" />
                </div>
              </div>
              <div v-if="scope.row.name == '客观斜视角'">
                <div class="width-180 center">
                  <el-input v-model="dataForm.tssjcKgxsj1" placeholder="" />
                </div>
              </div>
              <div v-if="scope.row.name == '检查画片' && scope.row.type == '2'">
                <div class="center">
                  <el-select v-model="dataForm.rhgnjcJchp" placeholder="" clearable style="display: inline-block;width: 180px;margin-left: 8px">
                    <el-option
                      v-for="item in checkTwoList"
                      :key="item.id"
                      :label="item.name"
                      :value="item.name"
                    />
                  </el-select>
                </div>
              </div>
              <div v-if="scope.row.name == '融合点'">
                <div class="width-180 center">
                  <el-input v-model="dataForm.rhgnjcRhd" placeholder="" />
                </div>
              </div>
              <div v-if="scope.row.name == 'Worth-4-dot'">
                <div class="center">
                  <el-select v-model="dataForm.worth1" placeholder="" clearable style="display: inline-block;width: 100px" @change="selectWorth($event, 'od')">
                    <el-option
                      v-for="item in worthList"
                      :key="item.id"
                      :label="item.name"
                      :value="item.name"
                    />
                  </el-select>
                  @D(
                  <el-input v-model="dataForm.worth2" placeholder="" style="width: 100px" />
                  )
                </div>
              </div>
              <div v-if="scope.row.name == 'TITMUS(近)'">
                <div class="center">
                  <span>TNO(近):</span>
                  <el-select v-model="dataForm.tno" placeholder="" clearable style="display: inline-block;width: 120px;margin-left: 8px">
                    <el-option
                      v-for="item in tnoList"
                      :key="item.id"
                      :label="item.name"
                      :value="item.name"
                    />
                  </el-select>
                </div>
              </div>
              <div v-else-if="scope.row.name === '报告描述:'">
                <el-input v-model="dataForm.bgms" type="textarea" :autosize="{ minRows: 3, maxRows: 3}" placeholder="" style="width: 100%" />
              </div>
            </template>
          </el-table-column>
          <el-table-column label="" width="" :resizable="false">
            <template slot-scope="scope">
              <div v-if="scope.row.name == '屈光状态'">
                <div class="width-180 center">
                  <el-input v-model="dataForm.qgztOdVa" placeholder="">
                    <template slot="prepend">VA:</template>
                  </el-input>
                </div>
              </div>
              <div v-if="scope.row.name == '屈光状态a'">
                <div class="width-180 center">
                  <el-input v-model="dataForm.qgztOsVa" placeholder="">
                    <template slot="prepend">VA:</template>
                  </el-input>
                </div>
              </div>
              <div v-if="scope.row.name == '主观斜视角'">
                <div class="width-180 center">
                  <el-input v-model="dataForm.tssjcZgxsj2" placeholder="">
                    <template slot="prepend">AC/A:</template>
                    <template slot="append">△/D</template>
                  </el-input>
                </div>
              </div>
              <div v-if="scope.row.name == '客观斜视角'">
                <span>异常视网膜对应:</span>
                <el-select v-model="dataForm.tssjcKgxsj2" placeholder="" clearable style="display: inline-block;width: 120px;margin-left: 8px">
                  <el-option
                    v-for="item in retinaList"
                    :key="item.id"
                    :label="item.name"
                    :value="item.name"
                  />
                </el-select>
              </div>
              <div v-if="scope.row.name == '融合点'">
                <div class="center">
                  <span>分开/集合:</span>
                  <el-select v-model="dataForm.rhgnjcFkjh1" placeholder="" clearable style="display: inline-block;width: 45px;margin-right: 5px">
                    <el-option
                      v-for="item in separateList"
                      :key="item.id"
                      :label="item.name"
                      :value="item.name"
                    />
                  </el-select>
                  <el-input v-model="dataForm.rhgnjcFkjh2" placeholder="" style="width: 45px" />
                  <span>°</span> /
                  <el-select v-model="dataForm.rhgnjcFkjh3" placeholder="" clearable style="display: inline-block;width: 45px;margin-right: 5px">
                    <el-option
                      v-for="item in separateList"
                      :key="item.id"
                      :label="item.name"
                      :value="item.name"
                    />
                  </el-select>
                  <el-input v-model="dataForm.rhgnjcFkjh4" placeholder="" style="width: 45px" />
                  <span>°</span>
                </div>
              </div>
              <div v-if="scope.row.name == 'Worth-4-dot'">
                <div class="center">
                  <el-select v-model="dataForm.worth3" placeholder="" clearable style="display: inline-block;width: 100px" @change="selectWorth($event, 'os')">
                    <el-option
                      v-for="item in worthList"
                      :key="item.id"
                      :label="item.name"
                      :value="item.name"
                    />
                  </el-select>
                  @N(
                  <el-input v-model="dataForm.worth4" placeholder="" style="width: 100px" />
                  )
                </div>
              </div>
              <div v-if="scope.row.name == 'TITMUS(近)'">
                <div class="center">
                  <span>RDD(近):</span>
                  <el-select v-model="dataForm.rdd" placeholder="" clearable style="display: inline-block;width: 120px;margin-left: 8px">
                    <el-option
                      v-for="item in rddList"
                      :key="item.id"
                      :label="item.name"
                      :value="item.name"
                    />
                  </el-select>
                </div>
              </div>
            </template>
          </el-table-column>
        </el-table>
      </div>
    </div>
  </div>
</template>
<script>
import Keyboard from 'vue-keyboard'
// import 'vue-keyboard/dist/vue-keyboard.css'
// import { KEYBOARD_MAP, KEYS } from 'vue-keyboard/lib/keyboard-map';
export default {
  components: {
    Keyboard
  },
  props: {
    patientId: {
      type: String,
      default: ''
    },
    onlyRead: {
      type: Boolean,
      default: false
    },
    isPlatform: {
      type: Boolean,
      default: true
    },
    caseId: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      myLayout: [
        '1234567890{delete:backspace}|qwertyuiop|asdfghjkl|{shift:goto:1}zxcvbnm|{space:space}{custom:custom}',
        '@+-/%△°*()ᴿᴸ|1234567890|QWERTYUIOP|ASDFGHJKL|{shift:goto:0}ZXCVBNM|{space:space}{custom:custom}'
      ],
      // myLayout: '||{EX:EX}',
      focusItem: '',
      visibleFlag: true,
      symbolList: [
        {
          name: 'ᴿ/ʟ',
          id: '1'
        },
        {
          name: 'ᴸ/ʀ',
          id: '2'
        },
        {
          name: '△',
          id: '3'
        },
        {
          name: '°',
          id: '4'
        }
      ],
      ctList: [
        {
          name: '正位',
          id: '1'
        },
        {
          name: '△BI',
          id: '2'
        },
        {
          name: '△BO',
          id: '3'
        }
      ],
      retinaList: [
        {
          name: '是',
          id: '1'
        },
        {
          name: '否',
          id: '2'
        }
      ],
      checkList: [
        {
          name: '老虎/笼子（10°）',
          id: '1'
        },
        {
          name: '门/人（8°）',
          id: '2'
        },
        {
          name: '圆环/边框(1°/5°)',
          id: '3'
        },
        {
          name: '超人/月球（3°）',
          id: '4'
        },
        {
          name: '花心/花蕊（1°）',
          id: '5'
        }
      ],
      checkTwoList: [
        {
          name: '猫（10°）',
          id: '1'
        },
        {
          name: '机器猫（8°）',
          id: '2'
        },
        {
          name: '花（3°）',
          id: '3'
        },
        {
          name: '三人组（3°）',
          id: '4'
        },
        {
          name: '小车（1°）',
          id: '5'
        }
      ],
      separateList: [
        {
          name: '+',
          id: '1'
        },
        {
          name: '-',
          id: '2'
        }
      ],
      worthList: [
        {
          name: '5个',
          id: '1'
        },
        {
          name: '4个',
          id: '2'
        },
        {
          name: '3个',
          id: '3'
        },
        {
          name: '2个',
          id: '4'
        }
      ],
      titmusList: [
        {
          name: '苍蝇图（+）',
          id: '1'
        },
        {
          name: '800"',
          id: '2'
        },
        {
          name: '400"',
          id: '3'
        },
        {
          name: '200"',
          id: '4'
        },
        {
          name: '140"',
          id: '5'
        },
        {
          name: '100"',
          id: '6'
        },
        {
          name: '80"',
          id: '7'
        },
        {
          name: '60"',
          id: '8'
        },
        {
          name: '50"',
          id: '9'
        }
      ],
      tnoList: [
        {
          name: '480"',
          id: '1'
        },
        {
          name: '240"',
          id: '2'
        },
        {
          name: '120"',
          id: '3'
        },
        {
          name: '60"',
          id: '4'
        },
        {
          name: '无',
          id: '5'
        }
      ],
      rddList: [
        {
          name: '400"',
          id: '1'
        },
        {
          name: '200"',
          id: '2'
        },
        {
          name: '100"',
          id: '3'
        },
        {
          name: '60"',
          id: '4'
        },
        {
          name: '无',
          id: '5'
        }
      ],
      dataForm: {
        idList: [],
        jzNumber: '',
        patientId: '',
        patientName: '',
        patientSex: '',
        patientAge: '',
        // 屈光状态
        qgztOd1: '',
        qgztOd2: '',
        qgztOd3: '',
        qgztOs1: '',
        qgztOs2: '',
        qgztOs3: '',
        qgztOdVa: '',
        qgztOsVa: '',
        // CT+Prism
        ctPrism: '',
        ctPrismDw: '',
        // 检查画片
        tssjcJchp: '',
        // 主观斜视角
        tssjcZgxsj1: '',
        tssjcZgxsj2: '',
        // 客观斜视角
        tssjcKgxsj1: '',
        tssjcKgxsj2: '',
        // 检查画片融合
        rhgnjcJchp: '',
        // 融合点
        rhgnjcRhd: '',
        // 同时检查-分开/集合
        rhgnjcFkjh1: '',
        rhgnjcFkjh2: '',
        rhgnjcFkjh3: '',
        rhgnjcFkjh4: '',
        // Worth-4-dot
        worth1: '',
        worth2: '',
        worth3: '',
        worth4: '',
        // 立体式检查
        titmus: '',
        tno: '',
        rdd: '',
        // 同视机九方位检查
        jfwjcOd1: '',
        jfwjcOd1n: '',
        jfwjcOd2: '',
        jfwjcOd2n: '',
        jfwjcOd3: '',
        jfwjcOd3n: '',
        jfwjcOd4: '',
        jfwjcOd4n: '',
        jfwjcOd5: '',
        jfwjcOd5n: '',
        jfwjcOd6: '',
        jfwjcOd6n: '',
        jfwjcOd7: '',
        jfwjcOd7n: '',
        jfwjcOd8: '',
        jfwjcOd8n: '',
        jfwjcOd9: '',
        jfwjcOd9n: '',
        jfwjcOs1: '',
        jfwjcOs1n: '',
        jfwjcOs2: '',
        jfwjcOs2n: '',
        jfwjcOs3: '',
        jfwjcOs3n: '',
        jfwjcOs4: '',
        jfwjcOs4n: '',
        jfwjcOs5: '',
        jfwjcOs5n: '',
        jfwjcOs6: '',
        jfwjcOs6n: '',
        jfwjcOs7: '',
        jfwjcOs7n: '',
        jfwjcOs8: '',
        jfwjcOs8n: '',
        jfwjcOs9: '',
        jfwjcOs9n: '',
        // 报告描述
        bgms: '',
        sgsSign: '',
        riQi: ''
      },
      tableData: [
        {
          name: '基础信息',
          type: 'title'
        },
        {
          name: '屈光状态',
          type: ''
        }, {
          name: '屈光状态a',
          type: ''
        }, {
          name: 'CT+Prism',
          type: ''
        }, {
          name: '同时视检查',
          type: 'title'
        }, {
          name: '检查画片',
          type: '1'
        }, {
          name: '主观斜视角'
        }, {
          name: '客观斜视角'
        }, {
          name: '融合功能检查',
          type: 'title'
        }, {
          name: '检查画片',
          type: '2'
        }, {
          name: '融合点',
          type: ''
        }, {
          name: 'Worth-4-dot'
        }, {
          name: '立体式检查',
          type: 'title'
        }, {
          name: 'TITMUS(近)'
        }, {
          name: '同视机九方位检查',
          type: 'title'

        }, {
          name: 'ODOS',
          a: '',
          b: '',
          c: '',
          d: '',
          e: '',
          f: '',
          g: '',
          h: '',
          i: '',
          j: '',
          k: '',
          l: '',
          m: '',
          n: '',
          o: '',
          p: '',
          q: '',
          r: ''
        }, {
          name: '报告描述:'
        }, {
          name: '签名'
        }],
      machineData: [
        {
          name: '1'
        },
        {
          name: '2'
        }, {
          name: '3'
        },
        {
          name: '4'
        },
        {
          name: '5'
        }, {
          name: '6'
        }
      ]
    }
  },
  watch: {
    caseId(val) {
      if (val) {
        this.getSysgnjc()
      }
    }
  },
  mounted() {
    this.getSysgnjc()
    this.getPatientData()
  },
  methods: {
    async getSysgnjc() {
      const { data: res } = await this.$http.get('/sjsgnjc/getSysgnjc', { params: {
        caseId: this.caseId,
        patientId: this.patientId
      }})
      if (res.code === 0) {
        const R = /右上/g
        const L = /左上/g
        for (const key in res.data) {
          if (typeof res.data[key] === 'string') {
            res.data[key] = res.data[key].replace(R, 'ᴿ/ʟ')
            res.data[key] = res.data[key].replace(L, 'ᴸ/ʀ')
          }
        }
        this.dataForm = res.data
        this.dataForm.jzNumber = window.sessionStorage.getItem('jzNumber')
        if (!this.dataForm.id) {
          await this.queryProject()
          this.dataForm.tssjcJchp = '老虎/笼子（10°）'
          this.dataForm.rhgnjcJchp = '三人组（3°）'
          this.dataForm.titmus = '60"'
          this.dataForm.tno = '60"'
          this.dataForm.rdd = '100"'
          this.dataForm.worth1 = this.dataForm.worth3 = '4个'
          this.dataForm.worth2 = this.dataForm.worth4 = '融像'
          this.setSign()
        }
      }
    },
    handleInput(item, input) {
      if (input === 'ᴿ') {
        input = 'ᴿ/ʟ'
      } else if (input === 'ᴸ') {
        input = 'ᴸ/ʀ'
      }
      if (input === '') {
        this.dataForm[item] = ''
      } else {
        this.dataForm[item] = this.dataForm[item] ? this.dataForm[item] + input : input
      }
    },
    handleZg() {
      this.dataForm.rhgnjcRhd = this.dataForm.tssjcZgxsj1
    },
    // 获取报告 单id
    async queryProject() {
      const project = window.sessionStorage.getItem('projectItem') ? JSON.parse(window.sessionStorage.getItem('projectItem')) : []
      const { data: res } = await this.$http.get(
        '/patient/getZlItemDict',
        {
          params: {
            caseName: '三级视功能检查报告单'
          }
        }
      )
      if (res.code === 0) {
        const data = res.data || []
        const list = []
        if (data.length) {
          for (let i = 0; i < data.length; i++) {
            for (let j = 0; j < project.length; j++) {
              if (data[i].itemId === project[j].porjectCode) {
                list.push(project[j].id)
              }
            }
          }
          this.dataForm.idList = list
        }
      } else {
        this.$message.error(res.msg)
      }
    },
    setSign() {
      const userData = window.sessionStorage.getItem('qg-userData')
      const date = this.$moment().format('YYYY-MM-DD')
      this.dataForm.sgsSign = userData.signImgBase
      this.dataForm.riQi = date
    },
    async getPatientData() {
      const { data: res } = await this.$http.get(
        '/patient/view/getPatientData',
        {
          params: {
            patientId: this.patientId
          }
        }
      )
      if (res.code === 0) {
        this.dataForm.patientId = res.data.patientId
        this.dataForm.patientAge = res.data.patientAge
        this.dataForm.patientSex = res.data.patientSex
        this.dataForm.patientName = res.data.patientName
      } else {
        this.$message.error(res.msg)
      }
    },
    selectWorth(val, type) {
      if (val === '5个') {
        type === 'od' ? this.dataForm.worth2 = '复视' : this.dataForm.worth4 = '复视'
      } else if (val === '4个') {
        type === 'od' ? this.dataForm.worth2 = '融像' : this.dataForm.worth4 = '融像'
      } else if (val === '3个') {
        type === 'od' ? this.dataForm.worth2 = '右眼抑制' : this.dataForm.worth4 = '右眼抑制'
      } else if (val === '2个') {
        type === 'od' ? this.dataForm.worth2 = '左眼抑制' : this.dataForm.worth4 = '左眼抑制'
      }
    },
    // 保存
    async handleSaveTable() {
      const R = /ᴿ\/ʟ/g
      const L = /ᴸ\/ʀ/g
      for (const key in this.dataForm) {
        if (typeof this.dataForm[key] === 'string') {
          this.dataForm[key] = this.dataForm[key].replace(R, '右上')
          this.dataForm[key] = this.dataForm[key].replace(L, '左上')
        }
      }
      const data = JSON.parse(JSON.stringify(this.dataForm))
      const params = {
        caseId: this.caseId,
        ...data
      }
      const { data: res } = await this.$http.post('/sjsgnjc/savesjsgnjc', params)
      if (res.code === 0) {
        await this.getSysgnjc()
        this.$message.success('保存成功')
      } else {
        this.$message.error(res.msg)
      }
    },
    handleDelete() {
      const params = {
        id: this.caseId
      }
      this.$confirmFun('你确定要删除吗？').then(async() => {
        await this.deleteNewForm()
        const { data: res } = await this.$http.post('/case/delete', params)
        if (res.code === 0) {
          this.$message.success('删除成功')
          await this.$parent.getFormList()
        } else {
          this.$message.error(res.msg)
        }
      })
    },
    async deleteNewForm() {
      const params = {
        id: this.caseId
      }
      const { data: res } = await this.$http.post('/sjsgnjc/delSysgnjc', params)
      if (res.code === 0) {
      } else {
        this.$message.error(res.msg)
      }
    },
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      if (columnIndex === 0) {
        if (rowIndex === 0 || rowIndex === 4 || rowIndex === 8 || rowIndex === 12 || rowIndex === 17 || rowIndex === 15 || rowIndex === 14) {
          return {
            rowspan: 1,
            colspan: 3
          }
        } else if (rowIndex === 1) {
          return {
            rowspan: 2,
            colspan: 1
          }
        } else if (rowIndex === 2 || rowIndex === 4) {
          return {
            rowspan: 0,
            colspan: 0
          }
        }
      } else if (columnIndex === 1) {
        if (rowIndex === 3 || rowIndex === 5 || rowIndex === 9) {
          return {
            rowspan: 1,
            colspan: 2
          }
        } else if (rowIndex === 16) {
          return {
            rowspan: 1,
            colspan: 2
          }
        } else if (rowIndex === 0 || rowIndex === 4 || rowIndex === 8 || rowIndex === 9 || rowIndex === 12 || rowIndex === 14 || rowIndex === 15 || rowIndex === 16 || rowIndex === 17) {
          return {
            rowspan: 0,
            colspan: 0
          }
        }
      } else if (columnIndex === 2 || columnIndex === 1) {
        if (rowIndex === 0 || rowIndex === 3 || rowIndex === 4 || rowIndex === 5 || rowIndex === 9 || rowIndex === 8 || rowIndex === 12 || rowIndex === 14 || rowIndex === 15 || rowIndex === 16 || rowIndex === 17) {
          return {
            rowspan: 0,
            colspan: 0
          }
        }
      }
    }
  }
}
</script>

<style lang="scss" scoped>
#operation-record{
  height: 100%;
  overflow: auto;
  .flex{
    display: flex;
  }
  .j-c{
    justify-content: center;
  }
  .weight7{
    font-weight: 700;
  }
  .btnBox{
    display: flex;
    justify-content: flex-end;
  }
  .width-50 {
    .el-input {
      width: 50px;
    }
  }
  .width-70 {
    .el-input {
      width: 70px;
    }
  }
  .width-100 {
    .el-input {
      width: 100px;
    }
  }
  .width-120 {
    .el-input {
      width: 120px;
    }
  }
  .width-180 {
    .el-input {
      width: 180px;
    }
  }
  .operation-record-table {
    width: 840px !important;
    padding-right: 8px;
  }

}
#threeFunc{
  ::v-deep .el-input__inner {
    border: none;
    line-height: 26px !important;
    text-align: center;
    border-bottom: 1px solid #ccc;
    border-radius: 0;
    padding: 0;
  }
  .el-textarea__inner{
    border: none;
  }
  .el-input__prefix {
    display: none;
  }
  .center {
    display: flex;
    text-align: left;
  }
  .left {
    text-align: left;
  }
  .Rline{
    position: absolute;
    left: 0px;
    top: 132px;
  }
  .Rline-os{
    position: absolute;
    right: 0px;
    top: 132px;
  }
  .Lline{
    position: absolute;
    left: 383px;
    top: 132px;
  }
  .Lline-os{
    position: absolute;
    right: 383px;
    top: 132px;
  }
  .rowLine{
    width: 200px;
    height: 50px;
    position: absolute;
    left: 100px;
    top: 70px;
    border-top: 1px solid #000;
    border-bottom: 1px solid #000;
  }
  .rowLine-l{
    width: 200px;
    height: 50px;
    position: absolute;
    right: 100px;
    top: 70px;
    border-top: 1px solid #000;
    border-bottom: 1px solid #000;
  }
  .cloLine{
    width: 60px;
    height: 160px;
    left: 170px;
    top: 20px;
    position: absolute;
    border-left: 1px solid #000;
    border-right: 1px solid #000;
  }
  .cloLine-l{
    width: 60px;
    height: 160px;
    right: 170px;
    top: 20px;
    position: absolute;
    border-left: 1px solid #000;
    border-right: 1px solid #000;
  }
  .ipt-a{
    width: 50px;
    left: 114px;
    top: 33px;
    position: absolute;
  }
  .ipt-b{
    width: 50px;
    left: 176px;
    top: 33px;
    position: absolute;
  }
  .ipt-c{
    width: 50px;
    left: 242px;
    top: 33px;
    position: absolute;
  }
  .ipt-d{
    width: 50px;
    left: 114px;
    top: 80px;
    position: absolute;
  }
  .ipt-e{
    width: 50px;
    left: 176px;
    top: 80px;
    position: absolute;
  }
  .ipt-f{
    width: 50px;
    left: 242px;
    top: 80px;
    position: absolute;
  }
  .ipt-g{
    width: 50px;
    left: 114px;
    top: 133px;
    position: absolute;
  }
  .ipt-h{
    width: 50px;
    left: 176px;
    top: 133px;
    position: absolute;
  }
  .ipt-j{
    width: 50px;
    left: 242px;
    top: 133px;
    position: absolute;
  }
  .iptos-a {
    width: 50px;
    right: 114px;
    top: 33px;
    position: absolute;
  }
  .iptos-b {
    width: 50px;
    right: 176px;
    top: 33px;
    position: absolute;
  }
  .iptos-c {
    width: 50px;
    right: 242px;
    top: 33px;
    position: absolute;
  }
  .iptos-d {
    width: 50px;
    right: 114px;
    top: 80px;
    position: absolute;
  }
  .iptos-e {
    width: 50px;
    right: 176px;
    top: 80px;
    position: absolute;
  }
  .iptos-f {
    width: 50px;
    right: 242px;
    top: 80px;
    position: absolute;
  }
  .iptos-g {
    width: 50px;
    right: 114px;
    top: 133px;
    position: absolute;
  }
  .iptos-h {
    width: 50px;
    right: 176px;
    top: 133px;
    position: absolute;
  }
  .iptos-j {
    width: 50px;
    right: 242px;
    top: 133px;
    position: absolute;
  }
  .operation-text {
    font-weight: 700;
  }
  .text {
    font-weight: 700;
  }
  .sign {
    cursor: pointer;
    color: #46a1ff;
    font-weight: 400;
  }
}
</style>
<style lang="scss">
#threeFunc{
  .operation-record-table{
    .el-input__inner {
      padding: 0;
      border: none;
      text-align: center;
      border-radius: 0;
    }
    .machineBox{
      .el-table__cell {
        height: 24px;
      }
      .el-table td {
        border-color: #cbc8c8;
      }
      .el-table tr{
        td:nth-child(1) {
          border-right: 1px solid #212020;
        }
        td:nth-child(2) {
          border-right: 1px solid #212020;
        }

      }
      .el-table tbody {
        tr:nth-child(2) {
          td{
            border-bottom: 1px solid #212020;
          }
        }
        tr:nth-child(4) {
          td{
            border-bottom: 1px solid #212020;
          }
        }
        tr:nth-child(6) {
          td{
            border-bottom: 1px solid #212020;
          }
        }
      }

    }
  }
  .el-table__cell{
    padding: 6px 0 !important;
  }
  .el-input-group__append, .el-input-group__prepend{
    padding: 0 5px !important;
  }
  .el-input__prefix {
    //display: none;
  }
  .el-icon-arrow-up{
    display: none;
  }
  .el-textarea__inner{
    border: none;
  }
  .el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell {
    background: none !important;
  }
  .has-gutter {
    display: none;
    .cell {
      font-weight: 700;
    }
    .el-table__cell {
      background: #ced4d9;
    }
  }
  .el-table__header-wrapper{
    display: none;
  }
  .el-table th {
    border-color: #8e8c8c;
  }
  .el-table td {
    border-color: #8e8c8c;
  }
  .el-table--group,
  .el-table--border {
    border: 1px solid #8e8c8c !important;
    border-bottom: none !important;
  }
}
</style>
