政策法规资料模块
This commit is contained in:
zyn
@@ -635,6 +635,34 @@ export default {
|
||||
})
|
||||
},
|
||||
|
||||
// formData
|
||||
_put (url, params = {}, config = {}) {
|
||||
var _formData = formData(params)
|
||||
// 参数包含this
|
||||
let _this = config._this || false
|
||||
// 参数包含loading
|
||||
let loading = config.loading || false
|
||||
// 是否显示操作提示
|
||||
let showTips = config.showTips === undefined ? true : config.showTips
|
||||
if (_this && loading) { _this[loading] = true }
|
||||
|
||||
return new Promise((resolve,reject) => {
|
||||
_axios.put(api() + url + '?' + new Date().getTime(), _formData).then(res => {
|
||||
if (res.data.ok !== undefined && showTips) {
|
||||
let type = res.data.ok ? 'success' : 'warning'
|
||||
if (_this && res.data.message !== '' && res.data.message !== null) {
|
||||
Message[type](res.data.message)
|
||||
}
|
||||
}
|
||||
resolve(res.data)
|
||||
}).catch(err => {
|
||||
reject(err)
|
||||
}).finally(()=>{
|
||||
if (_this && loading) { _this[loading] = false }
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
_downloadFile (url, params = {}, method = 'get', fileName = '导出文件') {
|
||||
_axios({
|
||||
method,
|
||||
|
||||
@@ -258,7 +258,12 @@
|
||||
title: '政策课题',
|
||||
path: '/policyTopics',
|
||||
menuId: '627f66cd6746234edd4722e20d8c01bb'
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '政策法规资料',
|
||||
path: '/regulatoryMaterials',
|
||||
menuId: '5b77e62147c5397178bc76f698e151c1'
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
|
||||
@@ -0,0 +1,485 @@
|
||||
<template>
|
||||
<div class="regulatoryMaterialsDetail">
|
||||
<div class="container">
|
||||
<div class="header">{{ form.name }}</div>
|
||||
<div class="content">
|
||||
<el-collapse v-model="activeNames">
|
||||
<el-collapse-item name="1">
|
||||
<template slot="title">
|
||||
<div class="modular-header">
|
||||
<div class="modular-header-title">
|
||||
<i class="icon-modular-title"/><span>基础信息</span>
|
||||
</div>
|
||||
<div class="modular-header-btn">
|
||||
<el-button v-if="form.collectId"
|
||||
@click.stop="collectClick(form.collectId)"
|
||||
title="取消收藏"
|
||||
class="collection-btn"
|
||||
icon="el-icon-star-on"
|
||||
:loading="isSubmit"
|
||||
></el-button>
|
||||
<el-button v-else
|
||||
@click.stop="collectClick()"
|
||||
title="收藏"
|
||||
class="collection-btn"
|
||||
icon="el-icon-star-off"
|
||||
:loading="isSubmit"
|
||||
></el-button>
|
||||
<el-button class="relation-btn"
|
||||
icon="icon-relation"
|
||||
@click.stop="relateEvent()"
|
||||
>更新记录</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<div class="modular-content">
|
||||
<p style="" class="half"><label style=" margin-right: 132px;">1级资料分类</label><span>{{ form.firstTypeName || '-' }}</span></p>
|
||||
<p style="" class="half"><label style=" margin-right: 132px;">2级资料分类</label><span>{{ form.secondTypeName || '-' }}</span></p>
|
||||
<p style="" class="half"><label style=" margin-right: 132px;">3级资料分类</label><span>{{ form.thirdTypeName || '-' }}</span></p>
|
||||
<p style="" class="half"><label style=" margin-right: 132px;">4级资料分类</label><span>{{ form.fourthTypeName || '-' }}</span></p>
|
||||
<p style=""><label style=" margin-right: 156px;">资料名称</label><span>{{ form.name || '-' }}</span></p>
|
||||
<p style=""><label style=" margin-right: 124px;">资料归属单位</label><span>{{ form.department || '-' }}</span></p>
|
||||
<p style=""><label style=" margin-right: 186px;">作者</label><span>{{ form.author || '-' }}</span></p>
|
||||
<p style=""><label style=" margin-right: 156px;">上传时间</label><span>{{ form.uploadTime || '-' }}</span></p>
|
||||
<p style=""><label style=" margin-right: 156px;">资料说明</label><span>{{ form.description || '-' }}</span></p>
|
||||
<div style="display: flex;border-bottom: 1px solid #E5E5E5">
|
||||
<label style=" margin-right: 156px;line-height: 44px">资料文件</label>
|
||||
<div style="min-height: 44px;padding: 8px 0;">
|
||||
<template v-for="file in form.information">
|
||||
<p class="file-item">
|
||||
<a class="file-title" target="_blank" :title="file.name" @click="openFileInPdf(file.id, file.name)">{{ file.name }}</a>
|
||||
<i v-if="hasDownLoadPermission()" title="下载" class="icon-download" @click="downloadFile(file.id)"></i>
|
||||
<i v-if="hasDownLoadPermission()" title="下载带水印" class="icon-download2" @click="downloadFileByWater(file.id, file.fileSuffix)"></i>
|
||||
</p>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
<p style=""><label style=" margin-right: 156px;">可查看者</label><span>{{ form.viewableBy || '-' }}</span></p>
|
||||
<p style=""><label style=" margin-right: 156px;">可下载者</label><span>{{ form.downloadableBy || '-' }}</span></p>
|
||||
</div>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 更新LOG -->
|
||||
<el-dialog
|
||||
title="更新记录"
|
||||
:visible.sync="relateDialog"
|
||||
width="60%"
|
||||
class="relateClass"
|
||||
:before-close="relateDialogClose">
|
||||
<div
|
||||
v-for="(item, index) in relateNowList"
|
||||
:key="index"
|
||||
v-if="relateNowList"
|
||||
style="margin-bottom: 10px;line-height: 20px"
|
||||
>
|
||||
{{index+1}}. {{item.creationUserName}} {{item.creationTime}} {{item.content}}
|
||||
<div v-if="relateNowList.length >1"><el-divider></el-divider></div>
|
||||
</div>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="relateDialogClose()">关 闭</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getBusStandFileByAttId } from 'api/process'
|
||||
|
||||
export default {
|
||||
name: "regulatoryMaterialsDetail",
|
||||
data () {
|
||||
return {
|
||||
url: {
|
||||
getLawsInformationInfo: 'lawss/sarLawsInformation/getLawsInformationInfo',
|
||||
getLogList: 'lawss/sarUpdLog/getLogList', // 更新记录
|
||||
personCollect: 'person/personCollect', // 收藏
|
||||
updateByUserId: 'person/personCollect/updateByUserId', // 取消收藏
|
||||
},
|
||||
form: {},
|
||||
activeNames: ['1'],
|
||||
isSubmit: false,
|
||||
|
||||
// 更新记录
|
||||
relateDialog: false,
|
||||
relateNowList: [],
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getData()
|
||||
},
|
||||
methods: {
|
||||
userToId (userStr) {
|
||||
return (userStr && userStr !== '') ? userStr.split(',').map(item => item.split('(')[1].split(')')[0]) : []
|
||||
},
|
||||
// 下载权限
|
||||
hasDownLoadPermission() {
|
||||
const userId = this.$store.getters.userInfo.userId
|
||||
// 未设置可下载者 创建人和审批人可下载
|
||||
if (!this.form.downloadableBy || this.form.downloadableBy === '') {
|
||||
if (this.userToId(this.form.createAndApproveBy).find(item => item === userId)) {
|
||||
return true
|
||||
}
|
||||
} else {
|
||||
// 设置可下载者 可下载者可下载
|
||||
if (this.userToId(this.form.downloadableBy).find(item => item === userId)) {
|
||||
return true
|
||||
}
|
||||
}
|
||||
return false
|
||||
},
|
||||
|
||||
getData () {
|
||||
const id = this.$route.params.id
|
||||
this.$http._getData(this.url.getLawsInformationInfo, { id }).then(res => {
|
||||
if (res.ok) {
|
||||
let ids = ''
|
||||
let names = ''
|
||||
let information = []
|
||||
if (res.data.informationFile && res.data.informationFile !== '') {
|
||||
ids = this.removeCommasAtStartAndEnd(res.data.informationFile).split(',')
|
||||
names = this.removeCommasAtStartAndEnd(res.data.informationFileName).split(',')
|
||||
information = ids.map((id, index) => ({
|
||||
id,
|
||||
name: names[index]
|
||||
}))
|
||||
}
|
||||
this.$set(this, 'form', res.data)
|
||||
this.$set(this.form, 'information', information)
|
||||
}
|
||||
})
|
||||
},
|
||||
removeCommasAtStartAndEnd(inputString) {
|
||||
// 检查字符串是否以逗号开头
|
||||
if (inputString.charAt(0) === ',') {
|
||||
inputString = inputString.slice(1); // 去除开头的逗号
|
||||
}
|
||||
|
||||
// 检查字符串是否以逗号结尾
|
||||
if (inputString.charAt(inputString.length - 1) === ',') {
|
||||
inputString = inputString.slice(0, -1); // 去除结尾的逗号
|
||||
}
|
||||
return inputString;
|
||||
},
|
||||
|
||||
/**
|
||||
* 点击 加收藏 按钮事件
|
||||
* @param collectId 有值：取消收藏 无值：加收藏
|
||||
*/
|
||||
collectClick (collectId) {
|
||||
if (collectId) {
|
||||
// 取消收藏
|
||||
this.$http._put(this.url.updateByUserId, {
|
||||
id: collectId
|
||||
},{
|
||||
_this: this,
|
||||
loading: 'isSubmit'
|
||||
}).then(res => {
|
||||
this.form.collectId = ''
|
||||
})
|
||||
} else {
|
||||
// 加收藏
|
||||
let personCollect = {
|
||||
userId: this.$store.getters.userInfo.userId,
|
||||
collectResId: this.form.id,
|
||||
collectTitle: this.form.name,
|
||||
collectType: 'LAWS_INFORMATION' // 国内收藏type
|
||||
}
|
||||
this.$http._postData(this.url.personCollect, personCollect, {
|
||||
_this: this,
|
||||
loading: 'isSubmit'
|
||||
}).then(res => {
|
||||
if (res.ok) {
|
||||
this.$message.success(res.message)
|
||||
this.form.collectId = res.data.id
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
// 更新LOG
|
||||
relateEvent () {
|
||||
const query = {
|
||||
sarId: this.$route.params.id,
|
||||
sarType: 'LAWS_INFORMATION'
|
||||
}
|
||||
this.$http._getData(this.url.getLogList, query).then(res => {
|
||||
if (res.ok && res.data.length > 0) {
|
||||
this.relateDialog = true
|
||||
const relateList = res.data
|
||||
var i
|
||||
for (i = 0; i < relateList.length; i++) {
|
||||
let obj = {creationUserName: '', creationTime: '', content: ''}
|
||||
obj.creationUserName = relateList[i].creationUserName
|
||||
obj.creationTime = relateList[i].creationTime
|
||||
obj.content = relateList[i].content
|
||||
this.relateNowList.push(obj)
|
||||
}
|
||||
} else {
|
||||
this.$message.warning('暂无数据')
|
||||
}
|
||||
})
|
||||
},
|
||||
relateDialogClose () {
|
||||
this.relateDialog = false
|
||||
this.relateNowList = []
|
||||
},
|
||||
downloadFile (attId) {
|
||||
if (attId != null && attId !== '') {
|
||||
window.location.href = '/api/att/attFile/downloadFileForSarNew?fileId=' + attId
|
||||
} else {
|
||||
this.$message.error('请选择要下载的文件')
|
||||
}
|
||||
},
|
||||
downloadFileByWater (attId, fileSuffix) {
|
||||
if (fileSuffix !== 'pdf' && fileSuffix !== 'PDF') {
|
||||
this.$message.error('水印下载仅支持PDF,pdf格式文件')
|
||||
} else {
|
||||
if (attId != null && attId !== '') {
|
||||
window.location.href = '/api/att/attFile/downloadFileForSarWaterMarkNew?fileId=' + attId + '&userId=' + this.$store.getters.userInfo.userId
|
||||
} else {
|
||||
this.$message.error('请选择要下载的文件')
|
||||
}
|
||||
}
|
||||
},
|
||||
getBusStandFileByAttId(attId) {
|
||||
return new Promise((resolve, reject) => {
|
||||
getBusStandFileByAttId({
|
||||
attId
|
||||
}).then(res => {
|
||||
if (res.ok) {
|
||||
resolve(res.data)
|
||||
} else {
|
||||
reject()
|
||||
}
|
||||
}).catch(e => {
|
||||
reject(e)
|
||||
})
|
||||
})
|
||||
},
|
||||
openFileInPdf (attId, fileName) {
|
||||
// 判断是否是图片格式，图片格式不预览，直接下载
|
||||
let index1 = fileName.lastIndexOf('.')
|
||||
let index2 = fileName.length
|
||||
let fileSuffix = fileName.substring(index1, index2)
|
||||
//把后缀转大写
|
||||
if(fileSuffix !== undefined && fileSuffix !== null){
|
||||
fileSuffix = fileSuffix.toUpperCase()
|
||||
}
|
||||
// 判断上传文件格式
|
||||
if (fileSuffix === '.PNG'|| fileSuffix === '.JPG'|| fileSuffix === '.JPEG') {
|
||||
this.downloadFile(attId)
|
||||
return true
|
||||
}
|
||||
// 缺少文件
|
||||
if (this.$hasPermission('fd83032ae5f41a0021b00e93c88edbbg')) {
|
||||
if (fileSuffix === '.PDG' || fileSuffix === '.pdg') {
|
||||
this.getBusStandFileByAttId(attId)
|
||||
.then(res => {
|
||||
if(res){
|
||||
const editFileInfo = res
|
||||
if(editFileInfo.fileSuffix === 'pdg' || editFileInfo.fileSuffix === 'PDG'){
|
||||
window.open('book://ssreader/e0?url='+editFileInfo.downLoadUrl)
|
||||
}
|
||||
}
|
||||
}).catch(e => {
|
||||
this.$message.warning('文件不存在,预览失败')
|
||||
})
|
||||
}else {
|
||||
this.$http.get('lawss/sarLawsFile/queryConvertAtt', {
|
||||
attId: attId
|
||||
}, {
|
||||
_this: this
|
||||
}, res => {
|
||||
if (res.data) {
|
||||
let fileObj = {}
|
||||
fileObj.fileId = res.data.attId
|
||||
fileObj.fileName = fileName
|
||||
let fileList = []
|
||||
let repeatData = 0
|
||||
if (sessionStorage.getItem('fileInfo')) {
|
||||
fileList = JSON.parse(sessionStorage.getItem('fileInfo'))
|
||||
if (fileList != null && fileList.length > 0) {
|
||||
for (let i = 0; i < fileList.length; i++) {
|
||||
if (fileList[i].fileId === res.data.attId) {
|
||||
repeatData = 1
|
||||
break
|
||||
}
|
||||
}
|
||||
if (repeatData === 0) {
|
||||
fileList.push(fileObj)
|
||||
fileList = JSON.stringify(fileList)
|
||||
sessionStorage.setItem('fileInfo', fileList)
|
||||
}
|
||||
}
|
||||
} else {
|
||||
fileList.push(fileObj)
|
||||
fileList = JSON.stringify(fileList)
|
||||
sessionStorage.setItem('fileInfo', fileList)
|
||||
}
|
||||
window.open('/static/pdf/web/viewer.html?file=' + encodeURIComponent('/api/att/attFile/getFileInfo?fileId=' + res.data.attId))
|
||||
} else {
|
||||
this.$message.error('文档未转换成功或本地读取不到该文档')
|
||||
}
|
||||
}, e => {
|
||||
this.$message.error('文档未转换成功或本地读取不到该文档')
|
||||
})
|
||||
}
|
||||
} else {
|
||||
this.$message.error('没有在线预览文档权限！')
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.regulatoryMaterialsDetail {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: #fff;
|
||||
overflow: auto;
|
||||
.container {
|
||||
padding: 15px 30px 0;
|
||||
width: 1200px;
|
||||
margin: 0 auto;
|
||||
height: 100%;
|
||||
.header {
|
||||
padding: 34px 0;
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
color: #555555;
|
||||
text-align: center;
|
||||
}
|
||||
.content {
|
||||
border-top: 2px dashed rgb(209, 209, 209);
|
||||
.modular-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
border-bottom: 1px solid #E5E5E5;
|
||||
.modular-header-title {
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
color: #3B424C;
|
||||
> .icon-modular-title {
|
||||
display: inline-block;
|
||||
margin-left: -28px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
background-size: 100% 100%;
|
||||
background-position: center center;
|
||||
background-image: url("~assets/images/shangqi/standardDetails/modular-title.png");
|
||||
position: relative;
|
||||
top: 2px;
|
||||
}
|
||||
> span {
|
||||
padding-left: 10px;
|
||||
}
|
||||
}
|
||||
/deep/ .modular-header-btn{
|
||||
> button {
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
font-size: 14px;
|
||||
padding: 0 10px;
|
||||
font-family: 'Microsoft Yahei', '\5FAE\8F6F\96C5\9ED1', Arial, sans-serif !important;
|
||||
> i{
|
||||
display: inline-block;
|
||||
margin-right: 3px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
background-position: center center;
|
||||
vertical-align: text-bottom;
|
||||
}
|
||||
}
|
||||
.collection-btn{
|
||||
padding: 0;
|
||||
border: none;
|
||||
> i {
|
||||
color: #F2CB51;
|
||||
font-size: 18px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
}
|
||||
> .el-icon-star-on {
|
||||
font-size: 22px;
|
||||
}
|
||||
&:hover{
|
||||
background: transparent;
|
||||
}
|
||||
}
|
||||
.relation-btn {
|
||||
color: #409EFF;
|
||||
border: 1px solid #409EFF;
|
||||
background: rgba(64, 158, 255, 0.1);
|
||||
.icon-relation{
|
||||
background-image: url("~assets/images/shangqi/standardDetails/relation.png");
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.modular-content {
|
||||
color: #333;
|
||||
font-size: 16px;
|
||||
> p {
|
||||
min-height: 43px;
|
||||
line-height: 43px;
|
||||
border-bottom: 1px solid #E5E5E5;
|
||||
}
|
||||
.half {
|
||||
width: 50%;
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
/deep/ .el-collapse-item__wrap {
|
||||
border: none;
|
||||
}
|
||||
.file-item{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.file-title {
|
||||
display: inline-block;
|
||||
font-size: 16px;
|
||||
color: #409EFF;
|
||||
cursor: pointer;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
max-width: 780px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/deep/ .icon-download {
|
||||
display: inline-block;
|
||||
margin-left: 3px;
|
||||
width: 18px;
|
||||
height: 16px;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
background-position: center center;
|
||||
vertical-align: sub;
|
||||
cursor: pointer;
|
||||
background-image: url("~assets/images/shangqi/img/download.png");
|
||||
}
|
||||
|
||||
/deep/ .icon-download2 {
|
||||
display: inline-block;
|
||||
margin-left: 3px;
|
||||
width: 18px;
|
||||
height: 16px;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
background-position: center center;
|
||||
vertical-align: sub;
|
||||
cursor: pointer;
|
||||
background-image: url("~assets/images/shangqi/img/download2.png");
|
||||
}
|
||||
</style>
|
||||
+383
@@ -0,0 +1,383 @@
|
||||
<template>
|
||||
<div class="main">
|
||||
<!-- 搜索区 -->
|
||||
<div class="search-area">
|
||||
<el-form :modal="searchForm" :inline="true" class="label-input-form">
|
||||
<el-formItem label="1级资料分类" prop="firstType" class="search-item">
|
||||
<el-select v-model="searchForm.firstType"
|
||||
placeholder="请选择1级资料分类"
|
||||
clearable>
|
||||
<el-option
|
||||
v-for="opt in dict.firstMaterialType"
|
||||
:key="opt.value"
|
||||
:value="!opt.value ? '' : opt.value" :label="opt.label"
|
||||
>
|
||||
{{ opt.label }}
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-formItem>
|
||||
<el-formItem label="2级资料分类" prop="secondType" class="search-item">
|
||||
<el-select v-model="searchForm.secondType"
|
||||
placeholder="请选择2级资料分类"
|
||||
clearable>
|
||||
<el-option
|
||||
v-for="opt in dict.secondMaterialType"
|
||||
:key="opt.value"
|
||||
:value="!opt.value ? '' : opt.value" :label="opt.label"
|
||||
>
|
||||
{{ opt.label }}
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-formItem>
|
||||
<el-formItem label="资料标题" prop="name" class="search-item">
|
||||
<el-input v-model="searchForm.name" clearable placeholder="请输入资料标题" :maxlength="100" @keyup.enter.native="onSearch"/>
|
||||
</el-formItem>
|
||||
<el-formItem label="上传时间" prop="uploadTime" class="search-item">
|
||||
<el-date-picker
|
||||
value-format="yyyy-MM-dd"
|
||||
format="yyyy-MM-dd"
|
||||
type="date"
|
||||
clearable
|
||||
:editable="true"
|
||||
placeholder="请选择上传时间"
|
||||
v-model="searchForm.uploadTime"
|
||||
>
|
||||
</el-date-picker>
|
||||
</el-formItem>
|
||||
<el-form-item class="search-item btn-box">
|
||||
<el-button
|
||||
type="primary"
|
||||
size="mini"
|
||||
class="common-button-primary"
|
||||
v-btn-permission="'17af98fabcda36aae6a8c3915f48b31a'"
|
||||
@click="onSearch">
|
||||
查询
|
||||
</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
class="common-button-default"
|
||||
v-btn-permission="'aa73f0af9e46aed8bb9fba7340a6b739'"
|
||||
@click="onClear">清空
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<!--按钮区-->
|
||||
<div class="action-bar">
|
||||
<el-button class="common-button-default export-button"
|
||||
size="mini"
|
||||
title="不勾选时默认导出所有筛选项；勾选时仅导出勾选项"
|
||||
v-btn-permission="'cca3e020321a3443f38435fd86bb62f0'"
|
||||
@click="exportData"><i class="iconfont"></i>导出
|
||||
</el-button>
|
||||
<el-button class="common-button-default in-button"
|
||||
size="mini"
|
||||
v-btn-permission="'11f125d942b845db01d077a8021bac10'"
|
||||
@click="addImportModal"><i class="iconfont"></i>导入
|
||||
</el-button>
|
||||
<el-button class="common-button-default in-button"
|
||||
size="mini"
|
||||
v-btn-permission="'be26878aa645671c5b16b38c2d44b4eb'"
|
||||
@click="handleMoudel"><i class="iconfont"></i>模板下载
|
||||
</el-button>
|
||||
<el-button
|
||||
type="primary"
|
||||
size="mini"
|
||||
class="common-button-primary add-button"
|
||||
v-btn-permission="'3c0bc511645234732bc7e4ea6b7103c6'"
|
||||
@click="openDrawer('add')">
|
||||
<i class="el-icon-plus"></i>新增
|
||||
</el-button>
|
||||
</div>
|
||||
<!-- 表格 -->
|
||||
<div class="content">
|
||||
<el-table
|
||||
ref="tableRef"
|
||||
:data="data"
|
||||
tooltip-effect="dark"
|
||||
style="width:100%;"
|
||||
border
|
||||
class="drag-table"
|
||||
@sort-change="sortChange"
|
||||
:header-cell-style="{background: '#e8e8e8', color: '#333333', fontSize: '16px', fontWeight: 'bold', height: '48px', padding: 0}"
|
||||
@selection-change="selectionChange"
|
||||
>
|
||||
<el-table-column
|
||||
type="selection"
|
||||
width="55"
|
||||
align="center">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="firstTypeName"
|
||||
label="1级资料类别"
|
||||
align="center"
|
||||
sortable="custom"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="secondTypeName"
|
||||
label="2级资料类别"
|
||||
align="center"
|
||||
sortable="custom"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="name"
|
||||
label="资料名称"
|
||||
align="center"
|
||||
sortable="custom"
|
||||
>
|
||||
<template slot-scope="{row, column, $index}">
|
||||
<a v-if="hasViewPermission(row)" class="table-jump" style="color: #2d8cf0" @click="handlePreview(row.id)">{{ row.name }}</a>
|
||||
<span v-else>{{ row.name }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="uploadTime"
|
||||
label="上传时间"
|
||||
align="center"
|
||||
sortable="custom"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="action"
|
||||
label="操作"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<a class="table-jump" v-btn-permission="'5ba6c5466021b86fc9d00b25fd46d5c6'" style="color: #2d8cf0" @click="openDrawer('edit', scope.row)">编辑</a>
|
||||
<a class="table-jump" v-btn-permission="'ead39a6339efe11b1077982ff12fd3cd'" style="color: #f56c6c;margin-left: 10px" @click="onDelete(scope.row.id)">删除</a>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination :page="searchForm.page" :total="total" @pageChange="pageChange" @pageSizeChange="pageSizeChange"></pagination>
|
||||
<loading :loading="loading">数据获取中...</loading>
|
||||
</div>
|
||||
<!-- 新增编辑 -->
|
||||
<editDrawer ref="editDrawerRef" :dict="dict" @load="getData"></editDrawer>
|
||||
<!-- 导入 -->
|
||||
<ImportZip :visible.sync="importModalShowFlag" :action="importExcelUrl"></ImportZip>
|
||||
<!-- 导出 -->
|
||||
<ExportDialog ref="exportDialogRef" @exportName="handleExport"></ExportDialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import editDrawer from "./editDrawer";
|
||||
import ImportZip from '@/components/hzwlComponents/importZip'
|
||||
import ExportDialog from '@/components/hzwlComponents/exportDialog'
|
||||
|
||||
export default {
|
||||
name: "RegulatoryMaterialsMain",
|
||||
components: {
|
||||
editDrawer,
|
||||
ImportZip,
|
||||
ExportDialog
|
||||
},
|
||||
props: {
|
||||
treeNodeId: {
|
||||
type: String
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
url: {
|
||||
page: 'lawss/sarLawsInformation/page',
|
||||
delete: 'lawss/sarLawsInformation/deleteLawsInformation',
|
||||
},
|
||||
searchForm: {},
|
||||
dict: {},
|
||||
// 列表
|
||||
data: [],
|
||||
total: 0,
|
||||
loading: false,
|
||||
selectedList: [],
|
||||
// 新增编辑
|
||||
showDrawer: false,
|
||||
// 导入
|
||||
importModalShowFlag: false,
|
||||
importExcelUrl: '',
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getDicTypeListCode()
|
||||
this.getData()
|
||||
},
|
||||
watch: {
|
||||
treeNodeId: {
|
||||
handler: function (val, oldVal) {
|
||||
this.getData()
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
userToId (userStr) {
|
||||
return (userStr && userStr !== '') ? userStr.split(',').map(item => item.split('(')[1].split(')')[0]) : []
|
||||
},
|
||||
hasViewPermission(row) {
|
||||
const userId = this.$store.getters.userInfo.userId
|
||||
// 未设置可查看者 所有用户 可查看
|
||||
if (!row.viewableBy || row.viewableBy === '') {
|
||||
return true
|
||||
} else {
|
||||
// 设置了查看者 可查看者可查看
|
||||
if (this.userToId(row.viewableBy).find(item => item === userId)) {
|
||||
return true
|
||||
}
|
||||
// 可下载者需要查看权限
|
||||
// 未设置可下载者 创建人和审批人可查看
|
||||
if (!row.downloadableBy || row.downloadableBy === '') {
|
||||
if (this.userToId(row.createAndApproveBy).find(item => item === userId)) {
|
||||
return true
|
||||
}
|
||||
} else {
|
||||
// 设置可下载者 可下载者可查看
|
||||
if (this.userToId(row.downloadableBy).find(item => item === userId)) {
|
||||
return true
|
||||
}
|
||||
}
|
||||
}
|
||||
return false
|
||||
},
|
||||
|
||||
getDicTypeListCode () {
|
||||
this.$http._getData('sys/dictype/getDicTypeListCode').then(res => {
|
||||
this.dict = { ...res.data }
|
||||
})
|
||||
},
|
||||
async getData () {
|
||||
this.searchForm.pageSize = this.searchForm.pageSize || this.$store.getters.userInfo.configContent
|
||||
this.searchForm.page = this.searchForm.page || 1
|
||||
this.searchForm.treeNodeId = this.treeNodeId
|
||||
let params = { ...this.searchForm}
|
||||
const res = await this.$http._getData(this.url.page, params, {_this:this,loading: 'loading'})
|
||||
if (res.ok && res.data) {
|
||||
this.data = res.data.list
|
||||
this.total = res.data.count
|
||||
}
|
||||
},
|
||||
onSearch(){
|
||||
this.getData()
|
||||
},
|
||||
onClear () {
|
||||
this.$set(this, 'searchForm', {})
|
||||
this.getData()
|
||||
},
|
||||
|
||||
// 选择项勾选改变
|
||||
selectionChange (data) {
|
||||
this.selectedList = []
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
this.selectedList.push(data[i].id)
|
||||
}
|
||||
},
|
||||
// 表格排序
|
||||
sortChange({ column, prop, order }) {
|
||||
this.searchForm.sortField = prop
|
||||
this.searchForm.sortMode = 'asc'
|
||||
if (order === 'descending') {
|
||||
this.searchForm.sortMode = 'desc'
|
||||
}
|
||||
if (!order) {
|
||||
this.searchForm.sortField = ''
|
||||
this.searchForm.sortMode = ''
|
||||
}
|
||||
this.getData()
|
||||
},
|
||||
// 分页点击后方法
|
||||
pageChange (page) {
|
||||
this.searchForm.page = page
|
||||
this.getData()
|
||||
},
|
||||
// 分页每页显示数改变后方法
|
||||
pageSizeChange (pageSize) {
|
||||
this.searchForm.pageSize = pageSize
|
||||
this.getData()
|
||||
},
|
||||
// 点击查看
|
||||
handlePreview(id) {
|
||||
let routeUrl = this.$router.resolve({
|
||||
name: 'regulatoryMaterialsDetail',
|
||||
params: { id }
|
||||
})
|
||||
window.open(routeUrl.href, '_blank')
|
||||
},
|
||||
|
||||
// 导出
|
||||
exportData () {
|
||||
this.$refs.exportDialogRef.openModel()
|
||||
},
|
||||
handleExport (exportName) {
|
||||
alert('导出' + exportName)
|
||||
const params = {
|
||||
...this.form,
|
||||
exportName: exportName,
|
||||
userId: this.$store.getters.userInfo.userId,
|
||||
exportIds: this.ids.join(',')
|
||||
}
|
||||
let query = '?'
|
||||
for(let i in params){
|
||||
if (params[i] && params[i]!=='') {
|
||||
query = query + i + '=' + params[i] + '&'
|
||||
}
|
||||
}
|
||||
query = query.slice(0,-1)
|
||||
window.open('/api/esRevisePlan/es-revise-plan/exportEsRevisePlanInfoExcel' + query)
|
||||
this.$refs.exportDialogRef.cancel()
|
||||
this.$message.success('导出信息成功')
|
||||
},
|
||||
// 导入
|
||||
addImportModal() {
|
||||
alert('导入')
|
||||
this.importModalShowFlag = true
|
||||
this.importExcelUrl = '/api/lawss/sarBussionessStand/importSarBussionessStandFile?'+ 'userId=' + this.$store.getters.userInfo.userId
|
||||
},
|
||||
// 模板下载
|
||||
handleMoudel(){
|
||||
alert('模板下载')
|
||||
window.open('/api/lawss/sarBussionessStand/exportTemplateFile?fileName=企业标准导入模板')
|
||||
},
|
||||
// 新增编辑
|
||||
openDrawer (type, row) {
|
||||
this.showDrawer = false
|
||||
switch (type) {
|
||||
case 'add':
|
||||
this.$refs.editDrawerRef.add(this.treeNodeId)
|
||||
break
|
||||
case 'edit':
|
||||
this.$refs.editDrawerRef.edit(row.id)
|
||||
break
|
||||
}
|
||||
},
|
||||
onDelete (id) {
|
||||
this.$confirm('确认删除这些数据?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
confirmButtonClass: 'common-button-primary',
|
||||
roundButton: true
|
||||
}).then(() => {
|
||||
this.$http._deleteData(this.url.delete, { id }).then(res => {
|
||||
if (res.ok) {
|
||||
this.$message.success('删除成功')
|
||||
this.getData()
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.main{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
.content{
|
||||
flex: 1;
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
+343
@@ -0,0 +1,343 @@
|
||||
<template>
|
||||
<div style="width: 100%" class="wrapper">
|
||||
<el-input
|
||||
placeholder="输入树状图体系"
|
||||
v-model="filterText">
|
||||
</el-input>
|
||||
<div class="tree">
|
||||
<el-card style="height: 100%;padding-right: 120px;overflow-y:auto">
|
||||
<el-tree
|
||||
ref="tree"
|
||||
node-key="id"
|
||||
class="tree-line"
|
||||
icon-class="icon-tree"
|
||||
:indent="0"
|
||||
:props="props"
|
||||
:data="treeList"
|
||||
:default-expanded-keys="['1716336011358269441']"
|
||||
highlight-current
|
||||
@node-click="treeClick"
|
||||
:filter-node-method="filterNode">
|
||||
<span class="custom-tree-node" slot-scope="{ node, data }" @mouseenter="mouseenter(data)" @mouseleave="mouseleave(data)">
|
||||
<span :class="data.children.length !== 0 ? 'is-show' : 'is-leaf-none'"></span>
|
||||
<span style="font-size:12px"> {{ node.label }} </span>
|
||||
<span>
|
||||
<el-button
|
||||
type="text"
|
||||
size="mini"
|
||||
v-show="data.show"
|
||||
v-btn-permission="'a7fee733685bf16abb9dffb4e423d632'"
|
||||
@click="() => append(data)">
|
||||
新增
|
||||
</el-button>
|
||||
<el-button
|
||||
type="text"
|
||||
size="mini"
|
||||
v-show="data.show"
|
||||
v-btn-permission="'1e96ef8234a8f7a50cafab999e2e7bdf'"
|
||||
@click="() => update(data)">
|
||||
编辑
|
||||
</el-button>
|
||||
<el-button
|
||||
type="text"
|
||||
size="mini"
|
||||
v-show="data.showDel"
|
||||
v-btn-permission="'b6fa8bd927d679c28109d1c72f0d1d72'"
|
||||
@click="() => remove(node, data)">
|
||||
删除
|
||||
</el-button>
|
||||
</span>
|
||||
</span>
|
||||
</el-tree>
|
||||
</el-card>
|
||||
</div>
|
||||
<el-drawer
|
||||
:wrapperClosable="false"
|
||||
:title="DrawerTitle"
|
||||
:visible.sync="DrawerVisible"
|
||||
size="800px"
|
||||
:before-close="handleCancel"
|
||||
label-width="130px"
|
||||
>
|
||||
<div class="demo-drawer-content">
|
||||
<el-form :model="DrawerModel"
|
||||
ref="DrawerModelRef"
|
||||
:rules="DrawerRules"
|
||||
class="label-input-form"
|
||||
label-width="130px">
|
||||
<el-row>
|
||||
<el-col>
|
||||
<el-form-item label="目录名称" prop="name" class="add-form-item">
|
||||
<el-input v-model.trim="DrawerModel.name" placeholder="请输入目录名称" clearable></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col>
|
||||
<el-form-item label="目录顺序" prop="sort" class="add-form-item">
|
||||
<el-input v-model.number="DrawerModel.sort"
|
||||
number
|
||||
placeholder="请输入目录顺序"
|
||||
:maxlength="4"
|
||||
clearable></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</div>
|
||||
<div class="demo-drawer-footer">
|
||||
<el-button
|
||||
class="common-button-primary"
|
||||
icon="el-icon-check"
|
||||
type="primary"
|
||||
@click="handleSubmit">提交
|
||||
</el-button>
|
||||
<el-button
|
||||
class="common-button-default"
|
||||
icon="el-icon-close"
|
||||
@click="handleCancel">取消
|
||||
</el-button>
|
||||
</div>
|
||||
</el-drawer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "RegulatoryMaterialsTree",
|
||||
data(){
|
||||
return {
|
||||
treeList: [],
|
||||
filterText: '',
|
||||
props: {
|
||||
label: 'name',
|
||||
children: 'children'
|
||||
},
|
||||
|
||||
// drawer
|
||||
DrawerTitle: '',
|
||||
DrawerVisible: false,
|
||||
DrawerModel: {
|
||||
name: '',
|
||||
parentId: '',
|
||||
sort: ''
|
||||
},
|
||||
DrawerRules: {
|
||||
name: [
|
||||
{required: true, message: '目录名称不能为空', trigger: 'change'}
|
||||
],
|
||||
sort: [
|
||||
{required: true, message: '目录顺序不能为空', trigger: 'change'}
|
||||
]
|
||||
},
|
||||
|
||||
url: {
|
||||
getTree: 'lawss/sarLawsInformation/tree/getTree',
|
||||
addTreeNode: 'lawss/sarLawsInformation/tree/addTreeNode',
|
||||
updateTreeNode: 'lawss/sarLawsInformation/tree/updateTreeNode',
|
||||
deleteTreeNode: 'lawss/sarLawsInformation/tree/deleteTreeNode',
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getMenuList()
|
||||
},
|
||||
watch: {
|
||||
filterText(val) {
|
||||
this.$refs.tree.filter(val);
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
getMenuList () {
|
||||
this.$http._getData(this.url.getTree).then(res => {
|
||||
if (res.ok) {
|
||||
this.treeList = res.data
|
||||
this.$emit('treeClick', res.data[0])
|
||||
}
|
||||
})
|
||||
},
|
||||
filterNode(value, data) {
|
||||
if (!value) return true;
|
||||
return data.menuName.indexOf(value) !== -1;
|
||||
},
|
||||
treeClick (treeNode) {
|
||||
this.$emit('treeClick', treeNode)
|
||||
},
|
||||
append(data) {
|
||||
this.DrawerTitle = '新增目录'
|
||||
this.DrawerModel.name = ''
|
||||
this.DrawerModel.parentId = data.id
|
||||
this.DrawerVisible = true
|
||||
},
|
||||
update(data) {
|
||||
this.DrawerModel = data
|
||||
this.DrawerTitle = '编辑目录'
|
||||
this.DrawerVisible = true
|
||||
},
|
||||
remove(node, data) {
|
||||
this.$confirm(data.children.length > 0 ? '该节点下有记录，是否删除？' : '是否删除菜单', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
confirmButtonClass: 'common-button-primary',
|
||||
cancelButtonText: '取消',
|
||||
roundButton: true,
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
this.$http._deleteData(this.url.deleteTreeNode, { id: data.id }).then(res => {
|
||||
if (res.ok) {
|
||||
this.$message.success('删除成功')
|
||||
this.getMenuList()
|
||||
} else {
|
||||
this.$message.warning(res.message)
|
||||
}
|
||||
})
|
||||
}).catch(() => {
|
||||
this.$message.info('已取消删除')
|
||||
})
|
||||
},
|
||||
// 树节点鼠标移入移出
|
||||
mouseenter(data){
|
||||
this.$set(data, 'show', true)
|
||||
if(data.parentId !== null){
|
||||
this.$set(data, 'showDel', true)
|
||||
}
|
||||
},
|
||||
mouseleave(data){
|
||||
this.$set(data, 'show', false)
|
||||
this.$set(data, 'showDel', false)
|
||||
},
|
||||
|
||||
handleCancel () {
|
||||
this.$refs.DrawerModelRef.resetFields()
|
||||
this.DrawerModel = {
|
||||
name: '',
|
||||
parentId: '',
|
||||
sort: ''
|
||||
}
|
||||
this.DrawerVisible = false
|
||||
},
|
||||
handleSubmit () {
|
||||
this.$refs.DrawerModelRef.validate(valid => {
|
||||
if (valid) {
|
||||
let method = this.DrawerTitle === '新增目录' ? '_postData' : '_putData'
|
||||
let url = this.DrawerTitle === '新增目录' ? this.url.addTreeNode : this.url.updateTreeNode
|
||||
this.$http[method](url, this.DrawerModel).then(res => {
|
||||
if (res.ok) {
|
||||
this.$message.success('操作成功')
|
||||
this.getMenuList()
|
||||
this.handleCancel()
|
||||
} else {
|
||||
this.$message.warning(res.message)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="less">
|
||||
/deep/ .icon-tree {
|
||||
margin:0 5px 0 10px;
|
||||
position:relative;
|
||||
background:url('~@/assets/images/shangqi/img/tree-add.png');
|
||||
background-size:100% 100%;
|
||||
}
|
||||
/deep/ .expanded{
|
||||
background:url('~@/assets/images/shangqi/img/tree-sub.png');
|
||||
background-size:100% 100%;
|
||||
}
|
||||
/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/none-file-new.png');
|
||||
background-size:100% 100%;
|
||||
}
|
||||
/deep/ .is-show{
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
background:url('~@/assets/images/shangqi/img/tree.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 scoped lang="less">
|
||||
.tree{
|
||||
/deep/ .el-card__body {
|
||||
padding: 0 !important;
|
||||
}
|
||||
.el-card {
|
||||
width: 500px;
|
||||
min-width: 2000px;
|
||||
max-width: 100%;
|
||||
/* min-width: min-content;*/
|
||||
}
|
||||
height: 95%;
|
||||
width: 95%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
|
||||
}
|
||||
|
||||
</style>
|
||||
@@ -0,0 +1,351 @@
|
||||
<template>
|
||||
<el-drawer :title="title"
|
||||
:visible="showDrawer"
|
||||
:wrapperClosable="false"
|
||||
@close="onClose"
|
||||
size="1050px">
|
||||
<div class="drawer-content">
|
||||
<el-form
|
||||
v-if="showDrawer && reloadForm"
|
||||
ref="formRef"
|
||||
:model="form"
|
||||
:rules="rules"
|
||||
class="label-input-form"
|
||||
>
|
||||
<el-col :span="24"><div class="divider-line">基础信息</div></el-col>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item prop="firstType" label-width="150px" class="add-form-item">
|
||||
<template slot="label">1级资料分类</template>
|
||||
<el-select :value="stringToArr(form.firstType)"
|
||||
@change="handleChange($event,'firstType')"
|
||||
multiple
|
||||
placeholder="请选择1级资料分类"
|
||||
clearable>
|
||||
<el-option
|
||||
v-for="opt in dict.firstMaterialType"
|
||||
:key="opt.value"
|
||||
:value="opt.value" :label="opt.label"
|
||||
>
|
||||
{{ opt.label }}
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item prop="thirdType" label-width="150px" class="add-form-item">
|
||||
<template slot="label">3级资料分类</template>
|
||||
<el-select :value="stringToArr(form.thirdType)"
|
||||
@change="handleChange($event,'thirdType')"
|
||||
multiple
|
||||
placeholder="请选择3级资料分类"
|
||||
clearable>
|
||||
<el-option
|
||||
v-for="opt in dict.thirdMaterialType"
|
||||
:key="opt.value"
|
||||
:value="opt.value" :label="opt.label"
|
||||
>
|
||||
{{ opt.label }}
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="资料名称" prop="name" label-width="150px" class="add-form-item">
|
||||
<el-input v-model="form.name"
|
||||
placeholder="请输入资料名称"
|
||||
clearable></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="作者" prop="author" label-width="150px" class="add-form-item">
|
||||
<el-input v-model="form.author"
|
||||
placeholder="请输入作者"
|
||||
clearable></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="资料说明" prop="description" label-width="150px" class="add-form-item">
|
||||
<el-input v-model="form.description"
|
||||
placeholder="请输入资料说明"
|
||||
clearable></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="可查看者" prop="viewableBy" label-width="150px" class="add-form-item">
|
||||
<el-input
|
||||
clearable
|
||||
v-model="form.viewableBy"
|
||||
placeholder="选择可查看者"
|
||||
readonly
|
||||
@click.native="choice( '选择可查看者', form.viewableBy)">
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item prop="secondType" label-width="150px" class="add-form-item">
|
||||
<template slot="label">2级资料分类</template>
|
||||
<el-select :value="stringToArr(form.secondType)"
|
||||
@change="handleChange($event,'secondType')"
|
||||
multiple
|
||||
placeholder="请选择2级资料分类"
|
||||
clearable>
|
||||
<el-option
|
||||
v-for="opt in dict.secondMaterialType"
|
||||
:key="opt.value"
|
||||
:value="opt.value" :label="opt.label"
|
||||
>
|
||||
{{ opt.label }}
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item prop="fourthType" label-width="150px" class="add-form-item">
|
||||
<template slot="label">4级资料分类</template>
|
||||
<el-select :value="stringToArr(form.fourthType)"
|
||||
@change="handleChange($event,'fourthType')"
|
||||
multiple
|
||||
placeholder="请选择4级资料分类"
|
||||
clearable>
|
||||
<el-option
|
||||
v-for="opt in dict.fourthMaterialType"
|
||||
:key="opt.value"
|
||||
:value="opt.value" :label="opt.label"
|
||||
>
|
||||
{{ opt.label }}
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="资料归属部门" prop="department" label-width="150px" class="add-form-item">
|
||||
<el-input v-model="form.department"
|
||||
placeholder="请输入资料归属部门"
|
||||
clearable></el-input>
|
||||
</el-form-item>
|
||||
<CustomDatePick
|
||||
:config="{
|
||||
attrName: '上传时间',
|
||||
attrField: 'uploadTime'
|
||||
}"
|
||||
v-model="form.uploadTime"
|
||||
disabled
|
||||
placeholder="系统自动生成"
|
||||
></CustomDatePick>
|
||||
<customFile
|
||||
:config="{
|
||||
attrName: '资料文件',
|
||||
attrField: 'informationFile'
|
||||
}"
|
||||
v-model="form.informationFile"
|
||||
:allowType="['.pdf', '.PDF', '.doc','.DOC', '.docx','.DOCX', '.pptx', '.PPTX', '.ppt', '.PPT', '.xls','.XLS', '.xlsx','.XLSX', '.pdg', '.PDG', '.zip']"
|
||||
></customFile>
|
||||
<el-form-item label="可下载者" prop="viewableBy" label-width="150px" class="add-form-item">
|
||||
<el-input
|
||||
clearable
|
||||
v-model="form.downloadableBy"
|
||||
placeholder="选择可下载者"
|
||||
readonly
|
||||
@click.native="choice( '选择可下载者', form.downloadableBy)">
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</div>
|
||||
<div class="drawer-footer">
|
||||
<el-button icon="el-icon-check" type="primary" @click="onSubmit" :loading="isSubmit">提交</el-button>
|
||||
<el-button icon="el-icon-close" @click="onClose">取消</el-button>
|
||||
</div>
|
||||
<Role-tree
|
||||
:is-title="choiceTitle"
|
||||
:is-visible.sync="modalShowRoleFlag"
|
||||
@checkedRole="checkedRole"
|
||||
:nodeList="nodeList"
|
||||
></Role-tree>
|
||||
</el-drawer>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import CustomDatePick from '@/components/CustomFormComponents/DatePicker'
|
||||
import CustomFile from '@/components/CustomFormComponents/File'
|
||||
import SelectMultipleFormItem from '@/components/hzwlComponents/SelectMultipleFormItem'
|
||||
|
||||
export default {
|
||||
name: "editDrawer",
|
||||
components: {
|
||||
CustomDatePick,
|
||||
CustomFile,
|
||||
SelectMultipleFormItem
|
||||
},
|
||||
props: {
|
||||
dict: {
|
||||
type: Object
|
||||
},
|
||||
},
|
||||
data (){
|
||||
const rules = {
|
||||
firstType: [
|
||||
{required: true, message: '1级资料分类不能为空', trigger: 'change'}
|
||||
],
|
||||
secondType: [
|
||||
{required: true, message: '2级资料分类不能为空', trigger: 'change'}
|
||||
],
|
||||
thirdType: [
|
||||
{required: true, message: '3级资料分类不能为空', trigger: 'change'}
|
||||
],
|
||||
fourthType: [
|
||||
{required: true, message: '4级资料分类不能为空', trigger: 'change'}
|
||||
],
|
||||
name: [
|
||||
{required: true, type: 'string', message: '资料名称不能为空', trigger: 'change'},
|
||||
{type: 'string', max: 500, message: '资料名称不能超过500个字符', trigger: 'change'}
|
||||
],
|
||||
department: [
|
||||
{required: true, type: 'string', message: '资料归属部门不能为空', trigger: 'change'},
|
||||
{type: 'string', max: 500, message: '资料归属部门不能超过500个字符', trigger: 'change'}
|
||||
],
|
||||
author: [
|
||||
{type: 'string', max: 500, message: '资料归属部门不能超过500个字符', trigger: 'change'}
|
||||
],
|
||||
}
|
||||
const form = {
|
||||
// 基础信息
|
||||
firstType: '',
|
||||
secondType: '',
|
||||
thirdType: '',
|
||||
fourthType: '',
|
||||
name: '',
|
||||
department: '',
|
||||
author: '',
|
||||
uploadTime: '',
|
||||
description: '',
|
||||
informationFile: '',
|
||||
viewableBy: '',
|
||||
downloadableBy: '',
|
||||
}
|
||||
return {
|
||||
title: '',
|
||||
showDrawer: false,
|
||||
rules,
|
||||
form,
|
||||
initForm: { ...form },
|
||||
isSubmit: false,
|
||||
reloadForm: true,
|
||||
// 人员选择
|
||||
choiceTitle: '',
|
||||
modalShowRoleFlag: false,
|
||||
nodeList: [],
|
||||
url: {
|
||||
add: 'lawss/sarLawsInformation/addLawsInformation',
|
||||
update: 'lawss/sarLawsInformation/updateLawsInformationInfo',
|
||||
getLawsInformationInfo: 'lawss/sarLawsInformation/getLawsInformationInfo'
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
stringToArr (str) {
|
||||
if (str && this.value !== '') {
|
||||
return str.split(',')
|
||||
} else {
|
||||
return []
|
||||
}
|
||||
},
|
||||
handleChange (val, field) {
|
||||
this.form[field] = val.join(',')
|
||||
},
|
||||
add (treeNodeId) {
|
||||
this.form = this.initForm
|
||||
this.form.treeNodeId = treeNodeId
|
||||
this.title = '新增'
|
||||
this.showDrawer = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs['formRef'].resetFields()
|
||||
})
|
||||
},
|
||||
edit (id) {
|
||||
this.title = '修改'
|
||||
this.showDrawer = true
|
||||
this.$http._getData(this.url.getLawsInformationInfo, { id }).then(res => {
|
||||
if (res.ok) {
|
||||
this.$set(this, 'form', res.data)
|
||||
this.reloadForm = false
|
||||
this.$nextTick(() => {
|
||||
this.reloadForm = true
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
onClose () {
|
||||
this.showDrawer = false
|
||||
},
|
||||
onSubmit () {
|
||||
this.$refs.formRef.validate(valid => {
|
||||
if (valid) {
|
||||
if (this.title === '新增') {
|
||||
this.$http._postData(this.url.add, this.form, { _this: this, loading: 'isSubmit' }).then(res => {
|
||||
if (res.ok) {
|
||||
this.$message.success('新增成功')
|
||||
this.onClose()
|
||||
this.$emit('load')
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.$http._putData(this.url.update, this.form,{ _this: this, loading: 'isSubmit' }).then(res => {
|
||||
if (res.ok) {
|
||||
this.$message.success('修改成功')
|
||||
this.onClose()
|
||||
this.$emit('load')
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
choice(title, nameId) {
|
||||
this.nodeList = []
|
||||
if (nameId) {
|
||||
let nameId1 = nameId.split(',')
|
||||
let idList = []
|
||||
nameId1.forEach(item => {
|
||||
let a, b
|
||||
a = item.substring(item.indexOf('(') +1)
|
||||
b = a.substring(0, a.lastIndexOf(')'))
|
||||
idList.push(b)
|
||||
})
|
||||
idList = idList.join(',')
|
||||
this.nodeList = idList.split(',')
|
||||
}
|
||||
this.choiceTitle = title
|
||||
this.modalShowRoleFlag = true
|
||||
},
|
||||
checkedRole(data) {
|
||||
let idList = ''
|
||||
let nameList = ''
|
||||
data.forEach(item => {
|
||||
if (nameList.length > 0) {
|
||||
nameList += ','
|
||||
idList += ','
|
||||
}
|
||||
idList += item.id
|
||||
nameList += item.name
|
||||
})
|
||||
let field = ''
|
||||
switch (this.choiceTitle) {
|
||||
case '选择可查看者':
|
||||
field = 'viewableBy'
|
||||
break
|
||||
case '选择可下载者':
|
||||
field = 'downloadableBy'
|
||||
break
|
||||
}
|
||||
this.$set(this.form, field, nameList)
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.drawer-content {
|
||||
padding: 0 19px;
|
||||
overflow-y: auto;
|
||||
flex: auto;
|
||||
}
|
||||
.drawer-footer {
|
||||
width: 100%;
|
||||
padding: 0 20px;
|
||||
height: 70px;
|
||||
line-height: 69px;
|
||||
border-top: 1px solid #e8e8e8;
|
||||
text-align: right;
|
||||
background: #fff;
|
||||
z-index: 999;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,121 @@
|
||||
<template>
|
||||
<div id="regulatoryMaterials">
|
||||
<!--左侧树-->
|
||||
<div id="left" class="tree-content" :class="{ 'tree-closed': sideClose }" >
|
||||
<!-- 政策树 -->
|
||||
<RegulatoryMaterialsTree ref="RegulatoryMaterialsTreeRef" @treeClick="treeClick"></RegulatoryMaterialsTree>
|
||||
<div class="tree-collapse" @click="treeCollapse" :class="{ 'tree-close': sideClose }">
|
||||
<!--切换折叠样式-->
|
||||
<i class="el-icon-arrow-left" v-if="sideClose === false"></i>
|
||||
<i class="el-icon-arrow-right" v-if="sideClose === true"></i>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 可拖拽 -->
|
||||
<div id="resize"></div>
|
||||
<div id="right">
|
||||
<RegulatoryMaterialsMain :treeNodeId="treeNodeId"></RegulatoryMaterialsMain>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import RegulatoryMaterialsTree from './components/RegulatoryMaterialsTree'
|
||||
import RegulatoryMaterialsMain from './components/RegulatoryMaterialsMain'
|
||||
|
||||
export default {
|
||||
name: "regulatoryMaterials",
|
||||
data() {
|
||||
return {
|
||||
sideClose: false, // 边栏收展状态
|
||||
treeNodeId: ''
|
||||
}
|
||||
},
|
||||
components: {
|
||||
RegulatoryMaterialsTree,
|
||||
RegulatoryMaterialsMain
|
||||
},
|
||||
mounted() {
|
||||
this.dragControllerLR()
|
||||
},
|
||||
methods: {
|
||||
treeClick (treeNode) {
|
||||
// 点击左侧树 重新获取数据
|
||||
this.treeNodeId = treeNode.id || ''
|
||||
// this.$nextTick(() => {
|
||||
// this.$refs.policyTableRef.treeClickGetBussionStandTable(treeNode.id || '')
|
||||
// })
|
||||
},
|
||||
|
||||
|
||||
|
||||
// 左侧树收展
|
||||
treeCollapse () {
|
||||
this.sideClose = !this.sideClose
|
||||
},
|
||||
|
||||
// 左右拖动事件
|
||||
dragControllerLR: function() {
|
||||
var resize = document.getElementById("resize");
|
||||
var left = document.getElementById("left");
|
||||
var right = document.getElementById("right");
|
||||
var box = document.getElementById("regulatoryMaterials");
|
||||
resize.onmousedown = function(e){
|
||||
var startX = e.clientX;
|
||||
resize.left = resize.offsetLeft;
|
||||
document.onmousemove = function(e){
|
||||
var endX = e.clientX;
|
||||
|
||||
var moveLen = resize.left + (endX - startX);
|
||||
var maxT = box.clientWidth - resize.offsetWidth;
|
||||
if(moveLen<150) moveLen = 150;
|
||||
if(moveLen>maxT-150) moveLen = maxT-150;
|
||||
|
||||
resize.style.left = moveLen;
|
||||
left.style.width = moveLen + "px";
|
||||
right.style.width = (box.clientWidth - moveLen - 5) + "px";
|
||||
}
|
||||
document.onmouseup = function(evt){
|
||||
document.onmousemove = null;
|
||||
document.onmouseup = null;
|
||||
resize.releaseCapture && resize.releaseCapture();
|
||||
}
|
||||
resize.setCapture && resize.setCapture();
|
||||
return false;
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
#regulatoryMaterials {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
position: relative;
|
||||
.tree-content {
|
||||
position: relative;
|
||||
background: #fff;
|
||||
.tree-collapse {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
#left{
|
||||
width: 20%;
|
||||
height:100%;
|
||||
float:left;
|
||||
}
|
||||
|
||||
#resize{
|
||||
width:5px;
|
||||
height:100%;
|
||||
cursor: w-resize;
|
||||
float:left;
|
||||
}
|
||||
|
||||
#right{
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
+22
-1
@@ -4047,7 +4047,17 @@ const routes = [
|
||||
title: '政策课题',
|
||||
menuId: '627f66cd6746234edd4722e20d8c01bb'
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/regulatoryMaterials',
|
||||
name: 'regulatoryMaterials',
|
||||
component: () => import('@/pages/policyRegulation/regulatoryMaterials'),
|
||||
meta: {
|
||||
requireAuth: true,
|
||||
title: '政策法规资料',
|
||||
menuId: '5b77e62147c5397178bc76f698e151c1'
|
||||
}
|
||||
},
|
||||
]
|
||||
},
|
||||
// 配置管理
|
||||
@@ -4493,6 +4503,17 @@ const routes = [
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: '/regulatoryMaterialsDetail/:id',
|
||||
name: 'regulatoryMaterialsDetail',
|
||||
component: () =>
|
||||
import('@/pages/details/regulatoryMaterialsDetail'),
|
||||
meta: {
|
||||
requireAuth: true,
|
||||
title: '政策法规资料详情',
|
||||
isBoolean: true
|
||||
}
|
||||
},
|
||||
// ************************** 搜索中心 ******************************* //
|
||||
{
|
||||
path: '/searchCenter/:selectKey?/:selectValue?',
|
||||
|
||||
Reference in New Issue
Block a user