loulijun2021
2022-09-27 bbb03ff09f77e4ece3dfcf80df855829399528ae
src/views/jcsz/jsqd.vue
@@ -2,10 +2,13 @@
  <div>
    <div class="body" :style="{height:mainHeight+'px'}">
      <div class="bodyTopButtonGroup">
      <div class="bodyTopButtonGroup" style="justify-content: space-between">
        <el-button type="primary" icon="el-icon-circle-plus-outline" @click="add('add')">新增</el-button>
        <el-button icon="el-icon-setting" @click="settingButton">设置</el-button>
        <el-button icon="el-icon-download" @click="upload">导入</el-button>
        <div style="display: flex">
          <el-button icon="el-icon-setting" @click="settingButton">设置</el-button>
          <el-button icon="el-icon-download" @click="upload">导入</el-button>
        </div>
      </div>
      <div class="bodyTopFormGroup">
@@ -44,7 +47,7 @@
              <el-input v-model="form.UserName" style="width: 200px" placeholder="请输入" />
            </el-form-item>
          </div>
          <div style="display: flex;align-items: start;margin-top: 5px;">
          <div class="bodySearchReset">
            <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>
@@ -53,7 +56,9 @@
      <div class="elTableDiv">
        <el-table
          ref="tableDataRef"
          :data="tableData"
          class="tableFixed"
          border
          :row-class-name="tableRowClassName"
          :height="tableHeight+'px'"
@@ -97,7 +102,13 @@
            min-width="160"
            label="角色描述"
            sortable="custom"
          />
            show-tooltip-when-overflow
          >
            <template slot-scope="{row}">
              <div v-if="row.description">{{ row.description }}</div>
              <div v-else>/</div>
            </template>
          </el-table-column>
          <el-table-column
            prop="lm_user"
            label="创建人员"
@@ -122,8 +133,18 @@
            sortable="custom"
          >
            <template slot-scope="{row}">
              <i v-if="row.is_user==='Y'" class="el-icon-user-solid" style="color:#42b983;cursor: pointer" @click="userClick(row)" />
              <i v-if="row.is_user==='N'" class="el-icon-user-solid" style="color: rgb(180 ,181, 185);cursor: pointer" @click="userClick(row)" />
              <i
                v-if="row.is_user==='Y'"
                class="el-icon-user-solid"
                style="color:#42b983;cursor: pointer"
                @click="userClick(row)"
              />
              <i
                v-if="row.is_user==='N'"
                class="el-icon-user-solid"
                style="color: rgb(180 ,181, 185);cursor: pointer"
                @click="userClick(row)"
              />
            </template>
          </el-table-column>
          <el-table-column
@@ -134,7 +155,12 @@
          >
            <template slot-scope="{row}">
              <i v-if="row.is_right==='Y'" class="el-icon-share" @click="rightClick(row)" />
              <i v-if="row.is_right==='N'" class="el-icon-share" style="color: rgb(180 ,181, 185)" @click="rightClick(row)" />
              <i
                v-if="row.is_right==='N'"
                class="el-icon-share"
                style="color: rgb(180 ,181, 185)"
                @click="rightClick(row)"
              />
            </template>
          </el-table-column>
          <el-table-column
@@ -157,7 +183,6 @@
      </div>
      <!--分页-->
      <pagination
        v-show="total>0"
        :total="total"
        :page.sync="form.page"
        :limit.sync="form.rows"
@@ -254,7 +279,7 @@
          sortable="custom"
        >
          <template slot-scope="{row}">
            <el-input v-if="row.isVisible===1" v-model="row.roletype_code" placeholder="请输入" />
            <el-input v-if="row.isVisible===1" v-model="row.roletype_code" oninput="value=value.replace(/[^0-9a-zA-Z]/g,'')" placeholder="请输入" />
            <div v-else> {{ row.roletype_code }}</div>
          </template>
        </el-table-column>
@@ -280,7 +305,6 @@
      </el-table>
      <!--分页-->
      <pagination
        v-show="RoleTypeCodeArrLength>0"
        :total="RoleTypeCodeArrLength"
        :page.sync="formSetting.page"
        :limit.sync="formSetting.rows"
@@ -381,12 +405,12 @@
        ref="multipleTable"
        :data="dialogFormUserTable"
        border
        :row-class-name="tableRowClassName"
        highlight-current-row
        :height="isIpad?400:365"
        :header-cell-style="this.$headerCellStyle"
        :cell-style="this.$cellStyle"
        :row-key="getRowKey"
        :row-class-name="tableRowClassName"
        @sort-change="sortChangeOfUser"
        @selection-change="handleSelectionChange"
      >
@@ -396,6 +420,7 @@
          type="selection"
          width="50"
          :reserve-selection="true"
          fixed
        />
        <el-table-column
          prop="RowNum"
