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

loulijun2021

2022-08-05 d33eacc1f85ac3a736b33ba4713a19aae466d711

 src/views/zzmx/gxdy.vue

@@ -17,7 +17,13 @@
              <el-input v-model="form.stepname" placeholder="请输入" style="width: 200px" />
            </el-form-item>
            <el-form-item label="启用状态" style=" display: flex;">
              <el-select v-model="form.enable" :popper-append-to-body="false" style="width: 200px" placeholder="请选择">
              <el-select
                v-model="form.enable"
                filterable
                :popper-append-to-body="false"
                style="width: 200px"
                placeholder="请选择"
              >
                <el-option
                  v-for="item in enableArr"
                  :key="item.code"
@@ -29,6 +35,7 @@
            <el-form-item label="工序类型" style=" display: flex;">
              <el-select
                v-model="form.steptypecode"
                filterable
                :popper-append-to-body="false"
                style="width: 200px"
                placeholder="请选择"
@@ -54,7 +61,7 @@
      <el-divider />
      <div style="margin-left: 10px;display: flex">
        <el-button type="primary" icon="el-icon-circle-plus-outline" @click="add('add')">新增</el-button>
        <el-button type="primary" icon="el-icon-upload2" @click="upload">导入</el-button>
        <!--        <el-button type="primary" icon="el-icon-upload2" @click="upload">导入</el-button>-->
      </div>
      <el-divider />
      <div class="elTableDiv">
@@ -77,19 +84,23 @@
            prop="RowNum"
            width="50"
            label="序号"
            fixed
          />
          <el-table-column
            prop="stepcode"
            label="工序编码"
            min-width="150"
            sortable="custom"
          />
          <el-table-column
            prop="stepname"
            min-width="150"
            label="工序名称"
            sortable="custom"
          />
          <el-table-column
            prop="flwtype"
            min-width="150"
            label="工序类型"
            sortable="custom"
          >
@@ -102,42 +113,74 @@
          <el-table-column
            prop="descr"
            label="工序描述"
            min-width="180"
            sortable="custom"
          />
          <el-table-column
            prop="enable"
            label="启用状态"
            sortable="custom"
            width="110"
          >
            <template slot-scope="{row}">
              <div v-if="row.enable==='Y'">是</div>
              <div v-if="row.enable==='N'">否</div>
            </template>
          </el-table-column>
          <el-table-column
            prop="lm_user"
            label="创建人员"
            width="110"
            sortable="custom"
          />
          <el-table-column
            prop="lm_date"
            label="创建时间"
            width="160"
            sortable="custom"
          />
          <el-table-column
            label="关联工作站"
            prop="is_eqp"
            width="110"
          >
            <template slot-scope="{row}">
              <div class="operationClass">
                <i class="el-icon-share" @click="workClick(row)" />
                <i v-if="row.is_eqp==='Y'" class="el-icon-share" @click="workClick(row)" />
                <i
                  v-if="row.is_eqp==='N'"
                  class="el-icon-share"
                  style="color: rgb(180 ,181, 185)"
                  @click="workClick(row)"
                />
              </div>
            </template>
          </el-table-column>
          <el-table-column
            label="关联缺陷"
            prop="is_defect"
            width="110"
          >
            <template slot-scope="{row}">
              <div class="operationClass">
                <i class="el-icon-share" @click="defectClick(row)" />
                <i v-if="row.is_defect==='Y'" class="el-icon-share" @click="defectClick(row)" />
                <i
                  v-if="row.is_defect==='N'"
                  class="el-icon-share"
                  style="color:rgb(180 ,181, 185);"
                  @click="defectClick(row)"
                />
              </div>
            </template>
          </el-table-column>
          <el-table-column
            label="操作"
            fixed="right"
            width="120"
          >
            <template slot-scope="{row}">
              <div class="operationClass">
                <el-button type="text" @click="edit('edit',row)">修改</el-button>
                <el-button type="text" @click="edit('edit',row)">编辑</el-button>
                <el-button type="text" @click="del(row)">删除</el-button>
              </div>
            </template>
@@ -157,10 +200,11 @@
      />
    </div>

    <!--新增修改对话框-->
    <el-dialog
      :title="operation==='add'?'新增':'修改'"
      :title="operation==='add'?'新增':'编辑'"
      :visible.sync="dialogVisible"
      width="50%"
      width="800px"
      :close-on-click-modal="false"
      top="15vh"
      @closed="handleClose"
