角色 权限改为多选框勾选修改 主页面玻璃长宽英制尺显示

wuyouming666

2023-10-18 7596b7a0c89324a3cd89bb71d35ab2add1fda90f

角色 权限改为多选框勾选修改   主页面玻璃长宽英制尺显示

 CanadaMes-ui/src/api/role.js

@@ -13,7 +13,13 @@
    })
}


export function saveOrUpdate2(data) {
    return request({
        url: '/api/role/saveOrUpdate2',
        method: 'post',
        data
    })
}

/**
 * 根据id删除角色

 CanadaMes-ui/src/api/rolePermission.js

@@ -1,3 +1,7 @@




import request from "../utils/request";

/**
@@ -51,3 +55,19 @@
        params: data
    })
}

export function getById2(data) {
    return request({
        url: '/api/rolePermission/getByRoleId',
        method: 'get',
        params: data
    })
}

export function saveOrUpdate2(data) {
    return request({
        url: '/api/rolePermission/savePermissions',
        method: 'post',
        data
    })
}

 CanadaMes-ui/src/lang/locales/en-US.json

@@ -288,6 +288,7 @@
  "Disable":"Disable",

  "Usage":"Usage",

  "Space (Pieces)":"Space (Pieces)",

  "This glass is already in the cage":"This glass is already in the cage"

  "This glass is already in the cage":"This glass is already in the cage",

  "permission update":"permission update"



}

 CanadaMes-ui/src/lang/locales/zh-CN.json

@@ -291,6 +291,7 @@
  "Disable":"禁用",

  "Usage":"使用率",

  "Space (Pieces)":"空间(片数)",

  "This glass is already in the cage":"笼子里已有此玻璃"

  "This glass is already in the cage":"笼子里已有此玻璃",

  "permission update":"权限编辑"



}

 CanadaMes-ui/src/views/role/index.vue

@@ -39,6 +39,11 @@
  <!-- 修改 -->
  <el-tooltip effect="dark" :content="$t('langEdit')" placement="top" :enterable="false">
    <el-button type="primary" icon="el-icon-edit" size="mini" @click="showEditDialog(scope.row)"></el-button>
 
  </el-tooltip>
  <el-tooltip effect="dark" :content="$t('permission update')" placement="top" :enterable="false">
    
    <el-button type="primary"  size="mini" @click="showPermissionDialog(scope.row)">{{$t('permission update')}}</el-button>
  </el-tooltip>
  <!-- 删除 -->
  <el-tooltip effect="dark" :content="$t('langDelete')" placement="top" :enterable="false">
@@ -85,10 +90,7 @@
  </span>
    </el-dialog>
    <!--修改角色的对话框-->
    <el-dialog
        :title="$t('langEditRole')"
        :visible.sync="editDialogVisible"
        width="50%">
    <el-dialog :title="$t('langEditRole')" :visible.sync="editDialogVisible" width="50%">
      <!--内容主体区域-->
      <el-form :model="editRoleForm" :rules="addRoleRules" ref="addRoleRef" label-width="130px">
        <el-form-item :label="$t('langRoleName')" prop="name">
@@ -96,25 +98,50 @@
        </el-form-item>
        <el-form-item :label="$t('langState')" prop="state">
          <el-select v-model="editRoleForm.state" placeholder="$t('langPleaseSelect')">
            <el-option v-for="(item,index) in options"
                       :key="index"
                       :value="item.value"
                       :label="item.label">
            </el-option>
        <el-option v-for="(item, index) in options" :key="index" :value="item.value" :label="item.label"></el-option>
          </el-select>
        </el-form-item>
    
      </el-form>
      <span slot="footer" class="dialog-footer">
    <el-button @click="editDialogVisible = false">{{$t('langCancel')}}</el-button>
    <el-button type="primary" @click="editRoleInfo">{{$t('langConfirm')}}</el-button>
  </span>
    </el-dialog>


<el-dialog :title="$t('langEditPermissions')" :visible.sync="permissionDialogVisible">
  <el-form label-width="130px">
    <el-form-item :label="$t('langPermissions')" prop="permissionList">
      <el-checkbox-group v-model="selectedPermissions">
        <el-checkbox
          v-for="(permission, index) in permissionList"
          :key="index"
          :label="permission.name"
          :checked="permission.state === 1"
          @change="updatePermissionState(permission.name, $event)"
        >{{ permission.name }}</el-checkbox>
      </el-checkbox-group>
    </el-form-item>
  </el-form>
  <span slot="footer" class="dialog-footer">
    <el-button @click="cancelEditPermissions">{{$t('langCancel')}}</el-button>
    <el-button type="primary" @click="savePermissions">{{$t('langConfirm')}}</el-button>
  </span>
</el-dialog>




  </div>
</template>

<script>
import {getById, removeById, saveOrUpdate, selectPage} from "../../api/role";
import LanguageMixin from '../../lang/LanguageMixin'
import {getById2} from "../../api/rolePermission";
import {saveOrUpdate2} from "../../api/rolePermission";

import LanguageMixin from '../../lang/LanguageMixin';
export default {
  name: "Role",
  mixins: [LanguageMixin],
@@ -133,13 +160,21 @@
      addDialogVisible: false,
      // 控制修改角色对话框的显示与隐藏
      editDialogVisible: false,
     
      // 添加的角色对象
      addRoleForm: {
        state: 1
      },
   
      // 修改的角色对象
      editRoleForm: {},
      editRoleForm: {
        
      },
     
      permissionList: [],
    permissionDialogVisible: false,
    selectedPermissions: [] ,// 添加selectedPermissions数组变量

      // 添加角色的验证规则
      addRoleRules: {
        name: [
@@ -179,7 +214,7 @@
    stateChange(info) {
      saveOrUpdate(info).then(() => {
        const 更新状态成功 = this.$t('更新状态成功');
        this.$message.success(更新状态成功)
        this.$message.success(更新状态成功);

      });
    },
@@ -206,7 +241,58 @@
    showEditDialog(role) {
      getById({id: role.id}).then(res => {
        this.editRoleForm = res.data;
     
  
       
      });

     
        this.editDialogVisible = true;
    },


    showPermissionDialog(role) {
      this.selectedPermissions=[];
      this.permissionList=[];
    
      getById2({ roleId: role.id }).then((res) => {
        this.permissionList = res.data.permissionList;
      

        this.selectedPermissions = this.permissionList.map(({ name, state }) => ({
          name,
          state: state === 1,
        }));
        console.log(this.selectedPermissions);
        this.permissionDialogVisible = true;
      });
    },
// 取消编辑权限弹出框
cancelEditPermissions() {
  this.permissionDialogVisible = false;
},
// 保存权限修改
updatePermissionState(name, isChecked) {
    const permission = this.permissionList.find(p => p.name === name);
    if (permission) {
      permission.state = isChecked ? 1 : 0;
    }
  },

  

  savePermissions() {
  const permissions = this.permissionList.map(({ roleId, name, state, permission_id }) => ({
    roleId,
    name,
    state,
    permission_id
  }));
  
  saveOrUpdate2({ permissions }).then(() => {
    // 成功更新权限后执行的操作
    const 更新状态成功 = this.$t('更新状态成功');
        this.$message.success(更新状态成功);
      });
    },
    // 展示添加角色的对话框

 CanadaMes-ui/vue.config.js

@@ -8,7 +8,7 @@
    devServer: {
        proxy: {
            '/api': {
                target: `http://127.0.0.1:8888/springboot-vue3`,
                target: `http://localhost:8888/springboot-vue3`,
                changeOrigin: true,
                pathRewrite: {
                    '^/api': ''

 springboot-vue3/pom.xml

@@ -145,7 +145,19 @@
                <artifactId>spring-boot-maven-plugin</artifactId>
                <version>${spring-boot.version}</version>
            </plugin>
            <plugin>
                <groupId>com.spotify</groupId>
                <artifactId>dockerfile-maven-plugin</artifactId>
                <version>1.3.6</version>
                <configuration>
                    <repository>docker/${project.artifactId}</repository>
                    <buildArgs>
                        <JAR_FILE>target/${project.build.finalName}.jar</JAR_FILE>
                    </buildArgs>
                </configuration>
            </plugin>
        </plugins>

    </build>

    <repositories>

 springboot-vue3/src/main/java/com/example/springboot/controller/RoleController.java

@@ -37,6 +37,7 @@
        return Result.success();
    }


    @ApiOperation(value = "根据id删除角色")
    @PostMapping("/removeById")
    @RequiresRoles({"admin"})
@@ -54,6 +55,8 @@
        return Result.success(roleService.getById(role.getId()));
    }



    @ApiOperation(value = "分页查询角色")
    @GetMapping("/selectPage")
    @RequiresRoles({"admin"})

 springboot-vue3/src/main/java/com/example/springboot/controller/RolePermissionController.java

@@ -1,10 +1,9 @@
package com.example.springboot.controller;

import com.example.springboot.entity.Permission;
import com.example.springboot.entity.Role;
import com.example.springboot.entity.RolePermission;
import com.example.springboot.entity.*;
import com.example.springboot.entity.vo.Result;
import com.example.springboot.entity.vo.RolePermissionVo;
import com.example.springboot.mapper.RolePermissionMapper;
import com.example.springboot.service.PermissionService;
import com.example.springboot.service.RolePermissionService;
import com.example.springboot.service.RoleService;
@@ -14,11 +13,13 @@
import org.apache.shiro.authz.annotation.RequiresPermissions;
import org.apache.shiro.authz.annotation.RequiresRoles;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.jdbc.core.JdbcTemplate;
import org.springframework.web.bind.annotation.*;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

@RestController
@Slf4j
@@ -31,6 +32,8 @@
    private RoleService roleService;
    @Autowired
    private PermissionService permissionService;



    @ApiOperation(value = "添加或者更新角色和权限关系")
    @PostMapping("/saveOrUpdate")
@@ -77,5 +80,89 @@
            rolePermission.setPermission(permission);
        }
        return Result.success(rolePermission);





        }
    @Autowired
    private JdbcTemplate jdbcTemplate;

    @Autowired RolePermissionMapper RolePermissionMapper;
    ;


    @GetMapping("/getByRoleId")
    public com.example.springboot.common.Result selectquanxian(@RequestParam("roleId") int roleId) {
        List<Map<String, Object>> resultSet = RolePermissionMapper.selectquanxian(roleId);

        List<Map<String, Object>> permissions = new ArrayList<>();
        for (Map<String, Object> result : resultSet) {

            Long role_id2 = (Long) result.get("role_id");
            int state = (int) result.get("state");
            Long permission_id = (Long) result.get("permission_id"); // 注意这里的类型是Long
            String permissionName = (String) result.get("name");

            Map<String, Object> permission = new HashMap<>();
            permission.put("roleId", role_id2.intValue());
            permission.put("name", permissionName);
            permission.put("permission_id", permission_id.intValue()); // 将Long类型转换为int类型
            permission.put("state", state);
            permissions.add(permission);
        }

        Map<String, Object> map = new HashMap<>();
        map.put("permissionList", permissions);
        return com.example.springboot.common.Result.success(map);
    }


    @PostMapping("/savePermissions")
    public Result savePermissions(@RequestBody Map<String, Object> requestBody) {
        try {
            // 获取权限数据列表
            List<Map<String, Object>> permissions = (List<Map<String, Object>>) requestBody.get("permissions");
            // 遍历接收到的权限数据
            for (Map<String, Object> permission : permissions) {
                // 获取权限项的roleId、name、state和permission_id
                int roleId = (int) permission.get("roleId");
                String name = (String) permission.get("name");
                int state = (int) permission.get("state");
                int permissionId = (int) permission.get("permission_id");

                // 根据roleId和permissionId查询是否已存在该权限记录
                boolean exists = RolePermissionMapper.checkExists(roleId, permissionId);

                if (exists) {
                    // 如果已存在该权限记录，则更新状态
                    RolePermissionMapper.updateState(roleId, permissionId, state);
                } else {
                    // 如果不存在该权限记录，则新增一条权限记录
                    RolePermissionMapper.insert(roleId, permissionId, state);
    }
}

            return Result.success(); // 成功保存权限后返回结果
        } catch (Exception e) {
            e.printStackTrace();
            return Result.fail("保存权限失败"); // 保存权限失败时返回错误信息
        }
    }







}









 springboot-vue3/src/main/java/com/example/springboot/entity/Role.java

@@ -31,3 +31,4 @@
    @TableField(exist = false)
    private List<Permission> permissions;
}


 springboot-vue3/src/main/java/com/example/springboot/entity/RolePermission.java

@@ -22,8 +22,13 @@
    @ApiModelProperty("状态")
    private Integer state;




    @TableField(exist = false)
    private Role role;
    @TableField(exist = false)
    private Permission permission;


}

 springboot-vue3/src/main/java/com/example/springboot/mapper/HomeMapper.java

@@ -68,7 +68,7 @@
  List<alarmmg> SelectAlarmmgInfo();

  //获取理片笼内玻璃信息
  @Select("select *,concat(glasswidth,' x ',glassheight) as lengthwidth from storage_cage  ")
  @Select("select *,concat(round(a.glasswidth*b.Conversionrate,2),' x ',round(a.glassheight*b.Conversionrate,2)) as lengthwidth from storage_cage  as a,glass as b  ")
  List<StorageCage> SelectCageInfo(short cage);

  @Update("update storage_cage set state=0,glass_id=null,order_id=null,glasswidth=null,glassheight=null where glass_id=#{glassid}")
@@ -87,7 +87,12 @@
  StorageCage SelectGlassInfo(String glassid);

  //查询玻璃信息
  @Select("select * from glass where glassid=#{glassid}")
//  @Select("select * from glass where glassid=#{glassid}")
  @Select("SELECT id,glassid,orderid,\n" +
          "       ROUND(width * Conversionrate, 2) AS width,\n" +
          "       ROUND(height * Conversionrate, 2) AS height\n" +
          "FROM glass\n" +
          "where glassid=#{glassid};")
  Glass SelectGlassByGlassID(String glassid);

  //启用/禁用理片笼格子

 springboot-vue3/src/main/java/com/example/springboot/mapper/RolePermissionMapper.java

@@ -2,10 +2,29 @@

import com.baomidou.mybatisplus.core.mapper.BaseMapper;
import com.example.springboot.entity.RolePermission;
import org.apache.ibatis.annotations.Mapper;


import org.apache.ibatis.annotations.*;
import org.springframework.stereotype.Repository;

import java.util.List;
import java.util.Map;

@Mapper
@Repository
public interface RolePermissionMapper extends BaseMapper<RolePermission> {

    @Select("SELECT rp.state,rp.permission_id,rp.role_id, p.* FROM role_permission AS rp JOIN permission AS p ON rp.permission_id = p.id WHERE rp.role_id = #{roleId}")
    List<Map<String, Object>> selectquanxian(@Param("roleId") int roleId);

    @Select("SELECT COUNT(*) FROM role_permission WHERE role_id = #{roleId} AND permission_id = #{permissionId}")
    boolean checkExists(@Param("roleId") int roleId, @Param("permissionId") int permissionId);


    @Update("UPDATE role_permission SET state = #{state} WHERE role_id = #{roleId} AND permission_id = #{permissionId}")
    void updateState(@Param("roleId") int roleId, @Param("permissionId") int permissionId, @Param("state") int state);

    @Insert("INSERT INTO role_permission (role_id, permission_id, state) VALUES (#{roleId}, #{permissionId}, #{state})")
    void insert(@Param("roleId") int roleId, @Param("permissionId") int permissionId, @Param("state") int state);

}

 springboot-vue3/src/main/resources/application.properties

@@ -23,7 +23,3 @@
spring.jackson.date-format=yyyy-MM-dd HH:mm:ss
spring.jackson.time-zone=GMT+8

spring.mvc.cors.enabled=true
spring.mvc.cors.allowed-origins=http://localhost:8080
spring.mvc.cors.allowed-methods=GET,POST
spring.mvc.cors.allowed-headers=*