sdz/cmanager
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

project init

Browse Source
This commit is contained in:
zxy
2024-02-02 10:23:22 +08:00
commit dc7051417b
681 changed files with 142886 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

476
src/views/manage/rules/Dialog/addEditRule.vue Normal file
View File

@@ -0,0 +1,476 @@
<template>
<div>
<el-drawer
:title="dialogTitle"
:before-close="handleClose"
:visible.sync="addRuleDialogVisible"
direction="rtl"
custom-class="demo-drawer"
ref="drawer"
@close="closeDrawer"
size="50%"
class="rules-add-dialog"
>
<div class="demo-drawer__content">
<el-form
:model="addRulesForm"
:rules="formRules"
ref="addRulesForm"
label-position="right"
label-width="120px"
>
<el-form-item
label="所属一级分类："
:label-width="formLabelWidth"
prop="firstId"
>
<el-select
v-model="addRulesForm.firstId"
placeholder="请选择所属一级分类"
@change="selectChange"
>
<el-option
v-for="(item, index) in firstItemList"
:key="index"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item
label="所属二级分类："
:label-width="formLabelWidth"
prop="secondId"
>
<el-select
v-model="addRulesForm.secondId"
placeholder="请选择所属二级分类"
@change="$forceUpdate()"
>
<el-option
v-for="(item, index) in secondItemList"
:key="index"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item
label="制度名称："
:label-width="formLabelWidth"
prop="docName"
>
<el-input
v-model="addRulesForm.docName"
placeholder="请输入制度名称"
style="width: 360px"
maxlength="20"
show-word-limit
></el-input>
</el-form-item>
<el-form-item
label="上传文档："
:label-width="formLabelWidth"
prop="docUrl"
>
<el-upload
:action="putFile"
class="rules-upload-file"
:on-preview="handlePreview"
:on-remove="handleRemove"
:before-remove="beforeRemove"
:on-exceed="handleExceed"
:file-list="fileList"
:show-file-list="true"
:on-success="handleFileSuccess"
:before-upload="beforeFileUpload"
:limit="1"
accept=".pdf, .doc, .docx, .xls, .xlsx"
>
<el-button size="small" type="text">请选择文档</el-button>
</el-upload>
</el-form-item>
<el-form-item
label="上传图片："
:label-width="formLabelWidth"
prop="docImage"
>
<el-upload
:action="putFile"
class="avatar-uploader"
:show-file-list="false"
:on-success="handleAvatarSuccess"
:before-upload="beforeAvatarUpload"
>
<img v-if="imageUrl" :src="imageUrl" class="avatar" />
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-upload>
<el-dialog
:visible.sync="viewImgDialogVisible"
append-to-body
width="50%"
class="addRules-view-dialog"
>
<img width="100%" height="100%" :src="imageUrl" alt />
</el-dialog>
</el-form-item>
<el-form-item
label="状态："
:label-width="formLabelWidth"
prop="status"
>
<el-radio-group
v-model="addRulesForm.status"
@change="changeStatus"
>
<el-radio :label="0">显示</el-radio>
<el-radio :label="1">隐藏</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit">保存</el-button>
<el-button @click="addRuleDialogVisible = false">取消</el-button>
</el-form-item>
</el-form>
</div>
</el-drawer>
</div>
</template>
<script>
import {
ruleGetTypeList,
addRule,
editRule,
getRuleDetailInfo,
} from "@/api/manage/rules";
import { putFile } from "@/api/resource/oss";
export default {
data() {
return {
addRuleDialogVisible: false,
firstItemList: [],
secondItemList: [],
fileList: [],
putFile,
imageUrl: "",
parentData: {},
operateType: "",
dialogTitle: "",
addRulesForm: {
firstId: "",
secondId: "",
docName: "",
docUrl: "",
docImage: "",
status: 0,
},
query: {},
formRules: {
firstId: [
{
required: true,
message: "请选择一级分类",
trigger: "blur",
},
],
/* secondId: [
{
required: true,
message: "请选择二级分类",
trigger: "blur",
},
],*/
docName: [
{
required: true,
message: "请输入制度名称",
trigger: "blur",
},
],
docUrl: [
{
required: true,
message: "请上传制度文档",
trigger: "blur",
},
],
docImage: [
{
required: true,
message: "请上传制度封面",
trigger: "blur",
},
],
},
};
},
methods: {
openDrawer() {
this.addRuleDialogVisible = true;
this.firstItemList = [];
ruleGetTypeList(0).then((res) => {
this.firstItemList = res.data.data;
});
},
selectChange(val) {
this.secondItemList = [];
this.addRulesForm.secondId = "";
ruleGetTypeList(val).then((res) => {
this.secondItemList = res.data.data;
/* if(this.secondItemList.length==0){/**一级分类下，二级分类为空时，默认显示“无”
this.secondItemList=[
{
id:-1,
name:"无"
},
]
}*/
});
},
closeDrawer() {
this.addRulesForm = {};
this.imageUrl = "";
this.docUrl = "";
this.fileList = [];
this.firstItemList = [];
this.secondItemList = [];
},
/**图片上传 */
handleAvatarSuccess(res, file) {
this.imageUrl = URL.createObjectURL(file.raw);
this.$set(this.addRulesForm, "docImage", res.data.link);
},
uploadImgSuccess(res) {
this.$set(this.addRulesForm, "docImage", res.data.link);
},
beforeAvatarUpload(file) {
const isJPG =
["image/png", "image/jpeg", "image/svg+xml", "image/gif"].indexOf(
file.type
) != -1;
const isLt2M = file.size / 1024 / 1024 < 2;
if (!isJPG) {
this.$message.error("上传图片格式不正确");
}
if (!isLt2M) {
this.$message.error("上传图片大小不能超过 2MB!");
}
return isJPG && isLt2M;
},
/**图片上传 */
/**文件上传 */
handleExceed() {
this.$message.warning("最多只能上传一个文件");
},
handleRemove() {
this.addRulesForm.docUrl = "";
},
handleFileSuccess(res) {
this.$set(this.addRulesForm, "docUrl", res.data.link);
},
beforeFileUpload(file) {
const fileSuffix = file.name.substring(file.name.lastIndexOf(".") + 1);
const whiteList = ["pdf", "doc", "docx", "xls", "xlsx"];
if (whiteList.indexOf(fileSuffix) === -1) {
this.$message.error("上传文件只能是 pdf、doc、docx、xls、xlsx格式");
return false;
}
},
/**文件上传 */
/**提交表单 */
onSubmit() {
this.$refs.addRulesForm.validate((valid) => {
if (valid) {
if (this.operateType == "add") {
let secondid = this.addRulesForm.secondId;
/* if(secondid==-1){
secondid="";
}*/
addRule(
this.addRulesForm.firstId,
secondid,
this.addRulesForm.docName,
this.addRulesForm.docUrl,
this.addRulesForm.docImage,
this.addRulesForm.status
).then(() => {
this.$message.success("添加成功");
this.$emit("success");
this.addRuleDialogVisible = false;
});
} else if (this.operateType == "edit") {
let firId =
this.addRulesForm.firstId == this.parentData.categoryOne
? this.parentData.firstId
: this.addRulesForm.firstId;
let secId =
this.addRulesForm.secondId == this.parentData.categoryTwo
? this.parentData.secondId
: this.addRulesForm.secondId;
/* if(secId==-1){
secId="";
}*/
editRule(
this.parentData.id,
firId,
secId,
this.addRulesForm.docName,
this.addRulesForm.docUrl,
this.addRulesForm.docImage,
this.addRulesForm.status
).then(() => {
this.$message.success("修改成功");
this.$emit("success");
this.addRuleDialogVisible = false;
});
}
}
});
/*
*/
},
getRuleInfo() {
this.addRulesForm.firstId = this.parentData.categoryOne;
this.addRulesForm.secondId = this.parentData.categoryTwo;
getRuleDetailInfo(this.parentData.id).then((res) => {
const data = res.data.data;
// this.addRulesForm.docName = data.docName;
this.$set(this.addRulesForm, "docName", data.docName);
this.addRulesForm.docUrl = data.docUrl;
this.addRulesForm.docImage = data.docImage;
//this.addRulesForm.status = data.status;
this.$set(this.addRulesForm, "status", data.status);
this.imageUrl = data.docImage;
this.whetherShowImg = true;
});
},
changeStatus(val) {
this.$set(this.addRulesForm, "status", val);
},
open(data, type) {
this.parentData = data;
this.operateType = type;
this.firstItemList = [];
ruleGetTypeList(0).then((res) => {
this.firstItemList = res.data.data;
});
this.addRuleDialogVisible = true;
if (this.operateType == "edit") {
this.dialogTitle = "查看制度";
/**1、获取form的值，显示在页面上
* 2、给两个select的option赋值 */
this.getRuleInfo();
} else {
this.dialogTitle = "新增制度";
this.addRulesForm = {
status: 0,
};
}
},
},
};
</script>
<style scoped>
.rules-img-upload {
list-style: none;
width: 180px;
height: 180px;
position: relative;
}
.delete-img {
display: block;
position: absolute;
width: 180px;
height: 40px;
line-height: 40px;
left: 0px;
top: 140px;
background: rgba(59, 60, 61, 0.5);
z-index: 999;
cursor: pointer;
text-align: right;
}
.rules-img-upload .delete-img .el-icon-delete {
float: left;
display: block;
font-size: 24px;
color: white;
margin-left: 10px;
}
.rules-img-upload .delete-img .el-icon-zoom-in {
float: right;
display: block;
font-size: 24px;
color: white;
margin-right: 10px;
}
.avatar-uploader {
width: 178px;
height: 178px;
display: block;
border: 1px dashed #d9d9d9;
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
}
.avatar-uploader .el-upload {
border: 1px dashed #d9d9d9;
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
}
.avatar-uploader .el-upload:hover {
border-color: #409eff;
}
.avatar-uploader-icon {
font-size: 28px;
color: #8c939d;
width: 178px;
height: 178px;
line-height: 178px;
text-align: center;
}
.avatar {
width: 178px;
height: 178px;
display: block;
}
.addRules-view-dialog /deep/ .el-dialog {
height: 80%;
}
.rules-add-dialog .el-form-item {
margin-bottom: 22px!important;
}
.rules-add-dialog /deep/ .el-form-item__label{
font-size: 14px;
}
.rules-add-dialog .el-input{
font-size: 14px;
}
.rules-add-dialog /deep/.el-input--suffix .el-input__inner{
font-size: 14px;
}
</style>