@@ -168,30 +212,44 @@
    >
      <el-form ref="dialogForm" inline :rules="dialogFormRules" :model="dialogForm" label-width="80px">
        <el-form-item label="工序编码" prop="stepcode">
          <el-input v-model="dialogForm.stepcode" :disabled="operation!=='add'" style="width: 220px" />
          <el-input v-model="dialogForm.stepcode" :disabled="operation!=='add'" style="width: 200px" />
        </el-form-item>
        <el-form-item label="工序名称" prop="stepname">
          <el-input v-model="dialogForm.stepname" style="width: 220px" />
          <el-input v-model="dialogForm.stepname" style="width: 200px" />
        </el-form-item>

        <el-form-item prop="steptypecode" label="工序类型">
          <el-select
          <el-radio-group
            v-model="dialogForm.steptypecode"
            style="width: 220px"
            placeholder="请选择"
            :popper-append-to-body="false"
            style="width: 200px"
          >
            <el-option
            <el-radio
              v-for="item in steptypeArr"
              :key="item.code"
              :label="item.name"
              :value="item.code"
              :label="item.name"
            />
          </el-select>
          </el-radio-group>
          <!--          <el-select-->
          <!--            v-model="dialogForm.steptypecode"-->
          <!--            filterable-->
          <!--            style="width: 200px"-->
          <!--            placeholder="请选择"-->
          <!--            :popper-append-to-body="false"-->
          <!--          >-->
          <!--            <el-option-->
          <!--              v-for="item in steptypeArr"-->
          <!--              :key="item.code"-->
          <!--              :label="item.name"-->
          <!--              :value="item.code"-->
          <!--            />-->
          <!--          </el-select>-->
        </el-form-item>
        <el-form-item prop="enable" label="启用状态">
          <el-select
            v-model="dialogForm.enable"
            style="width: 220px"
            filterable
            style="width: 200px"
            placeholder="请选择"
            :popper-append-to-body="false"
          >
@@ -204,7 +262,7 @@
          </el-select>
        </el-form-item>
        <el-form-item label="工序描述" prop="description">
          <el-input v-model="dialogForm.description" type="textarea" style="width: 220px" />
          <el-input v-model="dialogForm.description" type="textarea" style="width: 200px" />
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
@@ -214,18 +272,135 @@
        </div>
      </span>
    </el-dialog>

    <!--    关联工作站对话框-->
    <el-dialog
      title="关联工作站"
      :visible.sync="workDialogVisible"
      width="50%"
      :top="isIpad?'5vh': '15vh'"
      :close-on-click-modal="false"
      class="workDialogVisible"
      @closed="workHandleClose"
      @close="workHandleClose"
    >
      <!--      @opened="handleOpenedRoles"-->

      <div>
        <i class="el-icon-s-comment" style="color:#42b983;" /> 工序名称：{{ workDialogForm.stepname }}
      </div>
      <el-divider />
      <div>
        <div style="margin-bottom:20px">
          <i class="el-icon-s-operation" style="color:#42b983;" /> 工作站集合：
        </div>
        <div class="myCheckboxGroup">
          <div
            v-for="item in workDialogForm.workGatherArr"
            :key="item.code"
            :style="{border:item.isSelected1?'1px solid #42b983':'1px solid #eee'}"
            class="myCheckbox"
            @click="myCheckboxClick(item)"
          >
            <input
              class="myCheckboxInput"
              type="checkbox"
              :value="item.code"
              name="gather"
              :style="{color:item.isSelected2?'#42b983':'#fff'}"
              @click="myCheckboxInputClick(item)"
            >{{ item.name }}
            <!--            父子点击事件不影响-->
            <!--            onClick="event.cancelBubble = true"-->
          </div>
        </div>
      </div>
      <el-divider />
      <div>
        <div style="margin-bottom:20px">
          <i class="el-icon-s-operation" style="color:#42b983;" /> 工作站：
        </div>
        <el-tree
          ref="workTree"
          :data="workDialogForm.workTreeArr"
          show-checkbox
          node-key="code"
          style="height: 280px;"
          default-expand-all
          :props="workTreeDefaultProps"
          @check="checkBoxClick"
        />
        <!--        @check-change="checkChange"-->

      </div>
      <span slot="footer" class="dialog-footer">
        <div class="footerButton">
          <el-button @click="workDialogVisibleCancel">取 消</el-button>
          <el-button type="primary" @click="workDialogVisibleConfirm">确 定</el-button>
        </div>
      </span>
    </el-dialog>

    <!--    关联缺陷对话框-->
    <el-dialog
      title="工序关联缺陷"
      :visible.sync="defectDialogVisible"
      width="50%"
      :top="isIpad?'5vh':'15vh'"
      :close-on-click-modal="false"
      class="defectDialogVisible"
      @closed="defectHandleClose"
      @close="defectHandleClose"
    >
      <!--      @opened="handleOpenedRoles"-->

      <div style="margin-bottom: 20px">
        <i class="el-icon-s-comment" style="color:#42b983;" /> 工序名称：{{ defectTreeName }}
      </div>

      <div>
        <!--        <div style="margin-bottom:20px">-->
        <!--          <i class="el-icon-s-operation" style="color:#42b983;" /> 工作站：-->
        <!--        </div>-->
        <el-tree
          ref="defectTree"
          :data="defectTree"
          show-checkbox
          node-key="code"
          style="height: 400px;"
          default-expand-all
          :props="workTreeDefaultProps"
        />
        <!--        @check="checkBoxClick"-->
        <!--        @check-change="checkChange"-->

      </div>
      <span slot="footer" class="dialog-footer">
        <div class="footerButton">
          <el-button @click="defectDialogVisibleCancel">取 消</el-button>
          <el-button type="primary" @click="defectDialogVisibleConfirm">确 定</el-button>
        </div>
      </span>
    </el-dialog>

  </div>
