权限管理系统-0.5.0

六、审批管理模块

审批管理模块包括审批类型和审批模板，审批类型如：出勤、人事、财务等，审批模板如：加班、请假等具体业务。

6.1 引入依赖

在项目中引入activiti7的相关依赖：

        <!--引入activiti的springboot启动器 --><dependency><groupId>org.activiti</groupId><artifactId>activiti-spring-boot-starter</artifactId><version>7.1.0.M6</version><exclusions><exclusion><artifactId>mybatis</artifactId><groupId>org.mybatis</groupId></exclusion></exclusions></dependency>

在配置文件中加入如下配置：

spring:    activiti:#    false:默认，数据库表不变，但是如果版本不对或者缺失表会抛出异常（生产使用）#    true:表不存在，自动创建（开发使用）#    create_drop: 启动时创建，关闭时删除表（测试使用）#    drop_create: 启动时删除表,在创建表 （不需要手动关闭引擎）database-schema-update: true#监测历史表是否存在，activities7默认不开启历史表db-history-used: true#none：不保存任何历史数据，流程中这是最高效的#activity：只保存流程实例和流程行为#audit：除了activity，还保存全部的流程任务以及其属性，audit为history默认值#full：除了audit、还保存其他全部流程相关的细节数据，包括一些流程参数history-level: full#校验流程文件，默认校验resources下的process 文件夹的流程文件check-process-definitions: true

启动程序，会自动创建activiti所需要的表，要注意，如果数据源的任意库中存在activiti的表，那么就不会执行建表语句，就会报表不存在的错误信息。我这里由于有一个之前用于测试activiti的库，所以建表语句没有执行，导致出错：
在这里插入图片描述
只需要在配置文件的MySQL的URL链接中添加以下代码即可解决：nullCatalogMeansCurrent=true
在启动项目后，控制台可能会一直打印JDBC信息，在配置文件中加入如下代码即可解决：spring: activiti: async-executor-activate: false

6.1 审批类型

6.1.1 建表

首先在数据库建立对应表：

CREATE TABLE `oa_process_type` (`id` BIGINT(20) NOT NULL AUTO_INCREMENT COMMENT 'id',`name` VARCHAR(20) NOT NULL DEFAULT '' COMMENT '类型名称',`description` VARCHAR(255) DEFAULT NULL COMMENT '描述',`create_time` TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP COMMENT '创建时间',`update_time` TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP COMMENT '更新时间',`is_deleted` TINYINT(3) NOT NULL DEFAULT '0' COMMENT '删除标记（0:不可用 1:可用）',PRIMARY KEY (`id`)
) ENGINE=INNODB AUTO_INCREMENT=4 DEFAULT CHARSET=utf8 COMMENT='审批类型';

6.1.2 代码生成器

使用代码生成器生成mapper等文件。
为了将审批相关的控制器等与权限管理区分开，在yunshangoffice包下面新建一个auth包，并将权限相关内容放在auth包下，再创建一个process包，用于存放流程控制相关内容。
代码生成器之前已经使用过很多次，这里就不再赘述。
在这里插入图片描述

6.1.3 创建实体类

@Data
@ApiModel(description = "ProcessType")
@TableName("oa_process_type")
public class ProcessType extends BaseEntity {private static final long serialVersionUID = 1L;@ApiModelProperty(value = "类型名称")@TableField("name")private String name;@ApiModelProperty(value = "描述")@TableField("description")private String description;//暂时不用//@TableField(exist = false)//private List<ProcessTemplate> processTemplateList;
}

6.1.4 ProcessTypeController

/*** <p>* 审批类型 前端控制器* </p>** @author beiluo* @since 2024-03-18*/
@Api(tags = "审批类型")
@RestController
@RequestMapping("/admin/process/processType")
public class ProcessTypeController {@Autowiredprivate ProcessTypeService processTypeService;/*** 分页查询所有审批类型*/@ApiOperation("分页查询审批类型")@GetMapping("/{page}/{limit}")public Result getPageList(@PathVariable Long page,@PathVariable Long limit){Page<ProcessType> processTypePage = new Page<>(page, limit);Page<ProcessType> page1 = processTypeService.page(processTypePage);return Result.ok(page1);}/*** 根据id获取类型*/@ApiOperation("根据id获取审批类型")@GetMapping("/get/{id}")public Result getProcessTypeById(@PathVariable Long id){return Result.ok(processTypeService.getById(id));}/*** 新增类型*/@ApiOperation("新增类型")@PostMapping("/save")public Result save(@RequestBody ProcessType processType){processTypeService.save(processType);return Result.ok();}/*** 根据id修改类型*/@ApiOperation("根据id修改类型")@PutMapping("/update")public Result updateProcessTypeById(@RequestBody ProcessType processType){processTypeService.updateById(processType);return Result.ok();}/*** 根据id删除类型*/@ApiOperation("根据id删除类型")@DeleteMapping("/remove/{id}")public Result removeProcessTypeById(@PathVariable Long id){processTypeService.removeById(id);return Result.ok();}}

6.1.5 前端

动态路由无需添加路由，只需要数据库中有相应的菜单信息，或者在前端页面添加新菜单就可以有相应的路由信息了。
创建src/api/process/processType.js文件：

import request from '@/utils/request'const api_name = '/admin/process/processType'export default {getPageList(page, limit) {return request({url: `${api_name}/${page}/${limit}`,method: 'get'})},getById(id) {return request({url: `${api_name}/get/${id}`,method: 'get'})},save(role) {return request({url: `${api_name}/save`,method: 'post',data: role})},updateById(role) {return request({url: `${api_name}/update`,method: 'put',data: role})},removeById(id) {return request({url: `${api_name}/remove/${id}`,method: 'delete'})}
}

创建views/processSet/processType/list.vue：