453
src/views/manage/rules/ruleTypes.vue Normal file
View File

@@ -0,0 +1,453 @@
<template>
<basic-container>
<div style="margin-bottom: 10px">
<el-button v-if="permission.manage_rules_ruleTypes_addFirstType" @click="handleAddFirstType" type="primary"
>新增一级分类</el-button
>
<el-button type="danger" @click="mutiDel">批量删除</el-button>
<el-button type="success" @click="mutiShowOrHidType('show')"
>批量显示</el-button
>
<el-button type="info" @click="mutiShowOrHidType('hide')"
>批量隐藏</el-button
>
</div>
<el-table
:data="tableData"
style="width: 100%; margin-bottom: 20px"
row-key="id"
border
@selection-change="handleSelectionChange"
v-loading="loading"
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
>
<el-table-column type="selection" width="55"> </el-table-column>
<el-table-column type="" label="序号" width="50">
<template slot-scope="scope">{{ scope.row.index }}</template>
</el-table-column>
<el-table-column type="" prop="parentName" label="一级分类" width="180">
</el-table-column>
<el-table-column
prop="name"
label="二级分类"
width="180"
:style="secondTypeSelfStyle"
>
<template slot-scope="{ row }">
<span v-if="row.children">展开</span>
<!-- <span v-if="row.children && !row.open" @click="openItem(row)" class="rules-open-close-item">收起</span>-->
<span v-if="row.type == 2">{{ row.name }}</span>
<span v-if="row.type == 1 && !row.children">-</span>
</template>
</el-table-column>
<el-table-column prop="status" label="状态">
<template slot-scope="{ row }">
<span v-if="row.status == 0">显示</span>
<span v-else>隐藏</span>
</template>
</el-table-column>
<el-table-column prop="" label="排序">
<template slot-scope="{ row }">
<el-button type="text" @click="moveType(row, 'up')">上移</el-button>
<el-button type="text" @click="moveType(row, 'down')">下移</el-button>
</template>
</el-table-column>
<el-table-column prop="" label="操作">
<template slot-scope="{ row }">
<el-button
v-if="row.status == 0 && permission.manage_rules_ruleTypes_hideType"
type="text"
@click="hideOrShowRule(row.id, 'hide')"
>隐藏</el-button
>
<el-button v-if="row.status==1 && permission.manage_rules_ruleTypes_showType" type="text" @click="hideOrShowRule(row.id, 'show')"
>显示</el-button
>
<el-button
type="text"
@click="viewRuleType(row.id)"
v-if="row.type == 1"
>查看</el-button
>
<el-button type="text" @click="delRule(row.id)" v-if="permission.manage_rules_ruleTypes_delType">删除</el-button>
<el-button
@click="handleAddSecondType(row.id)"
icon="el-icon-circle-plus-outline"
type="text"
v-if="row.type == 1 && permission.manage_rules_ruleTypes_addSecondType"
></el-button>
</template>
</el-table-column>
</el-table>
<!--添加一级分类的抽屉-->
<el-drawer
:title="drawerTitle"
:before-close="handleClose"
:visible.sync="addFirstTypeDrawer"
direction="rtl"
custom-class="demo-drawer"
ref="drawer"
size="50%"
>
<div class="demo-drawer__content">
<el-form :model="form" :rules="rules" ref="firstTypeForm">
<el-form-item
label="一级分类名称"
:label-width="formLabelWidth"
prop="name"
>
<el-input
v-model="form.name"
autocomplete="off"
maxlength="20"
required
show-word-limit
></el-input>
</el-form-item>
<el-form-item
label="分类介绍"
:label-width="formLabelWidth"
prop="introduce"
>
<el-input
type="textarea"
v-model="form.introduce"
required
maxlength="100"
show-word-limit
autocomplete="off"
></el-input>
</el-form-item>
<el-form-item
label="温馨提示"
:label-width="formLabelWidth"
prop="prompt"
>
<el-input
type="textarea"
v-model="form.prompt"
required
maxlength="100"
show-word-limit
autocomplete="off"
></el-input>
</el-form-item>
</el-form>
<div class="demo-drawer__footer">
<el-button @click="addFirstTypeDrawer=false">取 消</el-button>
<el-button type="primary" @click="addFirstTypesubmit" :loading="addFirstTypeBtnLoading">提交</el-button>
</div>
</div>
</el-drawer>
<!--添加二级分类-->
<el-dialog
title="添加二级分类"
:visible.sync="secondTypeDialogVisible"
append-to-body
>
<el-form
:model="secondTypeform"
:rules="addSecondTypeFormRules"
ref="addSecondTypeForm"
label-position="right"
label-width="80px"
>
<el-form-item label="名称" :label-width="formLabelWidth" prop="name">
<el-input
v-model="secondTypeform.name"
autocomplete="off"
maxlength="20"
show-word-limit
></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="secondTypeDialogVisible = false">取 消</el-button>
<el-button
type="primary"
@click="submitAddSecondType"
:loading="submitBtnLoading"
>保存</el-button
>
</div>
</el-dialog>
<!---->
</basic-container>
</template>
<script>
import {
getRuleTypesList,
delRuleType,
hideRuleType,
addRuleType,
addSecondRuleType,
ruleTypeDetail,
moveRuleType,
editTypeInfo,
} from "@/api/manage/rules";
import { mapGetters } from "vuex";
export default {
data() {
return {
selectionList: [],
tableData: [],
loading: false,
drawerTitle: false,
addFirstTypeDrawer: false,
secondTypeDialogVisible: false,
parentId: null,
open: true,
operateType: "",
editTypeId: "",
submitBtnLoading: false,
addFirstTypeBtnLoading:false,
form: {
name: "",
introduce: "",
prompt: "",
},
secondTypeform: {
name: "",
},
rules: {
name: [
{ required: true, message: "请输入一级分类名称", trigger: "blur" },
],
introduce: [{ required: true, message: "请输入介绍", trigger: "blur" }],
prompt: [
{ required: true, message: "请输入温馨提示", trigger: "blur" },
],
},
addSecondTypeFormRules: {
name: [
{ required: true, message: "请输入二级分类名称", trigger: "blur" },
],
},
};
},
computed: {
...mapGetters(['permission']),
ids() {
let ids = [];
this.selectionList.forEach((element) => {
ids.push(element.id);
});
return ids;
},
},
mounted() {
this.onload();
},
methods: {
handleSelectionChange(list) {
this.selectionList = list;
},
/**查看一级分类 */
viewRuleType(id) {
this.operateType = "edit";
this.drawerTitle = "查看一级分类";
this.editTypeId = id;
ruleTypeDetail(id).then((res) => {
this.form = res.data.data;
this.addFirstTypeDrawer = true;
});
},
handleAddFirstType() {
this.operateType = "add";
this.drawerTitle = "新增一级分类";
this.addFirstTypeDrawer = true;
this.form = {
name: "",
introduce: "",
prompt: "",
};
},
/**新增/编辑一级分类 */
addFirstTypesubmit() {
this.addFirstTypeBtnLoading=true;
const fatherId = 0;
const remarks = "";
this.$refs.firstTypeForm.validate((valid) => {
if (valid) {
if (this.operateType == "add") {
addRuleType(
fatherId,
this.form.name,
this.form.introduce,
this.form.prompt,
remarks
)
.then(() => {
this.addFirstTypeBtnLoading=false;
this.$message.success("添加成功");
this.addFirstTypeDrawer = false;
this.onload();
})
.catch((err) => {
this.$message.error(err);
});
} else {
let idArr = [];
idArr.push(this.editTypeId);
editTypeInfo(
idArr,
this.form.name,
this.form.introduce,
this.form.prompt
).then(() => {
this.addFirstTypeBtnLoading=false;
this.$message.success("修改成功");
this.addFirstTypeDrawer = false;
this.onload();
});
}
}
});
},
/**新增二级分类 */
handleAddSecondType(fatherId) {
this.parentId = fatherId;
this.secondTypeDialogVisible = true;
this.secondTypeform = {};
},
submitAddSecondType() {
this.submitBtnLoading = true;
this.$refs.addSecondTypeForm.validate((valid) => {
if (valid) {
addSecondRuleType(this.parentId, this.secondTypeform.name).then(
() => {
this.submitBtnLoading = false;
this.secondTypeDialogVisible = false;
this.$message.success("添加成功");
this.onload();
}
);
}
});
},
hideOrShowRule(id, type) {
let ids = [];
ids.push(id);
let tips = type == "show" ? "显示" : "隐藏";
type = type == "show" ? 0 : 1;
this.$confirm(`是否确定${tips}该分类?`, {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
}).then(() => {
hideRuleType(ids, type)
.then(() => {
this.$message.success(`${tips}成功`);
this.onload();
})
.catch((err) => {
this.$message.error(err);
});
});
},
mutiShowOrHidType(type) {
let tips = type == "show" ? "显示" : "隐藏";
type = type == "show" ? 0 : 1;
if (this.selectionList.length == 0) {
this.$message.closeAll();
this.$message.error("至少选择一条数据");
} else {
this.$confirm(`是否确定批量${tips}分类?`, {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
}).then(() => {
hideRuleType(this.ids, type)
.then(() => {
this.$message.success("操作成功");
this.onload();
})
.catch((err) => {
this.$message.error(err);
});
});
}
},
mutiDel() {
if (this.selectionList.length == 0) {
this.$message.closeAll();
this.$message.error("至少选择一条数据");
} else {
this.$confirm("是否确定批量删除分类?", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
}).then(() => {
delRuleType(this.ids, 1)
.then(() => {
this.$message.success("批量删除成功");
this.onload();
})
.catch((err) => {
this.$message.error(err);
});
});
}
},
delRule(id) {
let ids = [];
ids.push(id);
this.$confirm("是否确定删除该分类?", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
}).then(() => {
delRuleType(ids, 1)
.then(() => {
this.$message.success("删除成功");
this.onload();
})
.catch((err) => {
this.$message.error(err);
});
});
},
/**移动分类顺序 */
moveType(row, type) {
type = type == "up" ? 0 : 1;
moveRuleType(row.id, type, row.sort, row.fatherId).then(() => {
this.$message.closeAll();
this.$message.success("操作成功");
this.onload();
});
},
onload() {
this.loading = true;
getRuleTypesList().then((res) => {
let data = res.data.data;
let i = 1;
data.forEach((element) => {
if (element["type"] == 1) {
element["parentName"] = element["name"];
delete element["name"];
}
if (element["rulesGroups"]) {
element["index"] = i++;
if (element["rulesGroups"].length != 0) {
element["children"] = element["rulesGroups"];
}
}
});
this.tableData = data;
this.loading = false;
});
},
},
};
</script>
<style >
</style>

