1.做适应平板显示的内容大小

loulijun2021

2022-08-05 d33eacc1f85ac3a736b33ba4713a19aae466d711

 src/views/zlgl/gxjy.vue

@@ -15,7 +15,7 @@
          />
        </div>
        <!--        六项信息      -->
        <div style="display:flex;margin-top: 10px;align-items: center; line-height: 50px">
        <div v-if="!isIpad" style="display:flex;margin-top: 10px;align-items: center; line-height: 50px">
          <div style="display: flex;">
            <div style="display: flex;margin-right: 50px">
              <div style="width: 90px">工单编码：</div>
@@ -39,14 +39,46 @@
          <div style=" display: flex;margin-left: 30px;">
            <div style="display: flex;margin-right: 50px">
              <div style="width: 90px">工序编码：</div>
              <div>{{ form.stepcode }}</div>
              <div style="width: 100px">{{ form.stepcode }}</div>
            </div>
            <div style="display: flex;">
              <div style="width: 90px">工序名称：</div>
              <div>{{ form.stepname }}</div>
              <div style="width: 100px">{{ form.stepname }}</div>
            </div>
          </div>
        </div>
        <div v-if="isIpad" style="display:flex;margin-top: 10px;align-items: center;line-height: 30px; flex-direction: column">
          <div style="display: flex; justify-content: flex-start;width: 100%">
            <div style="display: flex;margin-right: 50px">
              <div style="width: 90px">工单编码：</div>
              <div style="width: 200px">{{ form.wo_code }}</div>
            </div>
            <div style="display: flex;margin-right: 50px">
              <div style="width: 90px">产品编码：</div>
              <div style="width: 200px">{{ form.partcode }}</div>
            </div>
            <div style="display: flex;">
              <div style="width: 90px">产品名称：</div>
              <div style="width: 200px">{{ form.partname }}</div>
            </div>
          </div>

          <div style=" display: flex; justify-content: flex-start;margin-top: 10px;width: 100%">
            <div style="display: flex;margin-right: 50px">
              <div style="width: 90px">产品规格：</div>
              <div style="width: 200px">{{ form.partspec }}</div>
            </div>
            <div style="display: flex;margin-right: 50px">
              <div style="width: 90px">工序编码：</div>
              <div style="width: 200px">{{ form.stepcode }}</div>
            </div>
            <div style="display: flex;">
              <div style="width: 90px">工序名称：</div>
              <div style="width: 200px">{{ form.stepname }}</div>
            </div>
          </div>
        </div>

        <div style="margin: 15px 0;font-size: 14px">
          <i class="el-icon-s-operation" style="color:#42b983; margin-right: 5px" />检验标准信息
        </div>
@@ -266,6 +298,7 @@
  // },
  data() {
    return {
      isIpad: false,
      mainHeight: 0,
      tableHeight: 0,
      form: { // 工序
@@ -294,13 +327,12 @@
      JYSelectedArr: [], // 已选检验项目数组
      multipleSelection: [], // 表格多选框
      tabClickIndex: null, // 点击的单元格
      tabClickLabel: '' // 当前点击的列名
      tabClickLabel: '', // 当前点击的列名
      isCancel: false// 是否点击取消按钮
    }
  },
  created() {
    this.getMesOrderStepCheckSelect()
    this.getMesOrderSelectUser()
    this.getJYSelectArr()
    this.handleRequest()
  },
  mounted() {
    window.addEventListener('resize', this.getHeight)
@@ -309,6 +341,15 @@
    this.getFocus()
  },
  methods: {
    handleRequest() {
      this.getMesOrderStepCheckSelect().then(res => {
        if (res.code === '200') {
          this.getMesOrderSelectUser()
          this.getJYSelectArr()
        }
      })
    },

    // 获取聚焦
    getFocus() {
      this.$nextTick(() => {
@@ -317,8 +358,9 @@
    },
    // 获取检验标准下拉数组
    async getMesOrderStepCheckSelect() {
      const { data: res } = await MesOrderStepCheckSelect()
      this.checkStandardSelect = res
      const res = await MesOrderStepCheckSelect()
      this.checkStandardSelect = res.data
      return { code: res.code }
    },
    // 获取检验人员下拉
    async getMesOrderSelectUser() {
@@ -332,6 +374,7 @@
    },
    // 检验标准下拉值改变
    async changeCheckStandard(val) {
      this.isCancel = false
      this.JYSelectedArr = []
      const { data: res } = await MesOrderStepCheckItemList({ checkstandcode: val })
      this.JYTableData = res
@@ -371,6 +414,9 @@
        this.checkResult = 'OK'
      } else {
        this.checkResult = 'NG'
      }
      if (this.isCancel) {
        this.checkResult = ''
      }
    },
    // 检验项目编码（名称）
@@ -525,6 +571,7 @@
    clearContent() {
      this.JYTableData = []
      this.multipleSelection = []
      this.JYSelectedArr = []
      this.checkdescr = ''
      this.checkUser = ''
      this.checkResult = ''
@@ -536,6 +583,8 @@
      this.form.partspec = ''
      this.form.stepcode = ''
      this.form.stepname = ''

      this.isCancel = true
    },

    // 单元格被点击时
@@ -569,6 +618,8 @@
      this.$nextTick(() => {
        this.mainHeight = window.innerHeight - 250
        this.tableHeight = this.mainHeight - 100

        this.isIpad = window.innerHeight < 769
      })
    }
  }