</template>

<script>
import Pagination from '@/components/Pagination'
import { AddUpdateOrganization, DeleteOrganization, OrganizationSearch, PrentOrganization } from '@/api/jcsz'
import { getCookie } from '@/utils/auth'
import { AddUpdateStep, DeleteStep, StepSearch } from '@/api/zzmx'
import {
  AddUpdateStep,
  DeleteStep, SaveStepAssociationDefect,
  SaveStepAssociationEqp,
  StepAssociationDefect,
  StepAssociationEqp,
  StepSearch
} from '@/api/zzmx'
import $ from 'jquery'

const SER_HZ = /^[\u4e00-\u9fa5]+$/
export default {
  name: 'Zzjg',
  name: 'GXDY',
  components: {
    Pagination
  },
@@ -242,6 +417,7 @@
      }
    }
    return {
      isIpad: false,
      mainHeight: 0,
      tableHeight: 0,
      form: {
@@ -261,18 +437,18 @@
      ],
      steptypeArr: [
        { code: 'Z', name: '自制' },
        { code: 'W', name: '外协' },
        { code: 'Z;W', name: '自制；外协' }
        { code: 'W', name: '外协' }
        // { code: 'Z;W', name: '自制；外协' }
      ],
      total: 10,
      tableData: [],
      dialogVisible: false,
      dialogForm: {
        'idid': '',
        'id': '',
        'stepcode': '',
        'stepname': '',
        'steptypecode': '',
        'enable': '',
        'steptypecode': '自制',
        'enable': 'Y',
        'description': '',
        'OperType': ''
      },
@@ -290,8 +466,26 @@
        enable: [
          { required: true, message: '请选择状态', trigger: ['blur', 'change'] }
        ]

      }
      },
      workDialogVisible: false,
      workDialogForm: {
        stepcode: '', // 工序编码
        stepname: '', // 工序名称
        workArr: [], //  工作站所有数组
        workGatherArr: [], // 工作站集合数组
        workCodeSelectedGatherArr: [], // 工作站选中集合的code数组
        workTreeArr: [], // 工作站树数组
        workTreeSelectedArr: []// 工作站树选中的数组code集合
      },
      workTreeDefaultProps: {
        value: 'code',
        label: 'name',
        children: 'children'
      },
      defectDialogVisible: false,
      defectTreeCode: '',
      defectTreeName: '',
      defectTree: []

    }
  },
@@ -352,7 +546,7 @@
        this.dialogForm.id = row.id
        this.dialogForm.stepcode = row.stepcode
        this.dialogForm.stepname = row.stepname
        this.dialogForm.steptypecode = row.flwtype
        this.dialogForm.steptypecode = this.steptypeArr.find(item => item.code === row.flwtype).name
        this.dialogForm.description = row.descr
        this.dialogForm.enable = row.enable
      })