<template><div class="app-container"><!-- 工具条 --><div class="tools-div"><el-button type="success" icon="el-icon-plus" size="mini" @click="add" :disabled="$hasBP('bnt.processType.add')  === false">添 加</el-button></div><!-- banner列表 --><el-tablev-loading="listLoading":data="list"stripeborderstyle="width: 100%;margin-top: 10px;"><el-table-columntype="selection"width="55"/><el-table-columnlabel="序号"width="70"align="center"><template slot-scope="scope">{{ (page - 1) * limit + scope.$index + 1 }}</template></el-table-column><el-table-column prop="name" label="类型名称"/><el-table-column prop="description" label="描述"/><el-table-column prop="createTime" label="创建时间"/><el-table-column prop="updateTime" label="更新时间"/><el-table-column label="操作" width="200" align="center"><template slot-scope="scope"><el-button type="text" size="mini" @click="edit(scope.row.id)" :disabled="$hasBP('bnt.processType.update')  === false">修改</el-button><el-button type="text" size="mini" @click="removeDataById(scope.row.id)" :disabled="$hasBP('bnt.processType.remove')  === false">删除</el-button></template></el-table-column></el-table><!-- 分页组件 --><el-pagination:current-page="page":total="total":page-size="limit":page-sizes="[5, 10, 20, 30, 40, 50, 100]"style="padding: 30px 0; text-align: center;"layout="sizes, prev, pager, next, jumper, ->, total, slot"@current-change="fetchData"@size-change="changeSize"/><el-dialog title="添加/修改" :visible.sync="dialogVisible" width="40%"><el-form ref="flashPromotionForm" label-width="150px" size="small" style="padding-right: 40px;"><el-form-item label="类型名称"><el-input v-model="processType.name"/></el-form-item><el-form-item label="描述"><el-input v-model="processType.description"/></el-form-item></el-form><span slot="footer" class="dialog-footer"><el-button @click="dialogVisible = false" size="small">取 消</el-button><el-button type="primary" @click="saveOrUpdate()" size="small">确 定</el-button></span></el-dialog></div>
</template>
<script>
import api from '@/api/process/processType'const defaultForm = {id: '',name: '',description: ''
}
export default {data() {return {listLoading: true, // 数据是否正在加载list: null, // banner列表total: 0, // 数据库中的总记录数page: 1, // 默认页码limit: 10, // 每页记录数searchObj: {}, // 查询表单对象dialogVisible: false,processType: defaultForm,saveBtnDisabled: false}},// 生命周期函数：内存准备完毕，页面尚未渲染created() {this.fetchData()},// 生命周期函数：内存准备完毕，页面渲染成功mounted() {},methods: {// 当页码发生改变的时候changeSize(size) {console.log(size)this.limit = sizethis.fetchData(1)},// 加载列表数据fetchData(page = 1) {this.page = pageapi.getPageList(this.page, this.limit, this.searchObj).then(response => {this.list = response.data.recordsthis.total = response.data.total// 数据加载并绑定成功this.listLoading = false})},// 重置查询表单resetData() {console.log('重置查询表单')this.searchObj = {}this.fetchData()},// 根据id删除数据removeDataById(id) {this.$confirm('此操作将永久删除该记录, 是否继续?', '提示', {confirmButtonText: '确定',cancelButtonText: '取消',type: 'warning'}).then(() => { // promise// 点击确定，远程调用ajaxreturn api.removeById(id)}).then((response) => {this.fetchData(this.page)this.$message.success(response.message)}).catch(() => {this.$message.info('取消删除')})},add() {this.dialogVisible = truethis.processType = Object.assign({}, defaultForm)},edit(id) {this.dialogVisible = truethis.fetchDataById(id)},fetchDataById(id) {api.getById(id).then(response => {this.processType = response.data})},saveOrUpdate() {this.saveBtnDisabled = true // 防止表单重复提交if (!this.processType.id) {this.saveData()} else {this.updateData()}},// 新增saveData() {api.save(this.processType).then(response => {this.$message.success(response.message || '操作成功')this.dialogVisible = falsethis.fetchData(this.page)})},// 根据id更新记录updateData() {api.updateById(this.processType).then(response => {this.$message.success(response.message || '操作成功')this.dialogVisible = falsethis.fetchData(this.page)})}}
}
</script>

6.3 审批模板

6.3.1 建表

CREATE TABLE `oa_process_template` (`id` bigint(20) NOT NULL AUTO_INCREMENT COMMENT '角色id',`name` varchar(20) NOT NULL DEFAULT '' COMMENT '模板名称',`icon_url` varchar(100) DEFAULT NULL COMMENT '图标路径',`process_type_id` varchar(255) DEFAULT NULL,`form_props` text COMMENT '表单属性',`form_options` text COMMENT '表单选项',`process_definition_key` varchar(20) DEFAULT NULL COMMENT '流程定义key',`process_definition_path` varchar(255) DEFAULT NULL COMMENT '流程定义上传路径',`process_model_id` varchar(255) DEFAULT NULL COMMENT '流程定义模型id',`description` varchar(255) DEFAULT NULL COMMENT '描述',`status` tinyint(3) NOT NULL DEFAULT '0',`create_time` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP COMMENT '创建时间',`update_time` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP COMMENT '更新时间',`is_deleted` tinyint(3) NOT NULL DEFAULT '0' COMMENT '删除标记（0:不可用 1:可用）',PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=4 DEFAULT CHARSET=utf8 COMMENT='审批模板';

6.3.2 代码生成器

使用代码生成器生成相应代码。
在这里插入图片描述

6.3.3 实体类

@Data
@ApiModel(description = "审批模板")
@TableName("oa_process_template")
public class ProcessTemplate extends BaseEntity {private static final long serialVersionUID = 1L;@ApiModelProperty(value = "模板名称")@TableField("name")private String name;@ApiModelProperty(value = "图标路径")@TableField("icon_url")private String iconUrl;@ApiModelProperty(value = "processTypeId")@TableField("process_type_id")private Long processTypeId;@ApiModelProperty(value = "表单属性")@TableField("form_props")private String formProps;@ApiModelProperty(value = "表单选项")@TableField("form_options")private String formOptions;@ApiModelProperty(value = "描述")@TableField("description")private String description;@ApiModelProperty(value = "流程定义key")@TableField("process_definition_key")private String processDefinitionKey;@ApiModelProperty(value = "流程定义上传路process_model_id")@TableField("process_definition_path")private String processDefinitionPath;@ApiModelProperty(value = "流程定义模型id")@TableField("process_model_id")private String processModelId;@ApiModelProperty(value = "状态")@TableField("status")private Integer status;@TableField(exist = false)private String processTypeName;
}

写完模板实体类后，记得将审批类型实体类中的注释去掉。

6.3.4 OaProcessTemplateController

/*** <p>* 审批模板 前端控制器* </p>** @author beiluo* @since 2024-03-19*/
@Api("审批模板")
@RestController
@RequestMapping("/admin/process/processTemplate")
public class OaProcessTemplateController {@Autowiredprivate OaProcessTemplateService processTemplateService;/*** 分页查询*/@ApiOperation("分页查询审批模板")@GetMapping("/{page}/{limit}")public Result getPageList(@PathVariable Long page,@PathVariable Long limit){return Result.ok(processTemplateService.getPageList(page,limit));}/*** 添加模板*/@ApiOperation("添加模板")@PostMapping("/save")public Result save(@RequestBody ProcessTemplate processTemplate){processTemplateService.save(processTemplate);return Result.ok();}/*** 修改模板*/@ApiOperation("修改模板")@PutMapping("/update")public Result updateProcessTemplate(@RequestBody ProcessTemplate processTemplate){processTemplateService.updateById(processTemplate);return Result.ok();}/*** 根据id获取模板*/@ApiOperation("根据id获取模板")@GetMapping("/get/{id}")public Result getProcessTemplateById(@PathVariable Long id){ProcessTemplate byId = processTemplateService.getById(id);return Result.ok(byId);}/*** 根据id删除模板*/@ApiOperation("根据id删除模板")@DeleteMapping("/remove/{id}")public Result removeProcessTemplate(@PathVariable Long id){processTemplateService.removeById(id);return Result.ok();}}

6.3.5 前端

新建src/api/process/processTemplate.js文件

import request from '@/utils/request'const api_name = '/admin/process/processTemplate'export default {getPageList(page, limit) {return request({url: `${api_name}/${page}/${limit}`,method: 'get'})},getById(id) {return request({url: `${api_name}/get/${id}`,method: 'get'})},save(role) {return request({url: `${api_name}/save`,method: 'post',data: role})},updateById(role) {return request({url: `${api_name}/update`,method: 'put',data: role})},removeById(id) {return request({url: `${api_name}/remove/${id}`,method: 'delete'})}
}

新建views/processSet/processTemplate/list.vue：

<template><div class="app-container"><!-- 工具条 --><div class="tools-div"><el-button type="success" icon="el-icon-plus" size="mini" @click="add()" :disabled="$hasBP('bnt.processTemplate.templateSet')  === false">添加审批设置</el-button></div><!-- 列表 --><el-tablev-loading="listLoading":data="list"stripeborderstyle="width: 100%;margin-top: 10px;"><el-table-columnlabel="序号"width="70"align="center"><template slot-scope="scope">{{ (page - 1) * limit + scope.$index + 1 }}</template></el-table-column>iconPath<el-table-column prop="name" label="审批名称"/><el-table-column label="图标"><template slot-scope="scope"><img :src="scope.row.iconUrl" style="width: 30px;height: 30px;vertical-align: text-bottom;"></template></el-table-column><el-table-column prop="processTypeName" label="审批类型"/><el-table-column prop="description" label="描述"/><el-table-column prop="createTime" label="创建时间"/><el-table-column prop="updateTime" label="更新时间"/><el-table-column label="操作" width="250" align="center"><template slot-scope="scope"><el-button type="text" size="mini" @click="edit(scope.row.id)" :disabled="$hasBP('bnt.processTemplate.templateSet')  === false">修改审批设置</el-button><el-button type="text" size="mini" @click="removeDataById(scope.row.id)" :disabled="$hasBP('bnt.processTemplate.remove')  === false">删除</el-button></template></el-table-column></el-table><!-- 分页组件 --><el-pagination:current-page="page":total="total":page-size="limit":page-sizes="[5, 10, 20, 30, 40, 50, 100]"style="padding: 30px 0; text-align: center;"layout="sizes, prev, pager, next, jumper, ->, total, slot"@current-change="fetchData"@size-change="changeSize"/></div>
</template>
<script>
import api from '@/api/process/processTemplate'export default {data() {return {listLoading: true, // 数据是否正在加载list: null, // banner列表total: 0, // 数据库中的总记录数page: 1, // 默认页码limit: 10, // 每页记录数searchObj: {} // 查询表单对象}},// 生命周期函数：内存准备完毕，页面尚未渲染created() {this.fetchData()},// 生命周期函数：内存准备完毕，页面渲染成功mounted() {},methods: {// 当页码发生改变的时候changeSize(size) {this.limit = sizethis.fetchData(1)},// 加载banner列表数据fetchData(page = 1) {// 异步获取远程数据（ajax）this.page = pageapi.getPageList(this.page, this.limit, this.searchObj).then(response => {this.list = response.data.recordsthis.total = response.data.total// 数据加载并绑定成功this.listLoading = false})},// 重置查询表单resetData() {this.searchObj = {}this.fetchData()},// 根据id删除数据removeDataById(id) {this.$confirm('此操作将永久删除该记录, 是否继续?', '提示', {confirmButtonText: '确定',cancelButtonText: '取消',type: 'warning'}).then(() => { // promise// 点击确定，远程调用ajaxreturn api.removeById(id)}).then((response) => {this.fetchData(this.page)this.$message.success(response.message)}).catch(() => {this.$message.info('取消删除')})},add() {this.$router.push('/processSet/templateSet')},edit(id) {this.$router.push('/processSet/templateSet?id=' + id)}}
}
</script>

6.3.6 添加审批模板

添加审批模板功能由三个部分组成：

  1. 填写基本信息，如模板类型等；
  2. 表单设置，添加实现模板需要的表单；
  3. 上传流程定义。
6.3.6.1 集成form-create

本项目中的表单生成使用form-create，下面在项目中集成form-create。

  1. 在package.json文件中添加依赖：
"@form-create/element-ui": "^2.5.17",
"@form-create/designer": "^1.0.8",
  1. 在main.js中加入如下内容：
import formCreate from '@form-create/element-ui'
import FcDesigner from '@form-create/designer'
Vue.use(formCreate)
Vue.use(FcDesigner)
  1. 新建views/processSet/processTemplate/templateSet.vue文件：
<template><div class="app-container"><div id="app1"><fc-designer class="form-build" ref="designer"/><el-button @click="save">获取数据</el-button></div></div>
</template><script>export default {data() {return {}},created() {},methods: {save() {console.log(this.$refs.designer.getRule())console.log(this.$refs.designer.getOption())}}
}
</script>

启动项目，点击添加审批模板，就会出现以下页面：
在这里插入图片描述

6.3.6.2 获取全部审批类型
    /*** 获取全部审批类型，用于添加审批模板时选择类型*/@ApiOperation("获取全部审批类型")@GetMapping("/getAll")public Result getAll(){return Result.ok(processTypeService.list());}

//添加前端接口
findAll() {return request({url: `${api_name}/findAll`,method: 'get'})
}
6.3.6.3 流程定义上传接口
    /*** 流程定义上传* @RequestBody注解用于将请求体中的JSON数据映射到入参* 如果前端使用param参数，那么就不会以JSON的形式发送数据，可以直接使用相应类型的参数接收，而不用@RequestBody注解* 文件类型在请求体中也不是JSON形式，所以不要使用@RequestBody注解*/@ApiOperation("流程定义上传")@PostMapping("uploadProcessDefinition")public Result uploadProcessDefinition(MultipartFile multipartFile) throws FileNotFoundException {String classpath = new File(ResourceUtils.getURL("classpath:").getPath()).getAbsolutePath();String originalFilename = multipartFile.getOriginalFilename();File file = new File(classpath + "/processes/");//如果该目录不存在，则创建目录if(!file.exists()){file.mkdir();}//如果目录存在，则创建新文件，并将上传文件放在该目录下File file1 = new File(classpath + "/processes/" + originalFilename);try {multipartFile.transferTo(file1);} catch (IOException e) {e.printStackTrace();return Result.fail();}//后面的逻辑一会再写return Result.ok();}
6.3.6.4 添加模板前端完整代码

用以下代码替换views/processSet/processTemplate/templaeteSet.vue文件内容：

<template><div class="app-container"><el-steps :active="stepIndex" finish-status="success"><el-step title="基本设置"></el-step><el-step title="表单设置"></el-step><el-step title="流程设置"></el-step></el-steps><div class="tools-div"><el-button v-if="stepIndex > 1" icon="el-icon-check" type="primary" size="small" @click="pre()" round>上一步</el-button><el-button icon="el-icon-check" type="primary" size="small" @click="next()" round>{{stepIndex == 3 ? '提交保存' : '下一步'}}</el-button><el-button type="primary" size="small" @click="back()">返回</el-button></div><!-- 第一步 --><div v-show="stepIndex == 1" style="margin-top: 20px;"><el-form ref="flashPromotionForm" label-width="150px" size="small" style="padding-right: 40px;"><el-form-item label="审批类型"><el-select v-model="processTemplate.processTypeId" placeholder="请选择审批类型"><el-option v-for="item in processTypeList" :label="item.name" :value="item.id"></el-option></el-select></el-form-item><el-form-item label="审批名称"><el-input v-model="processTemplate.name"/></el-form-item><el-form-item label="审批图标"><el-select v-model="processTemplate.iconUrl" placeholder="请选择审批图标"><el-option v-for="item in iconUrlList" :label="item.iconUrl" :value="item.iconUrl"><img :src="item.iconUrl" style="width: 30px;height: 30px;vertical-align: text-bottom;"></el-option></el-select></el-form-item><el-form-item label="描述"><el-input v-model="processTemplate.description"/></el-form-item></el-form></div><!-- 第二步 --><div v-show="stepIndex == 2" style="margin-top: 20px;"><!--表单构建器--><fc-designer class="form-build" ref="designer"/></div><!-- 第三步 --><div v-show="stepIndex == 3" style="margin-top: 20px;"><el-uploadclass="upload-demo"dragaction="/dev-api/admin/process/processTemplate/uploadProcessDefinition":headers="uploadHeaders"multiple="false":before-upload="beforeUpload":on-success="onUploadSuccess":file-list="fileList"><i class="el-icon-upload"></i><div class="el-upload__text">将Activiti流程设计文件拖到此处，或<em>点击上传</em></div><div class="el-upload__tip" slot="tip">只能上传zip压缩文件，且不超过2048kb</div></el-upload></div></div>
</template><script>
import api from '@/api/process/processTemplate'
import processTypeApi from '@/api/process/processType'
import store from '@/store'const defaultForm = {id: '',name: '',iconUrl: '',formProps: '',formOptions: '',processDefinitionKey: '',processDefinitionPath: '',description: ''
}
export default {data() {return {stepIndex: 1,processTypeList: [],processTemplate: defaultForm,iconUrlList: [{ iconUrl: 'https://gw.alicdn.com/tfs/TB1t695CFYqK1RjSZLeXXbXppXa-102-102.png', tag: '请假' },{ iconUrl: 'https://gw.alicdn.com/tfs/TB1bHOWCSzqK1RjSZFjXXblCFXa-112-112.png', tag: '出差' },{ iconUrl: 'https://gw.alicdn.com/tfs/TB1cbCYCPTpK1RjSZKPXXa3UpXa-112-112.png', tag: '机票出差' },{ iconUrl: 'https://gw.alicdn.com/tfs/TB1cbCYCPTpK1RjSZKPXXa3UpXa-112-112.png', tag: '机票改签' },{ iconUrl: 'https://gw.alicdn.com/tfs/TB1e76lCOLaK1RjSZFxXXamPFXa-112-112.png', tag: '外出' },{ iconUrl: 'https://gw.alicdn.com/tfs/TB1Yfa0CG6qK1RjSZFmXXX0PFXa-112-112.png', tag: '补卡申请' },{ iconUrl: 'https://gw.alicdn.com/tfs/TB1Y8PlCNjaK1RjSZKzXXXVwXXa-112-112.png', tag: '加班' },{ iconUrl: 'https://gw.alicdn.com/tfs/TB11X99CNTpK1RjSZFKXXa2wXXa-102-102.png', tag: '居家隔离' },{ iconUrl: 'https://gw.alicdn.com/tfs/TB1_YG.COrpK1RjSZFhXXXSdXXa-102-102.png', tag: '请假' },{ iconUrl: 'https://gw.alicdn.com/tfs/TB13ca1CMDqK1RjSZSyXXaxEVXa-102-102.png', tag: '调岗' },{ iconUrl: 'https://gw.alicdn.com/tfs/TB1U9iBCSzqK1RjSZPcXXbTepXa-102-102.png', tag: '离职' },{ iconUrl: 'https://gw.alicdn.com/tfs/TB11pS_CFzqK1RjSZSgXXcpAVXa-102-102.png', tag: '费用申请' },{ iconUrl: 'https://gw.alicdn.com/tfs/TB1t695CFYqK1RjSZLeXXbXppXa-102-102.png', tag: '用章申请' },{ iconUrl: 'https://gw.alicdn.com/tfs/TB13f_aCQzoK1RjSZFlXXai4VXa-102-102.png', tag: '携章外出' },{ iconUrl: 'https://gw.alicdn.com/tfs/TB1_YG.COrpK1RjSZFhXXXSdXXa-102-102.png', tag: '学期内分期' },{ iconUrl: 'https://gw.alicdn.com/tfs/TB1_YG.COrpK1RjSZFhXXXSdXXa-102-102.png', tag: '特殊学费' },{ iconUrl: 'https://gw.alicdn.com/tfs/TB1Yfa0CG6qK1RjSZFmXXX0PFXa-112-112.png', tag: '充值卡申领' },{ iconUrl: 'https://gw.alicdn.com/tfs/TB1e76lCOLaK1RjSZFxXXamPFXa-112-112.png', tag: '礼品申领' },{ iconUrl: 'https://gw.alicdn.com/tfs/TB1FNG.CMHqK1RjSZFgXXa7JXXa-102-102.png', tag: '邮寄快递申请' },{ iconUrl: 'https://gw.alicdn.com/imgextra/i3/O1CN01LLn0YV1LhBXs7T2iO_!!6000000001330-2-tps-120-120.png', tag: '合同审批' },{ iconUrl: 'https://gw.alicdn.com/tfs/TB1e76lCOLaK1RjSZFxXXamPFXa-112-112.png', tag: '合同借阅' },{ iconUrl: 'https://gw.alicdn.com/tfs/TB1e76lCOLaK1RjSZFxXXamPFXa-112-112.png', tag: '魔点临时开门权限' },{ iconUrl: 'https://gw.alicdn.com/tfs/TB1bHOWCSzqK1RjSZFjXXblCFXa-112-112.png', tag: '北京科技园车证审批' },{ iconUrl: 'https://gw.alicdn.com/tfs/TB1e76lCOLaK1RjSZFxXXamPFXa-112-112.png', tag: '魔点访客提前预约审批' }],uploadHeaders: {'token': store.getters.token},fileList: []}},created() {let id = this.$route.query.idconsole.log(id)if (id > 0) {this.fetchDataById(id)}this.fetchProcessTypeData()},methods: {pre() {this.stepIndex -= 1},next() {if (this.stepIndex === 2) {this.processTemplate.formProps = JSON.stringify(this.$refs.designer.getRule())this.processTemplate.formOptions = JSON.stringify(this.$refs.designer.getOption())console.log(JSON.stringify(this.processTemplate))}if (this.stepIndex === 3) {this.saveOrUpdate()}this.stepIndex += 1},fetchProcessTypeData() {processTypeApi.findAll().then(response => {this.processTypeList = response.data})},fetchDataById(id) {api.getById(id).then(response => {this.processTemplate = response.data// 给表单设计器赋值this.$refs.designer.setRule(JSON.parse(this.processTemplate.formProps))this.$refs.designer.setOption(JSON.parse(this.processTemplate.formOptions))this.fileList = [{name: this.processTemplate.processDefinitionPath,url: this.processTemplate.processDefinitionPath}]})},saveOrUpdate() {this.saveBtnDisabled = true // 防止表单重复提交if (!this.processTemplate.id) {this.saveData()} else {this.updateData()}},// 新增saveData() {api.save(this.processTemplate).then(response => {this.$router.push('/processSet/processTemplate')})},// 根据id更新记录updateData() {api.updateById(this.processTemplate).then(response => {this.$router.push('/processSet/processTemplate')})},// 文件上传限制条件beforeUpload(file) {const isZip = file.type === 'application/x-zip-compressed'const isLt2M = file.size / 1024 / 1024 < 2if (!isZip) {this.$message.error('文件格式不正确!')return false}if (!isLt2M) {this.$message.error('上传大小不能超过 2MB!')return false}return true},// 上传成功的回调onUploadSuccess(res, file) {// 填充上传文件列表this.processTemplate.processDefinitionPath = res.data.processDefinitionPaththis.processTemplate.processDefinitionKey = res.data.processDefinitionKey},back() {this.$router.push('/processSet/processTemplate')}}
}
</script>

6.3.7 查看审批模板

查看审批的基本信息和表单信息。
在views/processSet/processTemplate/list.vue文件中进行修改：

<!--添加按钮-->
<el-button type="text" size="mini" @click="show(scope.row)">查看审批设置</el-button>

<!--定义data-->
rule: [],
option: {},
processTemplate: {},
formDialogVisible: false

<!--定义显示方法-->
show(row) {this.rule = JSON.parse(row.formProps)this.option = JSON.parse(row.formOptions)this.processTemplate = rowthis.formDialogVisible = true
}

<!--定义弹出层，用于显示模板信息-->
<el-dialog title="查看审批设置" :visible.sync="formDialogVisible" width="35%"><h3>基本信息</h3><el-divider/><el-form ref="flashPromotionForm" label-width="150px" size="small" style="padding-right: 40px;"><el-form-item label="审批类型" style="margin-bottom: 0px;">{{ processTemplate.processTypeName }}</el-form-item><el-form-item label="名称" style="margin-bottom: 0px;">{{ processTemplate.name }}</el-form-item><el-form-item label="创建时间" style="margin-bottom: 0px;">{{ processTemplate.createTime }}</el-form-item></el-form><h3>表单信息</h3><el-divider/><div><form-create:rule="rule":option="option"></form-create></div><span slot="footer" class="dialog-footer"><el-button @click="formDialogVisible = false" size="small">取 消</el-button></span>
</el-dialog>

6.3.8 发布审批模板

//OaProcessTemplateController方法/*** 发布审批模板*/@ApiOperation("发布审批模板")@GetMapping("/publish/{id}")public Result publishProcessDefinition(@PathVariable Long id){processTemplateService.publishProcessDefinition(id);return Result.ok();}

//OaProcessTemplateServiceImpl@Overridepublic void publishProcessDefinition(Long id) {//模板status为1表示已发布，所以第一步先将状态设置为1ProcessTemplate processTemplate = baseMapper.selectById(id);processTemplate.setStatus(1);baseMapper.updateById(processTemplate);//部署流程定义后续再实现}

//在src/api/process/processTemplate.js文件中添加
publish(id) {return request({url: `${api_name}/publish/${id}`,method: 'get'})
}

<!--在views/processSet/processTemplate/list.vue中添加-->
<!--添加按钮-->
<el-button v-if="scope.row.status == 0" type="text" size="mini" @click="publish(scope.row.id)" :disabled="$hasBP('bnt.processTemplate.publish')  === false">发布</el-button>
<!--添加方法-->
publish(id) {api.publish(id).then(response => {this.$message.success('发布成功')this.fetchData(this.page)})
}

6.4 审批管理

用于管理提交的审批内容。

6.4.1 建表

CREATE TABLE `oa_process` (`id` bigint(20) NOT NULL AUTO_INCREMENT COMMENT 'id',`process_code` varchar(50) NOT NULL DEFAULT '' COMMENT '审批code',`user_id` bigint(1) NOT NULL DEFAULT '0' COMMENT '用户id',`process_template_id` bigint(20) DEFAULT NULL COMMENT '审批模板id',`process_type_id` bigint(20) DEFAULT NULL COMMENT '审批类型id',`title` varchar(255) DEFAULT NULL COMMENT '标题',`description` varchar(255) DEFAULT NULL COMMENT '描述',`form_values` text COMMENT '表单值',`process_instance_id` varchar(255) DEFAULT NULL COMMENT '流程实例id',`current_auditor` varchar(255) DEFAULT NULL COMMENT '当前审批人',`status` tinyint(3) DEFAULT NULL COMMENT '状态（0：默认 1：审批中 2：审批通过 -1：驳回）',`create_time` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP COMMENT '创建时间',`update_time` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP COMMENT '更新时间',`is_deleted` tinyint(3) NOT NULL DEFAULT '0' COMMENT '删除标记（0:不可用 1:可用）',PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=2 DEFAULT CHARSET=utf8 COMMENT='审批类型';

6.4.2 代码生成器

使用代码生成器生成代码。

6.4.3 分页查询方法

//controller/*** 条件分页查询*/@ApiOperation("条件分页查询")@GetMapping("/{page}/{limit}")public Result getPageList(@PathVariable Long page,@PathVariable Long limit,ProcessQueryVo processQueryVo){return Result.ok(processService.getPageList(page,limit,processQueryVo));}

//serviceimpl/*** 分页查询需要多表联查，所以需要自定义sql* @param page* @param limit* @param processQueryVo* @return*/@Overridepublic IPage<Process> getPageList(Long page, Long limit, ProcessQueryVo processQueryVo) {Page<Process> processPage = new Page<>(page, limit);IPage<Process> ret = baseMapper.selectPageList(processPage,processQueryVo);return ret;}

//mapper
IPage<Process> selectPageList(Page<Process> processPage, @Param("processQueryVo") ProcessQueryVo processQueryVo);

要注意，在工程打包时，java目录下的文件只会打包.java，xml文件不会被打包，所以会检测不到自定义的sql语句，可以通过在配置文件中配置扫描路径解决，或者直接将xml文件放在resources目录下更方便。
需要重新定义一个类用于存储查询结果。
在这里插入图片描述

//创建完成后，将相应方法中的Process都改为ProcessVo
@Data
@ApiModel(description = "Process")
public class ProcessVo {private Long id;private Date createTime;@ApiModelProperty(value = "审批code")private String processCode;@ApiModelProperty(value = "用户id")private Long userId;private String name;@TableField("process_template_id")private Long processTemplateId;private String processTemplateName;@ApiModelProperty(value = "审批类型id")private Long processTypeId;private String processTypeName;@ApiModelProperty(value = "标题")private String title;@ApiModelProperty(value = "描述")private String description;@ApiModelProperty(value = "表单属性")private String formProps;@ApiModelProperty(value = "表单选项")private String formOptions;@ApiModelProperty(value = "表单属性值")private String formValues;@ApiModelProperty(value = "流程实例id")private String processInstanceId;@ApiModelProperty(value = "当前审批人")private String currentAuditor;@ApiModelProperty(value = "状态（0：默认 1：审批中 2：审批通过 -1：驳回）")private Integer status;private String taskId;}

<mapper namespace="pers.beiluo.yunshangoffice.process.mapper.OaProcessMapper"><!--自定义分页查询--><select id="selectPageList" resultType="package pers.beiluo.yunshangoffice.vo.process.ProcessVo">selecta.id,a.process_code,a.user_id,a.process_template_id,a.process_type_id,a.title,a.description,a.form_values,a.process_instance_id,a.current_auditor,a.status,a.create_time,a.update_time,b.name as processTemplateName,c.name as processTypeName,d.namefrom oa_process aleft join oa_process_template b on b.id = a.process_template_idleft join oa_process_type c on c.id = a.process_type_idleft join sys_user d on d.id = a.user_id<where><if test="vo.keyword != null and vo.keyword != ''">and (a.process_code like CONCAT('%',#{vo.keyword},'%') or  a.title like CONCAT('%',#{vo.keyword},'%') or d.phone like CONCAT('%',#{vo.keyword},'%') or d.name like CONCAT('%',#{vo.keyword},'%'))</if><if test="vo.userId != null and vo.userId != ''">and a.user_id = #{vo.userId}</if><if test="vo.status != null and vo.status != ''">and a.status = #{vo.status}</if><if test="vo.createTimeBegin != null and vo.createTimeBegin != ''">and a.create_time >= #{vo.createTimeBegin}</if><if test="vo.createTimeEnd != null and vo.createTimeEnd != ''">and a.create_time &lt;= #{vo.createTimeEnd}</if></where>order by id desc</select></mapper>

6.4.4 整合前端

//创建src/api/process/process.js
import request from '@/utils/request'const api_name = '/admin/process'export default {getPageList(page, limit, searchObj) {return request({url: `${api_name}/${page}/${limit}`,method: 'get',params: searchObj // url查询字符串或表单键值对})}
}

<!--创建views/processMgr/process/list.vue-->
<template><div class="app-container"><div class="search-div"><el-form label-width="70px" size="small"><el-row><el-col :span="8"><el-form-item label="关 键 字"><el-input style="width: 95%" v-model="searchObj.keyword" placeholder="审批编号/标题/手机号码/姓名"></el-input></el-form-item></el-col><el-col :span="8"><el-form-item label="状态"><el-selectv-model="searchObj.status"placeholder="请选状态" style="width: 100%;"><el-optionv-for="item in statusList":key="item.status":label="item.name":value="item.status"/></el-select></el-form-item></el-col><el-col :span="8"><el-form-item label="操作时间"><el-date-pickerv-model="createTimes"type="datetimerange"range-separator="至"start-placeholder="开始时间"end-placeholder="结束时间"value-format="yyyy-MM-dd HH:mm:ss"style="margin-right: 10px;width: 100%;"/></el-form-item></el-col></el-row><el-row style="display:flex"><el-button type="primary" icon="el-icon-search" size="mini" :loading="loading" @click="fetchData()">搜索</el-button><el-button icon="el-icon-refresh" size="mini" @click="resetData">重置</el-button></el-row></el-form></div><!-- 列表 --><el-tablev-loading="listLoading":data="list"stripeborderstyle="width: 100%;margin-top: 10px;"><el-table-columnlabel="序号"width="70"align="center"><template slot-scope="scope">{{ (page - 1) * limit + scope.$index + 1 }}</template></el-table-column><el-table-column prop="processCode" label="审批编号" width="130"/><el-table-column prop="title" label="标题" width="180"/><el-table-column prop="name" label="用户"/><el-table-column prop="processTypeName" label="审批类型"/><el-table-column prop="processTemplateName" label="审批模板"/><el-table-column prop="description" label="描述" width="180"/><el-table-column label="状态"><template slot-scope="scope">{{ scope.row.status === 1 ? '审批中' : scope.row.status === 2 ? '完成' : '驳回' }}</template></el-table-column><el-table-column prop="createTime" label="创建时间" width="160"/><el-table-column label="操作" width="120" align="center"><template slot-scope="scope"><el-button type="text" size="mini" @click="show(scope.row.id)">查看</el-button></template></el-table-column></el-table><!-- 分页组件 --><el-pagination:current-page="page":total="total":page-size="limit":page-sizes="[5, 10, 20, 30, 40, 50, 100]"style="padding: 30px 0; text-align: center;"layout="sizes, prev, pager, next, jumper, ->, total, slot"@current-change="fetchData"@size-change="changeSize"/></div>
</template><script>
import api from '@/api/process/process'export default {data() {return {listLoading: true, // 数据是否正在加载list: null, // banner列表total: 0, // 数据库中的总记录数page: 1, // 默认页码limit: 10, // 每页记录数searchObj: {}, // 查询表单对象statusList: [{ 'status': '1', 'name': '进行中' },{ 'status': '2', 'name': '已完成' },{ 'status': '-1', 'name': '驳回' }],createTimes: []}},// 生命周期函数：内存准备完毕，页面尚未渲染created() {console.log('list created......')this.fetchData()},// 生命周期函数：内存准备完毕，页面渲染成功mounted() {console.log('list mounted......')},methods: {// 当页码发生改变的时候changeSize(size) {console.log(size)this.limit = sizethis.fetchData(1)},// 加载banner列表数据fetchData(page = 1) {console.log('翻页。。。' + page)// 异步获取远程数据（ajax）this.page = pageif (this.createTimes && this.createTimes.length === 2) {this.searchObj.createTimeBegin = this.createTimes[0]this.searchObj.createTimeEnd = this.createTimes[1]}api.getPageList(this.page, this.limit, this.searchObj).then(response => {this.list = response.data.recordsthis.total = response.data.total// 数据加载并绑定成功this.listLoading = false})},// 重置查询表单resetData() {console.log('重置查询表单')this.searchObj = {}this.fetchData()},show(id) {console.log(id)}}
}
</script>

6.4.5 完善流程定义部署

    @Overridepublic void publishProcessDefinition(Long id) {//模板status为1表示已发布，所以第一步先将状态设置为1ProcessTemplate processTemplate = baseMapper.selectById(id);processTemplate.setStatus(1);baseMapper.updateById(processTemplate);//部署流程定义deployProcess(processTemplate.getProcessDefinitionPath());}/*** 定义流程部署方法*/private void deployProcess(String path){InputStream resourceAsStream = this.getClass().getClassLoader().getResourceAsStream(path);ZipInputStream zipInputStream = new ZipInputStream(resourceAsStream);repositoryService.createDeployment().addZipInputStream(zipInputStream).deploy();}

<!--添加按钮判断，当流程定义发布后，就不能再修改或删除-->
<el-button type="text" v-if="scope.row.status == 0" size="mini" @click="edit(scope.row.id)" :disabled="$hasBP('bnt.processTemplate.templateSet')  === false">修改审批设置</el-button>
<el-button type="text" v-if="scope.row.status == 0" size="mini" @click="removeDataById(scope.row.id)" :disabled="$hasBP('bnt.processTemplate.remove')  === false">删除</el-button>

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.rhkb.cn/news/281185.html

如若内容造成侵权/违法违规/事实不符，请联系长河编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

TikTok美国本土小店如何运营？常见小白问题解答

TikTok美国本土小店如何运营？常见小白问题解答

作为资深跨境老玩家&#xff0c;虽不说是经验丰富&#xff0c;至少也是摸清了基本的玩法思路。TikTok作为近来的跨境新蓝海&#xff0c;他的玩法其实并不难&#xff0c;作为第一批试错玩家&#xff0c;今天也诚心给大家分享一些美国本土小店运营经验&#xff0c;感兴趣的话就看…
阅读更多...
当我们谈论Spring的时候到底在谈什么

当我们谈论Spring的时候到底在谈什么

题图来自APOD 你好&#xff0c;这里是codetrend专栏“Spring6全攻略”。欢迎点击关注查看往期文章。 Spring对于不做程序开发的人来说字面意思就是春天&#xff0c;四季的开始。 对于程序员来说这个单词完全拥有另外一个含义&#xff0c;Spring指的是一个开源项目&#xff0…
阅读更多...
C语言经典算法-6

C语言经典算法-6

文章目录 其他经典例题跳转链接31.数字拆解32.得分排行33.选择、插入、气泡排序34.Shell 排序法 - 改良的插入排序35.Shaker 排序法 - 改良的气泡排序 其他经典例题跳转链接 C语言经典算法-1 1.汉若塔 2. 费式数列 3. 巴斯卡三角形 4. 三色棋 5. 老鼠走迷官&#xff08;一&…
阅读更多...
Python图像处理指南：PIL与OpenCV的比较【第136篇—PIL】

Python图像处理指南：PIL与OpenCV的比较【第136篇—PIL】

&#x1f47d;发现宝藏 前些天发现了一个巨牛的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;忍不住分享一下给大家。【点击进入巨牛的人工智能学习网站】。 Python图像处理指南&#xff1a;PIL与OpenCV的比较 图像处理在计算机视觉和图像识别等领域…
阅读更多...
【极简无废话】open3d可视化torch、numpy点云

【极简无废话】open3d可视化torch、numpy点云

建议直接看文档&#xff0c;很多都代码老了&#xff0c;注意把代码版本调整到你使用的open3d的版本&#xff1a; https://www.open3d.org/docs/release/tutorial/visualization/visualization.html 请注意open3d应该已经不支持centos了&#xff01; 从其他格式转换成open3d…
阅读更多...
动手做简易版俄罗斯方块

动手做简易版俄罗斯方块

导读&#xff1a;让我们了解如何处理形状的旋转、行的消除以及游戏结束条件等控制因素。 目录 准备工作 游戏设计概述 构建游戏窗口 游戏方块设计 游戏板面设计 游戏控制与逻辑 行消除和计分 判断游戏结束 界面美化和增强体验 看看游戏效果 准备工作 在开始编码之前…
阅读更多...
Memcached-分布式内存对象缓存系统

Memcached-分布式内存对象缓存系统

目录 一、NoSQL 介绍 二、Memcached 1、Memcached 介绍 1.1 Memcached 概念 1.2 Memcached 特性 1.3 Memcached 和 Redis 区别 1.4 Memcached 工作机制 1.4.1 内存分配机制 1.4.2 懒惰期 Lazy Expiration 1.4.3 LRU&#xff08;最近最少使用算法&#xff09; 1.4.4…
阅读更多...
【07】进阶html5

【07】进阶html5

HTML5 包含两个部分的更新，分别是文档和web api 文档 HTML5 元素表 元素语义化 元素语义化是指每个 HTML 元素都代表着某种含义，在开发中应该根据元素含义选择元素 元素语义化的好处： 利于 SEO（搜索引擎优化）利于无障碍访问利于浏览器的插件分析网页新增元素 多媒体…
阅读更多...
【C++干货基地】特殊函数名的函数：赋值运算符重载

【C++干货基地】特殊函数名的函数：赋值运算符重载

&#x1f3ac; 鸽芷咕&#xff1a;个人主页 &#x1f525; 个人专栏: 《C干货基地》《粉丝福利》 ⛺️生活的理想&#xff0c;就是为了理想的生活! 引入 哈喽各位铁汁们好啊&#xff0c;我是博主鸽芷咕《C干货基地》是由我的襄阳家乡零食基地有感而发&#xff0c;不知道各位的…
阅读更多...
OceanBase生产环境安装部署的最优实践

OceanBase生产环境安装部署的最优实践

关于生产环境&#xff0c;为了尽量确保性能和稳定性&#xff0c;我们比较建议采用标准化的配置进行部署&#xff0c;例如接下来会提到的服务初始化、日志管理和数据分盘等关键步骤。而在非生产环境中&#xff0c;如果条件满足&#xff0c;同样建议遵循规范部署的原则。 前期准备…
阅读更多...
SpringBoot如何写好单元测试

SpringBoot如何写好单元测试

&#x1f413;序言 Spring中的单元测试非常方便&#xff0c;可以很方便地对Spring Bean进行测试&#xff0c;包括Controller、Service和Repository等Spring Bean进行测试&#xff0c;确保它们的功能正常&#xff0c;并且不会因为应用的其他变化而出现问题。 &#x1f413;单元测…
阅读更多...
CSS问题精粹1

CSS问题精粹1

1.关于消除<li>列表前的符号 我相信很多人在初学CSS时会遇到该问题&#xff0c;无论是创作导航&#xff0c;还是列表&#xff0c;前面都会有个黑点点或其它符号。 解决该问题其实很简单 采用list-style-type:none或list-style:none直接解决 如果你想更换前面的黑点点&a…
阅读更多...
进程的概念 | PCB | Linux下的task_struct | 父子进程和子进程

进程的概念 | PCB | Linux下的task_struct | 父子进程和子进程

在讲进程之前首先就是需要去回顾一下我们之前学的操作系统是干嘛的&#xff0c;首先操作系统是一个软件&#xff0c;它是对上提供一个良好高效&#xff0c;稳定的环境的&#xff0c;这是相对于用户来说的&#xff0c;对下是为了进行更好的软硬件管理的&#xff0c;所以操作系统…
阅读更多...
MySQL之索引与事务

MySQL之索引与事务

一 索引的概念 一种帮助系统查找信息的数据 数据库索引 是一个排序的列表&#xff0c;存储着索引值和这个值所对应的物理地址无须对整个表进行扫描&#xff0c;通过物理地 址就可以找到所需数据是表中一列或者若干列值排序的方法 需要额外的磁盘空间 索引的作用 1 数据库…
阅读更多...
浅谈RPC的理解

浅谈RPC的理解

浅谈RPC的理解 前言RPC体系Dubbo架构最后 前言 本文中部分知识涉及Dubbo&#xff0c;需要对Dubbo有一定的理解&#xff0c;且对源码有一定了解 如果不了解&#xff0c;可以参考学习我之前的文章&#xff1a; 浅谈Spring整合Dubbo源码&#xff08;Service和Reference注解部分&am…
阅读更多...
数字化战略失配企业现状，可惜了！

数字化战略失配企业现状，可惜了！

尽管大部分的企业领导者已经意识到数字化转型对于企业革新业务模式、提升运营效率、抢占市场先机的关键作用&#xff0c;但是&#xff0c;认知上的转变并不等同于成功的实践。在实际操作中&#xff0c;往往出现战略与企业现状不符的现象&#xff0c;这无疑会使得所有的努力付诸…
阅读更多...
windows查看局域网内所有已使用的IP IP扫描工具 扫描网段下所有的IP Windows环境下

windows查看局域网内所有已使用的IP IP扫描工具 扫描网段下所有的IP Windows环境下

推荐使用&#xff1a; Advanced IP Scanner 官网下载&#xff1a; https://www.advanced-ip-scanner.com/
阅读更多...
学习vue3第九节（新加指令 v-pre/v-once/v-memo/v-cloak ）

学习vue3第九节（新加指令 v-pre/v-once/v-memo/v-cloak ）

1、v-pre 作用&#xff1a;防止编译器解析某个特定的元素及其内容&#xff0c;即v-pre 会跳过当前元素以及其子元素的vue语法解析&#xff0c;并将其保持原样输出&#xff1b; 用于&#xff1a;vue 中一些没有指令和插值表达式的节点的元素&#xff0c;使用 v-pre 可以提高 Vu…
阅读更多...
LeetCode 17 / 100

LeetCode 17 / 100

目录 普通数组最大子数组和合并区间轮转数组除自身以外数组的乘积缺失的第一个正数 LeetCode 53. 最大子数组和 LeetCode 56. 合并区间 LeetCode 189. 轮转数组 LeetCode 238. 除自身以外数组的乘积 LeetCode 41. 缺失的第一个正数 普通数组 最大子数组和 给你一个整数数组 …
阅读更多...
十、MySQL主从架构配置

十、MySQL主从架构配置

目录 一、资源配置 二、主从同步基本原理&#xff1a; 1、具体步骤&#xff1a; 2、数据库是靠什么同步的&#xff1f; 3、pos与GTID的区别&#xff1f; 三、配置一主两从 &#xff08;1&#xff09;为主库和从库创建复制账户&#xff0c; 分别在主从库上执行如下命令&a…
阅读更多...
最新文章
推荐文章

Copyright @ 2022~2023