456
src/views/manage/rules/rulesList.vue Normal file
View File

@@ -0,0 +1,456 @@
<template>
<basic-container>
<avue-crud
:option="option"
:table-loading="loading"
:data="data"
ref="crud"
v-model="form"
:page="page"
:permission="permissionList"
@row-del="rowDel"
@row-update="rowUpdate"
@row-save="rowSave"
@search-change="searchChange"
@search-reset="searchReset"
@current-change="currentChange"
@size-change="sizeChange"
@selection-change="selectionChange"
@refresh-change="refreshChange"
@on-load="onLoad"
>
<!--分类选择搜索栏-->
<template slot="categoryOneSearch">
<el-select
v-model="query.categoryOne"
placeholder="所属一级分类"
@change="selectFirstTypeChange"
>
<el-option
v-for="(item, index) in firstTyepSearchList"
:key="index"
:label="item.name"
:value="item.id"
>{{ item.name }}</el-option
>
</el-select>
</template>
<template slot="categoryTwoSearch">
<el-select
v-model="query.categoryTwo"
placeholder="所属二级分类"
@change="selectSecondTypeChange"
>
<el-option
v-for="(item, index) in secondTyepSearchList"
:key="index"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</template>
<!--分类选择搜索栏-->
<!--日期选择搜索栏-->
<template slot="createTimeSearch">
<el-date-picker
v-model="query.createTime"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
format="yyyy-MM-dd"
value-format="yyyy-MM-dd"
@change="dateChange"
>
</el-date-picker>
</template>
<!--日期选择搜索栏-->
<template slot="menuLeft">
<el-button
v-if="permission.manage_rules_rulesList_addRule"
type="primary"
@click="handleAddRule(null, 'add')"
>新增制度</el-button
>
<el-button type="danger" @click="mutiDel">批量删除</el-button>
<el-button type="success" @click="mutiShowOrHidRule('show')"
>批量显示</el-button
>
<el-button type="info" @click="mutiShowOrHidRule('hide')"
>批量隐藏</el-button
>
</template>
<template slot="menu" slot-scope="{ row }">
<el-button
v-if="row.status == 0 && permission.manage_rules_rulesList_hideRule"
type="text"
@click="hideOrShowRule(row.id, 'hide')"
size="small"
>隐藏</el-button
>
<el-button
v-if="row.status==1 && permission.manage_rules_rulesList_showRule"
type="text"
@click="hideOrShowRule(row.id, 'show')"
size="small"
>显示</el-button
>
<el-button
v-if="permission.manage_rules_rulesList_editRule"
type="text"
@click="handleAddRule(row, 'edit')"
size="small"
>查看</el-button
>
</template>
</avue-crud>
<add-edit-rule ref="addOrEditRule" @success="refreshChange"></add-edit-rule>
</basic-container>
</template>
<script>
import {
getRulesList,
delRules,
hideOrShowRules,
ruleGetTypeList,
} from "@/api/manage/rules";
import addEditRule from "./Dialog/addEditRule";
import { mapGetters } from "vuex";
export default {
components: {
addEditRule,
},
data() {
return {
edit: {
id: "",
visible: false,
},
selectionList: [],
addRuleDialogVisible: false,
loading: false,
page: {
pageSize: 10,
currentPage: 1,
total: 0,
},
data: [],
fileList: [],
form: {
firstId: "",
},
query: {},
firstTyepSearchList: [],
secondTyepSearchList: [],
option: {
height: "auto",
align: "center",
menuAlign: "center",
tip: false,
addBtn: false,
addBtnText: "新增制度",
delBtn: true,
editBtn: false,
viewBtn: false,
excelBtn: false,
columnBtn: false,
searchBtn: true,
searchShow: true,
searchMenuSpan: 6,
border: true,
index: true,
indexLabel: "序号",
selection: true,
dialogClickModal: false,
dialogType: "drawer",
column: [
{
label: "制度名称",
prop: "docName",
searchSpan: 6,
search: true,
display: false,
rules: [
{
required: true,
whitespace: true,
message: "制度名称必须填写",
},
{
max: 30,
message: "长度在30个字以内",
},
],
row: true,
},
{
type: "select",
label: "所属一级分类",
prop: "categoryOne",
display: false,
searchSpan: 8,
search: true,
searchLabelWidth: 110,
searchslot: true,
},
{
type: "select",
label: "所属二级分类",
prop: "categoryTwo",
display: false,
searchSpan: 8,
search: true,
searchslot: true,
searchLabelWidth: 110,
},
{
label: "发布时间",
prop: "createTime",
type: "datatime",
formate: "yyyy-mm-dd hh:mm",
searchslot: true,
searchSpan: 8,
search: true,
display: false,
},
{
label: "格式",
prop: "typeStr",
display: false,
},
{
label: "状态",
prop: "status",
type: "select",
dicData: [
{
label: "显示",
value: 0,
},
{
label: "隐藏",
value: 1,
},
],
display: false,
searchSpan: 6,
search: true,
},
],
},
};
},
computed: {
...mapGetters(["permission"]),
permissionList() {
return {
delBtn: this.vaildData(this.permission.manage_rules_rulesList_delRule, false),
};
},
ids() {
let ids = [];
this.selectionList.forEach((ele) => {
ids.push(ele.id);
});
return ids;
},
},
activated() {
this.$refs.crud &&
this.$refs.crud.$refs.table &&
this.$refs.crud.$refs.table.doLayout();
},
methods: {
searchReset() {
this.query = {};
this.onLoad(this.page, this.query);
},
searchChange(params, done) {
if (this.query.createTime) {
this.query.beginTime = this.query.createTime[0];
this.query.endTime = this.query.createTime[1];
delete this.query.createTime;
}
if (this.query.categoryOne) {
this.query.firstId = this.query.categoryOne;
}
if (this.query.categoryTwo) {
this.query.secondId = this.query.categoryTwo;
}
Object.assign(this.query, params);
this.page.currentPage = 1;
this.onLoad(this.page, this.query);
done();
},
selectionChange(list) {
this.selectionList = list;
},
currentChange(currentPage) {
this.page.currentPage = currentPage;
},
sizeChange(pageSize) {
this.page.pageSize = pageSize;
},
/*刷新本页 带搜索参数*/
refreshChange() {
this.onLoad(this.page);
},
/**批量删除 */
mutiDel() {
if (this.selectionList.length == 0) {
this.$message.closeAll();
this.$message.error("至少选择一条数据");
} else {
this.$confirm("是否确定批量删除制度?", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
}).then(() => {
delRules(this.ids, 1)
.then(() => {
this.$message.success("批量删除成功");
this.onLoad(this.page);
})
.catch((err) => {
this.$message.error(err);
});
});
}
},
hideOrShowRule(id, type) {
let ids = [];
ids.push(id);
let tips = type == "show" ? "显示" : "隐藏";
type = type == "show" ? 0 : 1;
this.$confirm(`是否确定${tips}该制度?`, {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
}).then(() => {
hideOrShowRules(ids, type)
.then(() => {
this.$message.success(`${tips}成功`);
this.onLoad(this.page);
})
.catch((err) => {
this.$message.error(err);
});
});
},
mutiShowOrHidRule(type) {
let tips = type == "show" ? "显示" : "隐藏";
type = type == "show" ? 0 : 1;
if (this.selectionList.length == 0) {
this.$message.closeAll();
this.$message.error("至少选择一条数据");
} else {
this.$confirm(`是否确定批量${tips}制度?`, {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
}).then(() => {
hideOrShowRules(this.ids, type)
.then(() => {
this.$message.success("操作成功");
this.onLoad(this.page);
})
.catch((err) => {
this.$message.error(err);
});
});
}
},
/**删除制度 */
rowDel(row, done, loading) {
let ids = [];
ids.push(row.id);
this.$confirm("是否确定删除该制度?", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
}).then(() => {
delRules(ids, 1)
.then(() => {
this.$message.success("删除成功");
this.onLoad(this.page);
done();
})
.catch((err) => {
this.$message.error(err);
loading();
});
});
},
handleAddRule(data, type) {
this.$refs.addOrEditRule.open(data, type);
},
getRuleTypeSelectItems(val) {
if (val == 0) {
ruleGetTypeList(val).then((res) => {
this.firstTyepSearchList = res.data.data;
});
} else {
ruleGetTypeList(val).then((res) => {
this.secondTyepSearchList = res.data.data;
});
}
},
selectFirstTypeChange(val) {
this.query.categoryOne = val;
this.getRuleTypeSelectItems(val);
},
selectSecondTypeChange(val) {
this.query.categoryTwo = val;
},
onLoad(page, params = {}) {
getRulesList(
page.currentPage,
page.pageSize,
Object.assign(this.query, params)
).then((res) => {
const data = res.data.data;
this.data = data.records;
this.page.total = data.total;
if (this.secondTyepSearchList.length == 0) {
this.getRuleTypeSelectItems(0);
}
});
},
},
};
</script>
<style scoped>
.insure-select .el-tag.el-tag--info {
background-color: #fdf6ec;
border-color: #faecd8;
color: #e6a23c;
}
.insure-select .el-tag.el-tag--info .el-tag__close {
color: #e6a23c;
}
.insure-select .el-tag__close.el-icon-close {
background-color: #fdf6ec;
}
.el-form-item {
margin-bottom: 18px;
padding: 0 10px;
}
.searchBtn {
display: inline-block;
margin-bottom: 18px;
}
.el-scrollbar__view .el-select-dropdown__list {
text-align: center !important;
}
</style>