@@ -378,8 +572,8 @@
    handleClose() {
      this.dialogForm.stepcode = ''
      this.dialogForm.stepname = ''
      this.dialogForm.steptypecode = ''
      this.dialogForm.enable = ''
      this.dialogForm.steptypecode = '自制'
      this.dialogForm.enable = 'Y'
      this.dialogForm.description = ''
      this.$refs.dialogForm.clearValidate()
    },
@@ -395,7 +589,7 @@
            id: this.dialogForm.id,
            stepcode: this.dialogForm.stepcode,
            stepname: this.dialogForm.stepname,
            steptypecode: this.dialogForm.steptypecode,
            steptypecode: this.steptypeArr.find(item => item.name === this.dialogForm.steptypecode).code,
            enable: this.dialogForm.enable,
            description: this.dialogForm.description,
            OperType: this.operation === 'add' ? 'Add' : 'Update'
@@ -416,19 +610,348 @@
    getHeight() {
      this.$nextTick(() => {
        this.mainHeight = window.innerHeight - 250
        this.tableHeight = this.mainHeight - 100
        this.tableHeight = this.mainHeight - 50
        if (window.innerHeight < 769) {
          this.tableHeight = this.tableHeight - 50
        }
        this.isIpad = window.innerHeight < 769
      })
    },
    /* 关联工作站模块*/
    // 关联工作站点击
    workClick(row) {
    async workClick(row) {
      this.workDialogVisible = true
      this.workDialogForm.stepcode = row.stepcode
      this.workDialogForm.stepname = row.stepname
      const { data: res } = await StepAssociationEqp({ stepcode: this.workDialogForm.stepcode })
      this.workDialogForm.workArr = res
      let workGatherArr = []
      if (row.flwtype === 'W') { // 外协情况下
        workGatherArr = this.workDialogForm.workArr.filter(item => item.type === 'W')
      } else if (row.flwtype === 'Z') { // 自制情况下
        workGatherArr = this.workDialogForm.workArr.filter(item => item.type === 'E')
      } else { // 自制＋外协
        workGatherArr = this.workDialogForm.workArr
      }
      // this.workDialogForm.workArr[1].children = []
      const nodeKey = []// 需要树形数显的值
      workGatherArr.forEach((item, index) => {
        this.workDialogForm.workGatherArr.push({
          isSelected1: index === 0,
          isSelected2: item.flag === 'Y',
          code: item.code,
          name: item.name,
          type: item.type,
          flag: item.flag
        })
        if (item.flag === 'Y' && item.children && item.children.length > 0) {
          this.$nextTick(() => {
            $("input[name='gather']").eq(index).prop('checked', true)// 自定义单选框回显
          })
          item.children.forEach(it => {
            if (it.flag === 'Y') {
              nodeKey.push(it.code)
            }
          })
        }
        if (index === 0) {
          if (item.children && item.children.length > 0) {
            this.workDialogForm.workTreeArr = this.workDialogForm.workArr.filter(it => it.code === item.code)
            this.workDialogForm.workTreeArr[0].name = '全部'
          }
        }
        // item.flag === 'Y'&&item
      })
      console.log(nodeKey, 1)
      this.$refs.workTree.setCheckedKeys(nodeKey)
      this.workDialogForm.workTreeSelectedArr = nodeKey

      console.log(this.workDialogForm.workGatherArr, 6)
      console.log(this.workDialogForm.workTreeArr, 7)
    },
    // 大盒子点击事件
    myCheckboxClick(val) {
      console.log(val.code, 3)
      // 点击不同的盒子进行选中样式切换
      this.workDialogForm.workGatherArr.find(item => {
        item.isSelected1 = item.code === val.code
      })
      this.workDialogForm.workTreeArr = this.workDialogForm.workArr.filter(item => item.code === val.code)
      if (this.workDialogForm.workTreeArr[0].children && this.workDialogForm.workTreeArr[0].children.length > 0) {
        this.workDialogForm.workTreeArr[0].name = '全部'
      } else {
        this.workDialogForm.workTreeArr = []
      }

      console.log(this.workDialogForm.workTreeArr, 8)
    },
    // 小盒子点击事件
    myCheckboxInputClick(val) {
      val.isSelected2 = !val.isSelected2
      console.log(val.code, 1)
      this.workDialogForm.workCodeSelectedGatherArr = [...new Set(this.workDialogForm.workCodeSelectedGatherArr)]
      // 1.第一种情况  小盒子从没选中到选中
      if (val.isSelected2) {
        console.log('1.第一种情况  小盒子从没选中到选中')
        this.workDialogForm.workCodeSelectedGatherArr.push(val.code)

        this.workDialogForm.workArr.forEach((item, index) => {
          if (item.code === val.code) {
            item.flag = 'Y'
            if (item.children && item.children.length > 0) {
              item.children.forEach(it => {
                it.flag = 'Y'
                this.workDialogForm.workTreeSelectedArr.push(it.code)
              })
            }
          }
        })
      }

      // 2.第二种情况  小盒子从选中到没选中
      if (!val.isSelected2) {
        console.log('2.第二种情况  小盒子从选中到没选中')
        this.workDialogForm.workCodeSelectedGatherArr = this.workDialogForm.workCodeSelectedGatherArr.filter(item => item !== val.code)
        this.workDialogForm.workArr.forEach((item, index) => {
          if (item.code === val.code) {
            item.flag = 'N'
            if (item.children && item.children.length > 0) {
              item.children.forEach(it => {
                it.flag = 'N'
                this.workDialogForm.workTreeSelectedArr.forEach((i, ind) => {
                  if (i === it.code) {
                    this.workDialogForm.workTreeSelectedArr.splice(ind, 1)
                  }
                })
              })
            }
          }
        })
      }
      this.workDialogForm.workCodeSelectedGatherArr = [...new Set(this.workDialogForm.workCodeSelectedGatherArr)]

      console.log(this.workDialogForm.workCodeSelectedGatherArr, 2)
      console.log(this.workDialogForm.workTreeSelectedArr, 23)
      // this.$refs.workTree.setCheckedKeys(this.workDialogForm.workCodeSelectedGatherArr)
      this.$refs.workTree.setCheckedKeys(this.workDialogForm.workTreeSelectedArr)
    },
    // 树形中 框选中
    checkBoxClick(obj, { checkedNodes, checkedKeys, halfCheckedNodes, halfCheckedKeys }) {
      console.log(obj, { checkedNodes, checkedKeys, halfCheckedNodes, halfCheckedKeys })

      let checkedFatherCode = '' // 找到 checkedFatherCode  父code值
      this.workDialogForm.workArr.forEach((item, index) => {
        if (item.code === obj.code) {
          checkedFatherCode = item.code
        }
        if (item.children && item.children.length > 0) {
          item.children.forEach((it, ind) => {
            if (it.code === obj.code) {
              checkedFatherCode = item.code
            }
          })
        }
      })

      // 1.第一种情况  半叶为零  全叶为零
      if (checkedKeys.length === 0 && halfCheckedKeys.length === 0) {
        console.log('1.第一种情况  半叶为零  全叶为零')
        console.log(obj.code, 10)
        // this.workDialogForm.workCodeSelectedGatherArr = this.workDialogForm.workCodeSelectedGatherArr.filter(item => item !== obj.code)

        this.workDialogForm.workGatherArr.forEach((item, index) => {
          if (item.code === checkedFatherCode) {
            this.workDialogForm.workGatherArr[index].isSelected2 = false

            // item.isSelected1 = item.code === checkedFatherCode
            this.workDialogForm.workCodeSelectedGatherArr = this.workDialogForm.workCodeSelectedGatherArr.filter(it => it !== checkedFatherCode)
            this.$nextTick(() => {
              // console.log($("input[name='gather']"))
              $("input[name='gather']").eq(index).prop('checked', false)// 自定义单选框回显
            })
          }
        })

        this.workDialogForm.workArr.forEach((item, index) => {
          if (item.code === checkedFatherCode) {
            item.flag = 'N'
            if (item.children && item.children.length > 0) {
              item.children.forEach((it) => {
                it.flag = 'N'
                this.workDialogForm.workTreeSelectedArr.forEach((i, ind) => {
                  if (i === it.code) {
                    this.workDialogForm.workTreeSelectedArr.splice(ind, 1)
                  }
                })
              })
            }
          }
        })
        console.log(this.workDialogForm.workCodeSelectedGatherArr, 11)
        console.log(this.workDialogForm.workTreeSelectedArr, 18)
      }

      // 2.第二种情况  半叶不为零  全叶不为零
      if (checkedKeys.length !== 0 && halfCheckedKeys.length !== 0) {
        console.log('2.第二种情况  半叶不为零  全叶不为零')
        console.log(obj.code, 13)
        // console.log(this.$refs.workTree, 22)

        this.workDialogForm.workGatherArr.forEach((item, index) => {
          if (item.code === checkedFatherCode) {
            this.workDialogForm.workGatherArr[index].isSelected2 = true
            // this.workDialogForm.workCodeSelectedGatherArr.push(obj.code)
            this.$nextTick(() => {
              $("input[name='gather']").eq(index).prop('checked', true)// 自定义单选框回显
            })
          }
        })

        this.workDialogForm.workArr.forEach((item, index) => {
          if (item.code === checkedFatherCode) {
            item.flag = 'Y'
            if (item.children && item.children.length > 0) {
              item.children.forEach(it => {
                if (it.code === obj.code) {
                  console.log(it.code, 21)
                  if (it.flag === 'Y' && it.code === obj.code) {
                    it.flag = 'N'
                    this.workDialogForm.workTreeSelectedArr.forEach((i, ind) => {
                      if (i === it.code) {
                        console.log(i, 333)
                        this.workDialogForm.workTreeSelectedArr.splice(ind, 1)
                      }
                    })
                  } else if (it.flag === 'N' && it.code === obj.code) {
                    it.flag = 'Y'
                    console.log(2222)
                    this.workDialogForm.workTreeSelectedArr.push(it.code)
                  }
                }
              })
            }

            console.log(this.workDialogForm.workTreeSelectedArr, 17)

            // this.$nextTick(() => {
            //   $("input[name='gather']").eq(index).prop('checked', true)// 自定义单选框回显
            // })
          }
        })
      }

      // 3.第三种情况  半叶为零  全叶不为零
      if (checkedKeys.length !== 0 && halfCheckedKeys.length === 0) {
        console.log('3.第三种情况  半叶为零  全叶不为零')
        console.log(obj.code, 12)
        this.workDialogForm.workGatherArr.forEach((item, index) => {
          if (item.code === checkedFatherCode) {
            this.workDialogForm.workGatherArr[index].isSelected2 = true
            this.workDialogForm.workCodeSelectedGatherArr.push(obj.code)
            this.$nextTick(() => {
              $("input[name='gather']").eq(index).prop('checked', true)// 自定义单选框回显
            })
          }
        })

        this.workDialogForm.workArr.forEach((item, index) => {
          if (item.code === checkedFatherCode) {
            item.flag = 'Y'
            if (item.children && item.children.length > 0) {
              item.children.forEach(it => {
                it.flag = 'Y'
                this.workDialogForm.workTreeSelectedArr.push(it.code)
              })
            }
          }
        })
      }
      this.workDialogForm.workTreeSelectedArr = [...new Set(this.workDialogForm.workTreeSelectedArr)]

      this.$refs.workTree.setCheckedKeys(this.workDialogForm.workTreeSelectedArr)
      console.log(this.workDialogForm.workTreeSelectedArr, 14)
      console.log(this.workDialogForm.workArr, 15)
    },
    // 对话框关闭事件
    workHandleClose() {
      this.workDialogForm.workArr = []
      this.workDialogForm.workGatherArr = []
      this.workDialogForm.workTreeArr = []
      this.$refs.workTree.setCheckedKeys([])
    },
    // 取消
    workDialogVisibleCancel() {
      this.workDialogVisible = false
    },
    // 确认
    async workDialogVisibleConfirm() {
      this.workDialogForm.workTreeSelectedArr = [...new Set(this.workDialogForm.workTreeSelectedArr)]
      console.log(this.workDialogForm.workTreeSelectedArr, 18)
      console.log(this.workDialogForm.workArr, 20)
      const data = []
      this.workDialogForm.workArr.forEach(item => {
        if (item.flag === 'Y' && item.children && item.children.length > 0) {
          item.children.forEach(it => { //  保存接口只传最子项  name传的是type
            if (it.flag === 'Y') {
              data.push({ code: it.code, name: it.type })
            }
          })
        }
      })
      console.log(data)
      const res = await SaveStepAssociationEqp(this.workDialogForm.stepcode, data)
      if (res.code === '200') {
        this.$message.success('保存成功！')
        await this.getStepSearch()
        this.workDialogVisible = false
      }
    },
    /* 关联缺陷*/
    //  关联缺陷点击
    defectClick(row) {
    async defectClick(row) {
      this.defectTreeCode = row.stepcode
      this.defectTreeName = row.stepname
      this.defectDialogVisible = true

      const { data: res } = await StepAssociationDefect({ stepcode: row.stepcode })
      // this.defectTree = res
      this.defectTree.push({ code: 'QB', name: '全部', children: res, flag: 'N' })
      console.log(this.defectTree, 6)
      const nokeKey = []
      this.defectTree[0].children.forEach(item => {
        if (item.flag === 'Y') {
          nokeKey.push(item.code)
        }
      })
      console.log(nokeKey, 2)
      this.$nextTick(() => {
        this.$refs.defectTree.setCheckedKeys(nokeKey)
      })
    },
    // 关闭
    defectHandleClose() {
      this.defectTree = []
    },
    // 取消
    defectDialogVisibleCancel() {
      this.defectDialogVisible = false
    },
    // 确认
    async defectDialogVisibleConfirm() {
      const nodeKey = this.$refs.defectTree.getCheckedKeys()
      const data = []
      this.defectTree[0].children.forEach(item => {
        if (nodeKey.includes(item.code)) {
          console.log(item.code)
          data.push({ code: item.code, name: item.name })
        }
      })
      const res = await SaveStepAssociationDefect(this.defectTreeCode, data)
      if (res.code === '200') {
        this.$message.success('保存成功！')
        await this.getStepSearch()
        this.defectDialogVisible = false
      }
    }
  }
}
@@ -445,9 +968,11 @@
  border: none;
  padding: 0 20px;
}