@@ -421,17 +446,23 @@
          prop="flag"
          label="关联角色"
          sortable="custom"
          fixed="right"
        >
          <template slot-scope="{row}">
            <div v-if="row.flag==='Y'">是</div>
            <div v-if="row.flag==='N'">否</div>
            <div v-if="row.flag==='Y'">
              <svg-icon icon-class="circleYes" style="margin-right: 2px" />
              是
            </div>
            <div v-if="row.flag==='N'">
              <svg-icon icon-class="circleNo" style="margin-right: 2px" />
              否
            </div>
          </template>
        </el-table-column>
      </el-table>
      <!--分页-->
      <pagination
        v-show="dialogFormUserTableLength>0"
        :total="dialogFormUserTableLength"
        :page.sync="dialogFormUser.page"
        :limit.sync="dialogFormUser.rows"
@@ -480,6 +511,7 @@
          <input
            class="myCheckboxInput"
            type="checkbox"
            :disabled="rightFrom.usercode==='S001'"
            :value="item.code"
            :name="item.name"
            :style="{color:item.isSelected2?'#42b983':'#fff'}"
@@ -528,7 +560,14 @@
    </el-dialog>
    <!--导入组件-->
    <import-picker ref="importPickerFunc" class="importPickerClass" :shows.sync="shows" :title="title_value" :colos="colos" :code="code" />
    <import-picker
      ref="importPickerFunc"
      class="importPickerClass"
      :shows.sync="shows"
      :title="title_value"
      :colos="colos"
      :code="code"
    />
  </div>
