z_yu
3 years ago
6 changed files with 306 additions and 62 deletions
-
26src/api/archivesManage/archivesList.js
-
1src/components/Crud/CRUD.operation.vue
-
102src/views/archivesConfig/dict/dictDetail.vue
-
170src/views/archivesManage/archivesList/archivesDetail.vue
-
67src/views/archivesManage/archivesList/index.vue
-
2src/views/category/index.vue
@ -0,0 +1,26 @@ |
|||||
|
import request from '@/utils/request' |
||||
|
|
||||
|
export function getTableDisplayFields() { |
||||
|
return request({ |
||||
|
url: 'api/dict/all', |
||||
|
method: 'get' |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
export function add(data) { |
||||
|
return request({ |
||||
|
url: 'api/field/edit', |
||||
|
method: 'post', |
||||
|
data |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
export function edit(data) { |
||||
|
return request({ |
||||
|
url: 'api/field/edit', |
||||
|
method: 'post', |
||||
|
data |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
export default { add, edit, getTableDisplayFields } |
@ -0,0 +1,170 @@ |
|||||
|
<template> |
||||
|
<div> |
||||
|
<!--工具栏--> |
||||
|
<div class="head-container"> |
||||
|
<crudOperation :permission="permission" crud-tag="file"> |
||||
|
<template v-slot:rightButtonGroup class="crud-opts-right"> |
||||
|
<el-button size="mini" type="primary" icon="el-icon-plus">装盒</el-button> |
||||
|
<el-button size="mini" type="primary" icon="el-icon-plus">入库</el-button> |
||||
|
<el-button size="mini" type="primary" icon="el-icon-plus">借阅</el-button> |
||||
|
<el-button size="mini" type="primary" icon="el-icon-plus">绑定标签</el-button> |
||||
|
<!-- @click="" --> |
||||
|
</template> |
||||
|
</crudOperation> |
||||
|
</div> |
||||
|
<!--表单组件--> |
||||
|
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible="crud.status.cu > 0" :title="crud.status.title"> |
||||
|
<span class="dialog-right-top" /> |
||||
|
<span class="dialog-left-bottom" /> |
||||
|
<div class="setting-dialog"> |
||||
|
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px"> |
||||
|
<!-- <el-form-item label="字典名称" prop="dicName"> |
||||
|
<el-input v-model="form.dicName" style="width: 370px;" /> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="字典代码" prop="dicCode"> |
||||
|
<el-input v-model="form.dicCode" style="width: 370px;" /> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="内容说明" prop="dicExplain"> |
||||
|
<el-input v-model="form.dicExplain" style="width: 370px;" type="textarea" :rows="4" /> |
||||
|
</el-form-item> --> |
||||
|
</el-form> |
||||
|
<div slot="footer" class="dialog-footer"> |
||||
|
<el-button type="text" @click="crud.cancelCU">取消</el-button> |
||||
|
<el-button :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU">确认</el-button> |
||||
|
</div> |
||||
|
</div> |
||||
|
</el-dialog> |
||||
|
<el-dialog title="删除字典内容" :visible.sync="deleteVisible" :before-close="handleClose"> |
||||
|
<span class="dialog-right-top" /> |
||||
|
<span class="dialog-left-bottom" /> |
||||
|
<div class="setting-dialog"> |
||||
|
<p><span style="color:#fff;">确定删除当前档案吗?</span></p> |
||||
|
<div slot="footer" class="dialog-footer"> |
||||
|
<el-button type="primary" @click.native="handleConfirm">确定</el-button> |
||||
|
</div> |
||||
|
</div> |
||||
|
</el-dialog> |
||||
|
<!--表格渲染--> |
||||
|
<el-table ref="table" v-loading="crud.loading" :data="crud.data" highlight-current-row style="width: 100%;" @selection-change="crud.selectionChangeHandler" @row-click="clickRowHandler"> |
||||
|
<el-table-column type="selection" width="55" align="center" /> |
||||
|
<el-table-column type="index" label="序号" width="55" align="center" /> |
||||
|
<!-- :align="field.isDisplayAlign" :width="field.isDisplayWidth" --> |
||||
|
<el-table-column v-for="field in tableDisplayFields" :key="field.id" :label="field.fieldCnName" show-overflow-tooltip> |
||||
|
<template slot-scope="scope"> |
||||
|
{{ scope.row[field.fieldName] }} |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</el-table> |
||||
|
<!--分页组件--> |
||||
|
<pagination /> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import { add, edit, getTableDisplayFields } from '@/api/archivesManage/archivesList' |
||||
|
import CRUD, { presenter, header, form } from '@crud/crud' |
||||
|
import crudOperation from '@crud/CRUD.operation' |
||||
|
import pagination from '@crud/Pagination' |
||||
|
|
||||
|
export default { |
||||
|
components: { crudOperation, pagination }, |
||||
|
cruds() { |
||||
|
return [ |
||||
|
CRUD({ |
||||
|
tag: 'file', |
||||
|
title: '档案', |
||||
|
url: 'api/archives/initArchivesView', |
||||
|
query: { categoryId: '', isdel: false }, |
||||
|
crudMethod: { add, edit }, |
||||
|
optShow: { |
||||
|
add: true, |
||||
|
edit: true, |
||||
|
del: true, |
||||
|
reset: false, |
||||
|
download: true, |
||||
|
group: false |
||||
|
}, |
||||
|
// queryOnPresenterCreated: false, |
||||
|
sort: ['department,asc'] |
||||
|
}) |
||||
|
] |
||||
|
}, |
||||
|
mixins: [ |
||||
|
presenter(), |
||||
|
header(), |
||||
|
// form(function() { |
||||
|
// return Object.assign({ dicPid: this.dicPid }, defaultForm) |
||||
|
// }) |
||||
|
form() |
||||
|
], |
||||
|
data() { |
||||
|
return { |
||||
|
// dicPid: null, |
||||
|
// needRefreshTree: false, |
||||
|
// rules: { |
||||
|
// dicName: [ |
||||
|
// { required: true, message: '请输入字典名称', trigger: 'blur' } |
||||
|
// ], |
||||
|
// dicCode: [ |
||||
|
// { required: true, message: '请输入字典代码', trigger: 'blur' } |
||||
|
// ] |
||||
|
// }, |
||||
|
permission: { |
||||
|
add: ['admin', 'archivesList:add'], |
||||
|
edit: ['admin', 'archivesList:edit'], |
||||
|
del: ['admin', 'archivesList:del'] |
||||
|
}, |
||||
|
deleteVisible: false, |
||||
|
deleteData: {}, |
||||
|
tableDisplayFields: [], |
||||
|
getTableDisplayFieldsLoading: false |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
[CRUD.HOOK.beforeRefresh]() { |
||||
|
this.getTableDisplayFieldsLoading = true |
||||
|
// 请求数据 |
||||
|
getTableDisplayFields().then(data => { |
||||
|
this.tableDisplayFields = data.queryFields.filter((fields) => { return fields.isDisplay }) |
||||
|
this.getTableDisplayFieldsLoading = false |
||||
|
}) |
||||
|
}, |
||||
|
// [CRUD.HOOK.afterDelete]() { |
||||
|
// this.needRefreshTree = true |
||||
|
// }, |
||||
|
// // 获取数据前设置默认参数 |
||||
|
// [CRUD.HOOK.beforeRefresh]() { |
||||
|
// this.crud.query.id = this.dicPid |
||||
|
// }, |
||||
|
// [CRUD.HOOK.afterRefresh](crud) { |
||||
|
// if (this.needRefreshTree) { |
||||
|
// this.needRefreshTree = false |
||||
|
// this.$emit('treeRefresh', crud.data) |
||||
|
// } |
||||
|
// }, |
||||
|
toDelete(data) { |
||||
|
this.deleteData = data |
||||
|
this.deleteVisible = true |
||||
|
}, |
||||
|
handleConfirm() { |
||||
|
this.deleteVisible = false |
||||
|
this.crud.delAllLoading = true |
||||
|
this.crud.doDelete(this.deleteData) |
||||
|
}, |
||||
|
handleClose(done) { |
||||
|
this.deleteData = {} |
||||
|
done() |
||||
|
}, |
||||
|
clickRowHandler(row) { |
||||
|
this.$refs.table.clearSelection() |
||||
|
this.$refs.table.toggleRowSelection(row) |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style rel="stylesheet/scss" lang="scss" scoped> |
||||
|
::v-deep thead .el-table-column--selection .cell { |
||||
|
display: none; |
||||
|
} |
||||
|
</style> |
@ -1,21 +1,70 @@ |
|||||
<template> |
<template> |
||||
<field title="电子文件字段" :is-type="3" permission-str="electronicFields" /> |
|
||||
|
<div class="app-container"> |
||||
|
<!-- 门类列表 --> |
||||
|
<el-row class="container-main" :gutter="20"> |
||||
|
<el-col class="container-left curd-in-out" :xs="10" :sm="8" :md="5" :lg="6" :xl="5"> |
||||
|
<span class="right-top-line" /> |
||||
|
<span class="left-bottom-line" /> |
||||
|
<!--门类树状结构--> |
||||
|
<el-tree ref="tree" v-loading="crud.loading" :data="crud.data" :props="defaultProps" node-key="id" :expand-on-click-node="false" highlight-current @node-click="handleNodeClick" /> |
||||
|
</el-col> |
||||
|
<!-- 档案管理列表 --> |
||||
|
<el-col class="container-right" :xs="14" :sm="18" :md="19" :lg="18" :xl="19"> |
||||
|
<span class="right-top-line" /> |
||||
|
<span class="left-bottom-line" /> |
||||
|
<archivesDetail ref="archivesDetail" /> |
||||
|
</el-col> |
||||
|
</el-row> |
||||
|
</div> |
||||
</template> |
</template> |
||||
|
|
||||
<script> |
<script> |
||||
import Field from '@/views/components/field' |
|
||||
|
import archivesDetail from './archivesDetail' |
||||
|
import crudDict from '@/api/archivesConfig/dict' |
||||
|
import CRUD, { presenter } from '@crud/crud' |
||||
|
|
||||
export default { |
export default { |
||||
name: 'ArchivesList', |
name: 'ArchivesList', |
||||
components: { Field } |
|
||||
|
components: { archivesDetail }, |
||||
|
cruds() { |
||||
|
return [ |
||||
|
CRUD({ |
||||
|
title: '门类', url: 'api/dictrionary/menu', |
||||
|
crudMethod: { ...crudDict }, |
||||
|
sort: ['dicSequence,asc'] |
||||
|
}) |
||||
|
] |
||||
|
}, |
||||
|
mixins: [presenter()], |
||||
|
data() { |
||||
|
return { |
||||
|
defaultProps: { |
||||
|
children: 'childMenus', |
||||
|
label: 'dicName' |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
// 右边初始化数据是空 |
||||
|
// [CRUD.HOOK.beforeRefresh]() { |
||||
|
// if (this.$refs.dictDetail) { |
||||
|
// this.$refs.dictDetail.query.id = '' |
||||
|
// } |
||||
|
// return true |
||||
|
// }, |
||||
|
// 选中字典后,设置字典详情数据 |
||||
|
handleNodeClick(val) { |
||||
|
if (val) { |
||||
|
this.crud.selectionChangeHandler([val]) |
||||
|
// this.$refs.dictDetail.query.id = val.id |
||||
|
// this.$refs.dictDetail.dicPid = val.id |
||||
|
// this.$refs.dictDetail.crud.toQuery() |
||||
|
// this.activeAddBtn = true |
||||
|
} |
||||
|
} |
||||
|
} |
||||
} |
} |
||||
</script> |
</script> |
||||
|
|
||||
<style rel="stylesheet/scss" lang="scss" scoped> |
<style rel="stylesheet/scss" lang="scss" scoped> |
||||
::v-deep thead .el-table-column--selection .cell { |
|
||||
display: none; |
|
||||
} |
|
||||
::v-deep div.el-dialog__footer { |
|
||||
text-align: center; |
|
||||
} |
|
||||
</style> |
</style> |
Write
Preview
Loading…
Cancel
Save
Reference in new issue