1.页面刷新功能优化

loulijun2021

2023-01-31 13c58d78112a8bb63abd288a51165f122fc0965b

 src/views/zzmx/gxdy.vue

@@ -13,10 +13,10 @@
          :model="form"
          label-width="100px"
          inline
          style="display: flex;justify-content: space-between"
          style="display: flex;"
        >
          <div class="elForm">
            <el-form-item label-width="70px" label="工序编码" style=" display: flex;">
            <el-form-item label="工序编码" style=" display: flex;">
              <el-input v-model="form.stepcode" placeholder="请输入" style="width: 200px" />
            </el-form-item>
            <el-form-item label="工序名称" style=" display: flex;">
@@ -54,11 +54,11 @@
                />
              </el-select>
            </el-form-item>
            <el-form-item v-show="isExpandForm" label-width="70px" label="创建人员" style=" display: flex;">
            <el-form-item v-show="isExpandForm" label="创建人员" style=" display: flex;">
              <el-input v-model="form.createuser" style="width: 200px" placeholder="请输入" />
            </el-form-item>
          </div>
          <div class="bodySearchReset" :style="{marginLeft:$store.state.app.sidebar.opened?'5%':'10%'}">
          <div class="bodySearchReset" :style="{marginLeft:$store.state.app.sidebar.opened? $store.state.settings.menuIsHorizontal?'15%':'3%':'10%'}">
            <el-button type="primary" icon="el-icon-search" @click="search">查询</el-button>
            <el-button type="info" icon="el-icon-refresh" @click="reset">重置</el-button>
          </div>
@@ -154,11 +154,11 @@
          >
            <template slot-scope="{row}">
              <div v-if="row.enable==='Y'">
                <svg-icon icon-class="circleYes" style="margin-right: 2px" />
                <i class="el-icon-success" :style="{color:$store.state.settings.theme}" style="margin-right: 2px" />
                是
              </div>
              <div v-if="row.enable==='N'">
                <svg-icon icon-class="circleNo" style="margin-right: 2px" />
                <i class="el-icon-info" style="margin-right: 2px" />
                否
              </div>
            </template>
@@ -185,7 +185,7 @@
          >
            <template slot-scope="{row}">
              <div class="operationClass">
                <i v-if="row.is_eqp==='Y'" class="el-icon-share" @click="workClick(row)" />
                <i v-if="row.is_eqp==='Y'" :style="{color:$store.state.settings.theme}" class="el-icon-share" @click="workClick(row)" />
                <i
                  v-if="row.is_eqp==='N'"
                  class="el-icon-share"
@@ -203,7 +203,7 @@
          >
            <template slot-scope="{row}">
              <div class="operationClass">
                <i v-if="row.is_defect==='Y'" class="el-icon-share" @click="defectClick(row)" />
                <i v-if="row.is_defect==='Y'" :style="{color:$store.state.settings.theme}" class="el-icon-share" @click="defectClick(row)" />
                <i
                  v-if="row.is_defect==='N'"
                  class="el-icon-share"
@@ -221,10 +221,10 @@
            <template slot-scope="{row}">
              <div class="operationClass">
                <el-tooltip class="item" effect="dark" content="编辑" placement="top">
                  <i class="el-icon-edit-outline" @click="edit('edit',row)" />
                  <i :style="{color:$store.state.settings.theme}" class="el-icon-edit-outline" @click="edit('edit',row)" />
                </el-tooltip>
                <el-tooltip v-del-tab-index class="item" effect="dark" content="删除" placement="top">
                  <i class="el-icon-delete" @click="del(row)" />
                  <i :style="{color:$store.state.settings.theme}" class="el-icon-delete" @click="del(row)" />
                </el-tooltip>
              </div>
            </template>
@@ -245,6 +245,7 @@

    <!--新增修改对话框-->
    <el-dialog
      v-el-drag-dialog
      :title="operation==='add'?'新增':'编辑'"
      :visible.sync="dialogVisible"
      width="800px"
@@ -323,6 +324,7 @@

    <!--    关联工作站对话框-->
    <el-dialog
      v-el-drag-dialog
      title="关联工作站"
      :visible.sync="workDialogVisible"
      width="50%"
@@ -335,38 +337,50 @@
      <!--      @opened="handleOpenedRoles"-->

      <div>
        <i class="el-icon-s-comment" style="color:#42b983;" /> 工序名称：{{ workDialogForm.stepname }}
        <i class="el-icon-s-comment" :style="{color:$store.state.settings.theme}" /> 工序名称：{{ workDialogForm.stepname }}
      </div>
      <el-divider />
      <div>
        <div style="margin-bottom:20px">
          <i class="el-icon-s-operation" style="color:#42b983;" /> 工作站集合：
          <i class="el-icon-s-operation":style="{color:$store.state.settings.theme}" /> 工作站集合：
        </div>
        <div class="myCheckboxGroup">
          <div
            v-for="item in workDialogForm.workGatherArr"
            :key="item.code"
            :style="{border:item.isSelected1?'1px solid #42b983':'1px solid #eee'}"
            :style="{border:item.isSelected1?'1px solid '+$store.state.settings.theme :'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 }}
            <!--            <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"-->
            <el-checkbox
              :key="item.code"
              v-model="item.isSelected2"
              class="myCheckboxInput"
              :value="item.code"
              :name="item.name"
              :label="item.name"
              :checked="item.isSelected2"
              @change="myCheckboxInputClick(item)"
            />
            <div class="myCheckboxInputLabel">{{ item.name }}</div>

          </div>
        </div>
      </div>
      <el-divider />
      <div>
        <div style="margin-bottom:20px">
          <i class="el-icon-s-operation" style="color:#42b983;" /> 工作站：
          <i class="el-icon-s-operation" :style="{color:$store.state.settings.theme}" /> 工作站：
        </div>
        <el-tree
          ref="workTree"
@@ -396,6 +410,7 @@

    <!--    关联缺陷对话框-->
    <el-dialog
      v-el-drag-dialog
      title="工序关联缺陷"
      :visible.sync="defectDialogVisible"
      width="50%"
@@ -408,7 +423,7 @@
      <!--      @opened="handleOpenedRoles"-->

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

      <div>
@@ -456,12 +471,14 @@
} from '@/api/zzmx'
import $ from 'jquery'
import { validateCode } from '@/utils/global'
import elDragDialog from '@/directive/el-drag-dialog'

export default {
  name: 'GXDY',
  components: {
    Pagination
  },
  directives: { elDragDialog },
  data() {
    return {
      mouseHoverType: 'mouseout',
@@ -762,7 +779,7 @@
    },
    // 小盒子点击事件
    myCheckboxInputClick(val) {
      val.isSelected2 = !val.isSelected2
      val.isSelected2 = !!val.isSelected2
      console.log(val.code, 1)
      this.workDialogForm.workCodeSelectedGatherArr = [...new Set(this.workDialogForm.workCodeSelectedGatherArr)]
      // 1.第一种情况  小盒子从没选中到选中
@@ -1065,12 +1082,21 @@
      margin: 10px 30px 0 0;
      border-radius: 5px;
      cursor: default;
      position: relative;

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

      .myCheckboxInputLabel {
        position: absolute;
        left: 29px;
        padding: 5px;
        top: 6px;
        color: transparent;
      }

    }

    input[type=checkbox] {