::v-deep .el-button--primary:hover {
  border: none;
}

::v-deep .el-button--info {
  height: 30px;
  display: flex;
@@ -485,6 +1010,70 @@
  padding: 20px 100px !important;
}

.defectDialogVisible {
  ::v-deep .el-dialog__body {
    padding: 20px 20px !important;
  }
}

.workDialogVisible {
  ::v-deep .el-dialog__body {
    padding: 20px 20px !important;
  }

  .myCheckboxGroup {
    display: flex;
    flex-wrap: wrap;

    .myCheckbox {
      border: 1px solid #eee;
      display: flex;
      min-width: 100px;
      padding: 10px;
      margin: 10px 30px 0 0;
      border-radius: 5px;
      cursor: default;

      .myCheckboxInput {
        margin: 1px 5px 0 0;
        cursor: pointer;
      }

    }

    input[type=checkbox] {
      cursor: pointer;
      position: relative;
      width: 14px;
      height: 14px;
      font-size: 14px;
    }

    input[type=checkbox]::after {
      position: absolute;
      top: 0;
      color: $main_color;
      width: 14px;
      height: 14px;
      display: inline-block;
      visibility: visible;
      padding-left: 0;
      text-align: center;
      content: ' ';
      border-radius: 3px
    }

    input[type=checkbox]:checked::after {
      content: "✓";
      //content: "√";
      color: #fff;
      font-size: 12px;
      font-weight: bold;
      background-color: $main_color;
    }
  }
}

::v-deep .el-radio__input.is-checked .el-radio__inner {
  background-color: $main_color;
  border-color: $main_color;
@@ -503,6 +1092,7 @@
  height: 30px;
  line-height: 30px;
}

::v-deep .el-input__inner:focus {
  border-color: $main_color;
}
@@ -579,17 +1169,19 @@
  border-color: $main_color;
}

::v-deep .el-select .el-input__inner:focus{
::v-deep .el-select .el-input__inner:focus {
  border-color: $main_color;
}

::v-deep .el-select-dropdown__item.selected{
::v-deep .el-select-dropdown__item.selected {
  color: $main_color;
}
::v-deep .el-checkbox__inner:hover{

::v-deep .el-checkbox__inner:hover {
  border-color: $main_color;
}
::v-deep .el-textarea__inner:focus{

::v-deep .el-textarea__inner:focus {
  border-color: $main_color;
}