FT/foton-laws-system-front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

commit

Browse Source
This commit is contained in:
zhutianqi
2021-07-28 17:25:36 +08:00
parent 1419e7fc11
commit 9e20156e5b
13 changed files with 345 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/assets/images/shangqi/img/mechanism.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.8 KiB

src/assets/images/shangqi/img/personnel.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 8.1 KiB

src/assets/images/shangqi/img/process1.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.6 KiB

src/assets/images/shangqi/img/process2.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 7.4 KiB

src/assets/images/shangqi/img/process3.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 8.7 KiB

src/assets/images/shangqi/img/process4.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.2 KiB

src/assets/images/shangqi/img/process5.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 7.0 KiB

src/assets/images/shangqi/img/process6.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.5 KiB

src/assets/styles/newStyle.less
+1
View File
@@ -909,3 +909,4 @@ tr.el-table__row{
.button-list { .button-list {
padding: 5px 0px; padding: 5px 0px;
} }
src/components/roleTree/index.vue
+97 -5
View File
@@ -5,7 +5,7 @@
:visible.sync="isVisible2" :visible.sync="isVisible2"
:wrapperClosable="false" :wrapperClosable="false"
@close="handleTreeDrawerCancel" @close="handleTreeDrawerCancel"
size="800px"> size="400px">
<el-form <el-form
ref="attributeEO" ref="attributeEO"
class="label-input-form" class="label-input-form"
@@ -22,7 +22,8 @@
v-if="open1 && isVisible2" v-if="open1 && isVisible2"
node-key="id" node-key="id"
style="height: 100%; overflow: auto;" style="height: 100%; overflow: auto;"
class="filter-tree" class="filter-tree tree-line"
:class="treeClass"
:data="treeData" :data="treeData"
:props="defaultProps" :props="defaultProps"
:default-checked-keys="nodeList" :default-checked-keys="nodeList"
@@ -34,12 +35,16 @@
ref="tree" ref="tree"
:load="loadNode" :load="loadNode"
lazy> lazy>
<span class="custom-tree-node" slot-scope="{ node, data }">
<span :class="node.disabled ? 'is-show' : 'is-leaf-none'"></span>
<span> {{ node.label }} </span>
</span>
</el-tree> </el-tree>
<el-tree <el-tree
v-if="!open1 && isVisible2" v-if="!open1 && isVisible2"
node-key="id" node-key="id"
style="height: 100%; overflow: auto;" style="height: 100%; overflow: auto;"
class="filter-tree" class="filter-tree tree-line"
:data="treeData1" :data="treeData1"
:props="defaultProps" :props="defaultProps"
:default-checked-keys="nodeList" :default-checked-keys="nodeList"
@@ -50,6 +55,10 @@
default-expand-all default-expand-all
show-checkbox show-checkbox
ref="tree"> ref="tree">
<span class="custom-tree-node" slot-scope="{ node, data }">
<span :class="node.disabled ? 'is-show' : 'is-leaf-none'"></span>
<span> {{ node.label }} </span>
</span>
</el-tree> </el-tree>
<div id="roleFormButton" class="demo-drawer-footer"> <div id="roleFormButton" class="demo-drawer-footer">
<el-button class="common-button-primary" size="mini" icon="el-icon-check" type="primary" @click="saveUserInfo">确定</el-button> <el-button class="common-button-primary" size="mini" icon="el-icon-check" type="primary" @click="saveUserInfo">确定</el-button>
@@ -89,7 +98,12 @@
filterText: '', filterText: '',
defaultProps: { defaultProps: {
children: 'children', children: 'children',
label: 'name' label: 'name',
isLeaf: (data, node) => {
if (!node.disabled) {
return true
}
}
}, },
treeData1: [], treeData1: [],
treeData: [], treeData: [],
@@ -99,6 +113,9 @@
} }
}, },
methods: { methods: {
treeClass () {
},
handleTreeDrawerCancel () { handleTreeDrawerCancel () {
this.filterText = '' this.filterText = ''
this.isVisible2 = false this.isVisible2 = false
@@ -171,5 +188,80 @@
} }
</script> </script>
<style scoped> <style lang="less" scoped>
/deep/.el-tree-node__content {
padding-left: 0px !important;
}
/deep/ .is-leaf{
background-image:none;
background-size:100% 100%;
}
/deep/ .is-leaf-none{
position: relative;
display: inline-block;
width: 15px;
height: 15px;
background:url('~@/assets/images/shangqi/img/personnel.png');
background-size:100% 100%;
}
/deep/ .is-show{
position: relative;
display: inline-block;
width: 15px;
height: 15px;
background:url('~@/assets/images/shangqi/img/mechanism.png');
background-size:100% 100%;
}
/deep/.tree-line{
.el-tree-node {
position: relative;
padding-left: 0px; // 缩进量
line-height: 30px;
}
.el-tree-node__children {
padding-left: 16px; // 缩进量
}
// 竖线
.el-tree-node::before {
content: "";
height: 100%;
width: 1px;
position: absolute;
left: -3px;
top: -26px;
border-width: 1px;
border-left: 1px dashed #858990e0;
}
// 当前层最后一个节点的竖线高度固定
.el-tree-node:last-child::before {
height: 38px; // 可以自己调节到合适数值
}
// 横线
.el-tree-node::after {
content: "";
width: 11px;
height: 20px;
position: absolute;
left: -3px;
top: 12px;
border-width: 1px;
border-top: 1px dashed #858990e0;
}
// 去掉最顶层的虚线，放最下面样式才不会被上面的覆盖了
& > .el-tree-node::after {
border-top: none;
}
& > .el-tree-node::before {
border-left: none;
}
// 展开关闭的icon
.el-tree-node__expand-icon{
font-size: 16px;
// 叶子节点（无子节点）
&.is-leaf{
color: transparent;
// display: none; // 也可以去掉
}
}
}
</style> </style>
src/pages/config/pages/roleManage/index.vue
+5 -5
View File
@@ -192,7 +192,7 @@
placeholder="请输入角色描述" placeholder="请输入角色描述"
clearable></el-input> clearable></el-input>
</el-form-item> </el-form-item>
<el-form-item label="角色状态" prop="useFlag" style="margin-left: 10px"> <el-form-item label="角色状态" prop="useFlag" label-width="80px" class="add-form-item">
<el-select class="bead-input" v-model="addForm.useFlag"> <el-select class="bead-input" v-model="addForm.useFlag">
<el-option <el-option
v-for="item in options" v-for="item in options"
@@ -261,6 +261,9 @@ export default {
name: [ name: [
{ required: true, message: '请输入角色名称', trigger: 'blur' }, { required: true, message: '请输入角色名称', trigger: 'blur' },
{type: 'string', max: 100, message: '角色名称不能超过100个字符', trigger: 'blur'} {type: 'string', max: 100, message: '角色名称不能超过100个字符', trigger: 'blur'}
],
useFlag: [
{ required: true, message: '请选择角色状态', trigger: 'change' },
] ]
}, },
addForm: { addForm: {
@@ -392,9 +395,9 @@ export default {
} }
}) })
} }
this.addModel = false
} }
}) })
this.addModel = false
}, },
SuperiorRole () { // 点击选择上级角色按钮 SuperiorRole () { // 点击选择上级角色按钮
this.SuperiorRoleModel = true this.SuperiorRoleModel = true
@@ -418,9 +421,6 @@ export default {
this.nodeList3 = [] this.nodeList3 = []
this.nodeList3.push(this.addForm.parentId) this.nodeList3.push(this.addForm.parentId)
} }
this.$watch('newForm', (newVal, oldVal) => {
console.log(newVal, oldVal);
})
this.addModel = true this.addModel = true
}, },
getTree3 () { getTree3 () {
src/pages/processCenter/pages/newProcess/index.vue
+241 -16
View File
@@ -4,34 +4,165 @@
<div v-if="bzfggllc"> <div v-if="bzfggllc">
<el-divider content-position="left"><h2>标准法规管理流程</h2></el-divider> <el-divider content-position="left"><h2>标准法规管理流程</h2></el-divider>
<div class="process-box"> <div class="process-box">
<div class="process-name" @click="handleCreateProcess('2')">标准调研流程</div> <el-col :span="size ? 6 : 8">
<div class="process-name" @click="handleCreateProcess('1')">标准入库流程</div> <el-card shadow="hover">
<div class="process-name" @click="handleCreateProcess('3')">标准征求意见流程</div> <div class="card-box" @click="handleCreateProcess('1')">
<!-- <div class="process-name" @click="handleCreateProcess('4')">标准需求(翻译)申请流程</div>--> <div class="card-top">
<!-- <div class="process-name" @click="handleCreateProcess('5')">标准发放申请流程</div>--> <div class="card-top-left">
<div class="process-name" @click="handleCreateProcess('6')">标准清单发布/更新流程</div> <img :src="getImg(Math.floor(Math.random() * 6))">
<div class="process-name" @click="handleCreateProcess('7')">项目合规评估流程-标准</div> </div>
<div class="process-name" @click="handleCreateProcess('10')">项目合规评估流程-项目</div> <div class="card-top-right">
<div class="process-name" @click="handleCreateProcess('8')">未符合项整改流程</div> <div class="card-top-right-text">标准入库流程</div>
<div class="process-name" @click="handleCreateProcess('9')">标准解读流程</div> <div class="card-top-right-line"></div>
</div>
</div>
<div class="card-bottom">
流程简介: 容器默认存在两根轴：水平的主轴（main axis）和垂直的交叉轴（cross axis）。主轴的开始位置（与边框的交叉点）叫做main start，结束位置叫做main end；交叉轴的开始位置叫做cross start，结束位置叫做cross end。
</div>
</div>
</el-card>
</el-col>
<el-col :span="size ? 6 : 8">
<el-card shadow="hover">
<div class="card-box" @click="handleCreateProcess('2')">
<div class="card-top">
<div class="card-top-left">
<img :src="getImg(Math.floor(Math.random() * 6))">
</div>
<div class="card-top-right">
<div class="card-top-right-text">标准调研流程</div>
<div class="card-top-right-line"></div>
</div>
</div>
<div class="card-bottom">
流程简介: 容器默认存在两根轴：水平的主轴（main axis）和垂直的交叉轴（cross axis）。主轴的开始位置（与边框的交叉点）叫做main start，结束位置叫做main end；交叉轴的开始位置叫做cross start，结束位置叫做cross end。
</div>
</div>
</el-card>
</el-col>
<el-col :span="size ? 6 : 8">
<el-card shadow="hover">
<div class="card-box" @click="handleCreateProcess('3')">
<div class="card-top">
<div class="card-top-left">
<img :src="getImg(Math.floor(Math.random() * 6))">
</div>
<div class="card-top-right">
<div class="card-top-right-text">标准征求意见流程</div>
<div class="card-top-right-line"></div>
</div>
</div>
<div class="card-bottom">
流程简介: 容器默认存在两根轴：水平的主轴（main axis）和垂直的交叉轴（cross axis）。主轴的开始位置（与边框的交叉点）叫做main start，结束位置叫做main end；交叉轴的开始位置叫做cross start，结束位置叫做cross end。
</div>
</div>
</el-card>
</el-col>
<el-col :span="size ? 6 : 8">
<el-card shadow="hover">
<div class="card-box" @click="handleCreateProcess('6')">
<div class="card-top">
<div class="card-top-left">
<img :src="getImg(Math.floor(Math.random() * 6))">
</div>
<div class="card-top-right">
<div class="card-top-right-text">标准清单发布/更新流程</div>
<div class="card-top-right-line"></div>
</div>
</div>
<div class="card-bottom">
流程简介: 容器默认存在两根轴：水平的主轴（main axis）和垂直的交叉轴（cross axis）。主轴的开始位置（与边框的交叉点）叫做main start，结束位置叫做main end；交叉轴的开始位置叫做cross start，结束位置叫做cross end。
</div>
</div>
</el-card>
</el-col>
<el-col :span="size ? 6 : 8">
<el-card shadow="hover">
<div class="card-box" @click="handleCreateProcess('7')">
<div class="card-top">
<div class="card-top-left">
<img :src="getImg(Math.floor(Math.random() * 6))">
</div>
<div class="card-top-right">
<div class="card-top-right-text">项目合规评估流程-标准</div>
<div class="card-top-right-line"></div>
</div>
</div>
<div class="card-bottom">
流程简介: 容器默认存在两根轴：水平的主轴（main axis）和垂直的交叉轴（cross axis）。主轴的开始位置（与边框的交叉点）叫做main start，结束位置叫做main end；交叉轴的开始位置叫做cross start，结束位置叫做cross end。
</div>
</div>
</el-card>
</el-col>
<el-col :span="size ? 6 : 8">
<el-card shadow="hover">
<div class="card-box" @click="handleCreateProcess('8')">
<div class="card-top">
<div class="card-top-left">
<img :src="getImg(Math.floor(Math.random() * 6))">
</div>
<div class="card-top-right">
<div class="card-top-right-text">未符合项整改流程</div>
<div class="card-top-right-line"></div>
</div>
</div>
<div class="card-bottom">
流程简介: 容器默认存在两根轴：水平的主轴（main axis）和垂直的交叉轴（cross axis）。主轴的开始位置（与边框的交叉点）叫做main start，结束位置叫做main end；交叉轴的开始位置叫做cross start，结束位置叫做cross end。
</div>
</div>
</el-card>
</el-col>
<el-col :span="size ? 6 : 8">
<el-card shadow="hover">
<div class="card-box" @click="handleCreateProcess('9')">
<div class="card-top">
<div class="card-top-left">
<img :src="getImg(Math.floor(Math.random() * 6))">
</div>
<div class="card-top-right">
<div class="card-top-right-text">标准解读流程</div>
<div class="card-top-right-line"></div>
</div>
</div>
<div class="card-bottom">
流程简介: 容器默认存在两根轴：水平的主轴（main axis）和垂直的交叉轴（cross axis）。主轴的开始位置（与边框的交叉点）叫做main start，结束位置叫做main end；交叉轴的开始位置叫做cross start，结束位置叫做cross end。
</div>
</div>
</el-card>
</el-col>
<el-col :span="size ? 6 : 8">
<el-card shadow="hover">
<div class="card-box" @click="handleCreateProcess('10')">
<div class="card-top">
<div class="card-top-left">
<img :src="getImg(Math.floor(Math.random() * 6))">
</div>
<div class="card-top-right">
<div class="card-top-right-text">项目合规评估流程-项目</div>
<div class="card-top-right-line"></div>
</div>
</div>
<div class="card-bottom">
流程简介: 容器默认存在两根轴：水平的主轴（main axis）和垂直的交叉轴（cross axis）。主轴的开始位置（与边框的交叉点）叫做main start，结束位置叫做main end；交叉轴的开始位置叫做cross start，结束位置叫做cross end。
</div>
</div>
</el-card>
</el-col>
</div> </div>
</div> </div>
<div v-if="zcgllc"> <div v-if="zcgllc">
<el-divider content-position="left"><h2>政策管理流程</h2></el-divider> <el-divider content-position="left"><h2>政策管理流程</h2></el-divider>
<div class="process-box"> <div class="process-box">
</div> </div>
</div> </div>
<div v-if="qbgllc"> <div v-if="qbgllc">
<el-divider content-position="left"><h2>企标管理流程</h2></el-divider> <el-divider content-position="left"><h2>企标管理流程</h2></el-divider>
<div class="process-box"> <div class="process-box">
</div> </div>
</div> </div>
<div v-if="bzcgfysqlc"> <div v-if="bzcgfysqlc">
<el-divider content-position="left"><h2>工作组会议管理流程</h2></el-divider> <el-divider content-position="left"><h2>工作组会议管理流程</h2></el-divider>
<div class="process-box"> <div class="process-box">
</div> </div>
</div> </div>
@@ -42,10 +173,28 @@ export default {
name: 'NewProcess', name: 'NewProcess',
data () { data () {
return { return {
type: '' type: '',
size: true
} }
}, },
methods: { methods: {
getImg (num) {
var url = ''
if (num == 0) {
url = require('@/assets/images/shangqi/img/process1.png')
} else if (num == 1) {
url = require('@/assets/images/shangqi/img/process2.png')
} else if (num == 2) {
url = require('@/assets/images/shangqi/img/process3.png')
} else if (num == 3) {
url = require('@/assets/images/shangqi/img/process4.png')
} else if (num == 4) {
url = require('@/assets/images/shangqi/img/process5.png')
} else if (num == 5) {
url = require('@/assets/images/shangqi/img/process6.png')
}
return url
},
// 新建流程 // 新建流程
handleCreateProcess (prcType) { handleCreateProcess (prcType) {
this.$store.commit('setDetailMap', this.$route.path) this.$store.commit('setDetailMap', this.$route.path)
@@ -176,6 +325,12 @@ export default {
} }
}, },
mounted () { mounted () {
let width = document.body.clientWidth
if (width > 1900) {
this.size = true
} else {
this.size = false
}
this.type = this.$route.params.type this.type = this.$route.params.type
} }
} }
@@ -186,17 +341,81 @@ export default {
//height: 100%; //height: 100%;
padding: 15px 15px 0; padding: 15px 15px 0;
background: #ffffff; background: #ffffff;
/deep/.el-card__body {
padding: 0;
}
.el-card {
margin: 25px;
border-radius: 10px;
}
.card-box {
.card-top {
width: 100%;
background: #2d8cf0;
height: 120px;
display: flex;
justify-content: space-between;
.card-top-left {
img {
margin: 10px;
width: 100px;
height: 100px;
}
}
.card-top-right {
width: 200px;
.card-top-right-text {
margin: 40px 0 5px 0;
color: #e6e6e6;
font-size: 18px;
}
.card-top-right-line {
height: 3px;
width: 200px;
background: #e6e6e6;
}
}
}
.card-bottom {
width: calc(~'100% - 60px');
color: #c1c1c1;
margin: 10px 30px;
line-height: 20px;
font-size: 14px;
height: 100px;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 5;
overflow: hidden;
}
}
.card-box:hover {
.card-top {
.card-top-right {
.card-top-right-text {
color: rgb(247, 186, 42);
}
.card-top-right-line {
background: rgb(247, 186, 42);
}
}
}
.card-bottom {
color: #2d8cf0;
}
}
.process-box{ .process-box{
margin-left: -5px; margin-left: -5px;
margin-right: -5px; margin-right: -5px;
padding-top: 20px; padding-top: 20px;
padding-bottom: 20px; padding-bottom: 20px;
.process-name{ .process-name{
width: 260px; width: 300px;
padding: 10px 0; padding: 40px 0;
margin-bottom: 10px; margin-bottom: 10px;
text-align: center; text-align: center;
border: 1px dashed #ddd; border: 1px dashed #ddd;
border-radius: 5px;
background: #fdfdfd; background: #fdfdfd;
font-size: 18px; font-size: 18px;
font-family: Helvetica, 'Hiragino Sans GB', 'Microsoft Yahei', Arial, sans-serif; font-family: Helvetica, 'Hiragino Sans GB', 'Microsoft Yahei', Arial, sans-serif;
@@ -205,6 +424,12 @@ export default {
margin-left: 5px; margin-left: 5px;
margin-right: 5px; margin-right: 5px;
} }
.process-name:hover {
transform:translateY(-5px);
border: 1px dashed #2d8cf0;
background: #c6e2ff;
color: #2d8cf0;
}
} }
} }
src/pages/regulatoryRepository/domesticStandardsAndRegulations/index.vue
+1
View File
@@ -4768,6 +4768,7 @@ export default {
.el-tree-node { .el-tree-node {
position: relative; position: relative;
padding-left: 0px; // 缩进量 padding-left: 0px; // 缩进量
line-height: 30px;
} }
.el-tree-node__children { .el-tree-node__children {
padding-left: 16px; // 缩进量 padding-left: 16px; // 缩进量