</template>
@@ -545,26 +584,14 @@
} from '@/api/jcsz'
import { getCookie } from '@/utils/auth'
import $ from 'jquery'
import clearAllChildren from '@/utils/global'
import clearAllChildren, { validateCode } from '@/utils/global'
const SER_HZ = /^[\u4e00-\u9fa5]+$/
export default {
  name: 'JSQD',
  components: {
    Pagination, ImportPicker
  },
  data() {
    const validateName = (rule, value, callback) => {
      if (!value) {
        return callback(new Error('请输入编码'))
      } else {
        if (SER_HZ.test(value)) {
          return callback(new Error('编码不能为中文'))
        } else {
          callback()
        }
      }
    }
    return {
      isIpad: false,
      mainHeight: 0,
@@ -601,7 +628,7 @@
      operation: '',
      dialogFormRules: {
        RoleCode: [
          { required: true, validator: validateName, trigger: ['blur', 'change'] }
          { required: true, validator: validateCode, trigger: ['blur', 'change'] }
        ],
        RoleName: [
          { required: true, message: '请输入名称', trigger: ['blur', 'change'] }
@@ -768,6 +795,10 @@
    },
    // 修改按钮
    edit(operation, row) {
      if (row.role_code === 'S001') {
        return this.$message.info('此角色无法操作!')
      }
      this.operation = operation
      this.dialogVisible = true
@@ -782,6 +813,9 @@
    },
    // 删除按钮
    del(row) {
      if (row.role_code === 'S001') {
        return this.$message.info('此角色无法操作!')
      }
      this.$confirm('是否确认删除?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
@@ -790,6 +824,9 @@
        DeleteRole({ RoleCode: row.role_code }).then(res => {
          if (res.code === '200') {
            this.$message.success('删除成功!')
            if (this.form.page > 1 && this.tableData.length === 1) {
              this.form.page--
            }
            this.getRoleSearch()
          }
        })
@@ -838,12 +875,14 @@
    // 获取页面高度
    getHeight() {
      this.$nextTick(() => {
        this.$refs.tableDataRef.doLayout()
        this.mainHeight = window.innerHeight - 85
        this.tableHeight = this.mainHeight - 200
        if (window.innerHeight < 769) {
          this.tableHeight = this.tableHeight - 40
        }
        this.isIpad = window.innerHeight < 769 && window.innerWidth < 1367
        this.$refs.tableDataRef.doLayout()
      })
    },
    tableRowClassName({ row, rowIndex }) {
@@ -883,6 +922,9 @@
        RoleTypeDelete({ RoleTypeCode: row.roletype_code }).then(res => {
          if (res.code === '200') {
            this.$message.success('删除成功!')
            if (this.formSetting.page > 1 && this.RoleTypeCodeArr.length === 1) {
              this.formSetting.page--
            }
            this.getRoleTypeSearch()
          }
        })
@@ -919,6 +961,9 @@
    /* 关联用户模块*/
    userClick(row) {
      if (row.role_code === 'S001') {
        return this.$message.info('此角色无法操作!')
      }
      this.userDialogVisible = true
      this.userForm.roleName = row.role_name
      this.dialogFormUser.rolecode = row.role_code
@@ -1026,27 +1071,55 @@
        type: ''
      }
      const { data: res } = await RoleAssociationRight(data)// 接口获取数据
      // console.log(res, 111)
      this.dialogFormRight.rightPCArr = res[0][0].is_delete === '0' ? res[0] : []
      this.dialogFormRight.rightAPPArr = res[1][0].is_delete === '0' ? res[1] : []
      this.PCTrue = res[0][0].is_delete === '0'
      this.APPTrue = res[1][0].is_delete === '0'
      this.APPTrue = res[1][0].children.filter(item => item.is_delete === '0').length === 0 ? false : res[1][0].is_delete === '0'
      // '0'显示  '1' 不显示   过滤出相对应的菜单
      if (this.PCTrue) {
        this.dialogFormRight.rightPCArr[0].children = this.dialogFormRight.rightPCArr[0].children.filter(item => item.is_delete === '0')
        this.dialogFormRight.rightPCArr[0].children.forEach(item => {
          item.children = item.children.filter(it => it.is_delete === '0')
          if (this.rightFrom.usercode === 'S001') { // Admin系统管理员菜单做到只增不减
            if (item.flag === 'Y') {
              item.disabled = true
            }
            if (item.children && item.children.length > 0) {
              item.children.forEach(it => {
                if (it.flag === 'Y') {
                  it.disabled = true
                }
              })
            }
          }
        })
      }
      if (this.APPTrue) {
        this.dialogFormRight.rightAPPArr[0].children = this.dialogFormRight.rightAPPArr[0].children.filter(item => item.is_delete === '0')
        this.dialogFormRight.rightAPPArr[0].children = this.dialogFormRight.rightAPPArr[0].children.filter(item => item.is_delete === '0' || item.is_delete === null)
        this.dialogFormRight.rightAPPArr[0].children.forEach(item => {
          item.children = item.children.filter(it => it.is_delete === '0')
          item.children = item.children.filter(it => it.is_delete === '0' || it.is_delete === null)
          // item.children = item.children.filter(it => it.is_delete !== '1')
          if (this.rightFrom.usercode === 'S001') { // Admin系统管理员菜单做到只增不减
            if (item.flag === 'Y') {
              item.disabled = true
            }
            if (item.children && item.children.length > 0) {
              item.children.forEach(it => {
                if (it.flag === 'Y') {
                  it.disabled = true
                }
              })
            }
          }
        })
      }
      // console.log(this.dialogFormRight.rightAPPArr[0], 234)
      // 判断哪个是高亮
      let pcIsSelected1 = false
      let pcIsSelected2 = false
@@ -1134,9 +1207,9 @@
      // 目前一期肯定是这个
      if (this.PCTrue && !this.APPTrue) {
        pcIsSelected1 = true
        // pcIsSelected1 = true
        if (rightPCArrFlag === 'Y') {
          // pcIsSelected1 = true
          pcIsSelected1 = true
          pcIsSelected2 = true
          const interval = setInterval(() => {
@@ -1151,9 +1224,9 @@
            }
          }, 100)
          // this.dialogFormRight.rightCurrentCode = this.dialogFormRight.rightPCArr[0].code
          this.dialogFormRight.rightCurrentCode = this.dialogFormRight.rightPCArr[0].code
        }
        this.dialogFormRight.rightCurrentCode = this.dialogFormRight.rightPCArr[0].code
        // this.dialogFormRight.rightCurrentCode = this.dialogFormRight.rightPCArr[0].code
      }
      if (!this.PCTrue && this.APPTrue) {
@@ -1197,9 +1270,15 @@
      }
      if (this.PCTrue) {
        this.dialogFormRight.rightPCArr[0].name = '全部'
        if (this.rightFrom.usercode === 'S001') { // Admin系统管理员菜单做到只增不减
          this.dialogFormRight.rightPCArr[0].disabled = true
        }
      }
      if (this.APPTrue) {
        this.dialogFormRight.rightAPPArr[0].name = '全部'
        if (this.rightFrom.usercode === 'S001') { // Admin系统管理员菜单做到只增不减
          this.dialogFormRight.rightAPPArr[0].disabled = true
        }
      }
      // 树形回显部分
@@ -1497,6 +1576,7 @@
::v-deep .el-dialog__body {
  padding: 20px 100px !important;
}
.settingDialogVisible, .userDialogVisible, .dialogVisibleRight {
  ::v-deep .el-dialog__body {
    padding: 10px 20px !important;
@@ -1568,11 +1648,16 @@
<!--公共页面样式-->
<style lang="scss" scoped>
$main_color: #42b983;
.el-icon-share ,.el-icon-delete,.el-icon-edit-outline{
::v-deep .el-button--text{
  font-size: 14px ;
  cursor: pointer ;
}
.el-icon-share, .el-icon-delete, .el-icon-edit-outline {
  color: $main_color;
  cursor: pointer;
}
.el-icon-edit-outline{
.el-icon-edit-outline {
  margin-right: 15px;
}
@@ -1633,8 +1718,8 @@
  background-color: #f8f8fa;
}
::v-deep .el-table__body .el-table__row.hover-row td{
  background-color: #eaecef ;
::v-deep .el-table__body .el-table__row.hover-row td {
  background-color: #eaecef;
}
::v-deep .el-form--inline .el-form-item__label {
@@ -1650,14 +1735,28 @@
.body ::v-deep .el-form-item {
  margin-bottom: 0;
}
.userDialogVisible ::v-deep .el-form-item {
  margin-bottom: 0;
}
.tableFixed{
  ::v-deep .el-table__fixed-right{
    height: 100% !important;
  }
  ::v-deep .el-table__fixed{
    height: 100% !important;
  }
}
</style>
<style>
.el-table .custom-row {
  background: #f8f8fa;
}
.el-form-item__label {
  font-weight: 400 !important
}
</style>