liu_li
/
yxk-storeroom-system
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

档案检索

master
x_ying 3 years ago
parent
93e12fdb29
commit
b42e7956e5
2 changed files with 308 additions and 2 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 170
      src/views/archivesManage/archivesSearch/index.vue
  2. 140
      src/views/archivesManage/archivesSearch/module/detailDialog.vue

170
src/views/archivesManage/archivesSearch/index.vue
View File

@ -1,15 +1,181 @@
<template>
<div>
<h1 style="color:#fff">档案检索</h1>
<div>
<div class="head-container">
<h2>模糊检索</h2>
<div>
<div class="search-input">
<el-input v-model="keywords" placeholder="请输入内容" class="input-with-select" style="width:50%;">
<el-select slot="prepend" v-model="select" placeholder="请选择">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
<el-button slot="append" icon="el-icon-search" />
</el-input>
</div>
</div>
</div>
<div class="search-result">
<div class="search-title">
<p>检索结果</p>
<p>本次检索结果共计{{ resNum }}条数据</p>
</div>
<el-table
ref="table"
:data="crud.data"
style="width: 100%;"
height="calc(100vh - 493px)"
@row-dblclick="handleDbClick"
>
<!-- <el-table-column type="selection" width="55" align="center" /> -->
<el-table-column type="index" label="序号" width="90" align="center" />
<el-table-column prop="" label="子条数目" align="center" min-width="150" />
<el-table-column prop="" label="门类级别" align="center" min-width="100" />
<el-table-column prop="" label="门类名称" align="center" min-width="150" />
<el-table-column prop="" label="全宗号" align="center" min-width="180" />
<el-table-column prop="" label="档号" align="center" min-width="180" />
<el-table-column prop="" label="归档年度" align="center" min-width="100" />
<el-table-column prop="" label="题名" align="center" min-width="180" />
<el-table-column prop="" label="保密程度" align="center" min-width="100" />
<el-table-column prop="" label="部门" align="center" min-width="100" />
<el-table-column prop="" label="盒名称" align="center" min-width="180" />
<el-table-column prop="" label="所在位置" align="center" min-width="180" />
<el-table-column prop="" label="创建时间" align="center" min-width="180" />
</el-table>
<pagination />
<!-- 详情 -->
<detailDialog ref="detailDom" />
</div>
</div>
</div>
</template>
<script>
import pagination from '@crud/Pagination'
import CRUD, { presenter, crud } from '@crud/crud'
import detailDialog from './module/detailDialog.vue'
export default {
name: 'ArchivesSearch',
components: { pagination, detailDialog },
mixins: [presenter(), crud()],
cruds() {
return CRUD({
url: 'api/storage/initStorageLogList',
sort: ['update_time,desc']
// crudMethod: caseCrudMethod,
})
},
data() {
return {
keywords: '',
select: 1,
options: [
{ value: 1, label: '题名' },
{ value: 2, label: '档号' },
{ value: 3, label: '年度' },
{ value: 4, label: '密级' },
{ value: 5, label: '盒名称' },
{ value: 6, label: '保管期限' },
{ value: 7, label: '部门名称' }
],
resNum: 0
}
},
methods: {
// 双击详情
handleDbClick() {
this.$refs.detailDom.detailVisible = true
}
}
}
</script>
<style lang="scss" scoped>
// @import "~@/assets/styles/archives-manage.scss";
// @import "~@/assets/styles/lend-manage.scss";
.head-container{
padding: 100px 0 30px 0;
text-align: center;
h2{
color: #fff;
margin-bottom: 30px;
}
}
// ::v-deep .input-prepend .el-input__inner{
// padding-left: 135px;
// height: 42px;
// }
.search-area {
height: 100%;
margin: 0;
display: flex;
align-items: center;
justify-content: center;
& .search-input {
// width: 796px;
& .el-select .el-input {
width: 130px;
}
// & ::v-deep .input-with-select ::v-deep .el-input-group__prepend {
// background-color: #fff;
// }
}
}
// 补充不生效
::v-deep .el-input-group {
height: 42px;
& > input {
height: 42px;
border: 1px solid #339cff;
background-color: #021941;
&::placeholder {
color: #fff;
}
}
}
::v-deep .el-input-group__prepend {
width: 125px;
background-color: #339cff;
border: 1px solid #339cff;
border-radius: 34px;
border-right: 0;
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
::v-deep .el-input__inner {
color: #fff;
}
::v-deep .el-input-group__prepend div.el-select .el-input__inner{
color: #fff;
text-align: center;
}
::v-deep .el-input-group__append {
width: 72px;
left: -20px;
text-align: center;
background-color: #339cff;
border: 1px solid #339cff;
border-radius: 34px;
& i {
font-size: 25px;
color: #fff;
}
}
//检索结果
.search-result{
padding: 0 20px;
color: #fff;
.search-title{
padding:0 30px;
display: flex;
justify-content: space-between;
margin-bottom: 20px;
}
}
</style>

140
src/views/archivesManage/archivesSearch/module/detailDialog.vue
View File

@ -0,0 +1,140 @@
<template>
<div>
<el-dialog title="档案盒详情" :visible.sync="detailVisible">
<span class="dialog-right-top" />
<span class="dialog-left-bottom" />
<div class="setting-dialog">
<div class="archives-info-wrap">
<!-- tab -->
<ul class="archives-tab">
<li :class="{'active': archivesTabIndex == 0}" @click="changeActiveTab(0)">基本信息</li>
<li :class="{'active': archivesTabIndex == 2}" @click="changeActiveTab(2)">元数据</li>
</ul>
<!-- 基本信息 -->
<div v-show="archivesTabIndex==0" class="base-info item-content">
<div>
<div class="dpflex">
<p class="left"><span class="color-blue">全宗名：</span><span class="color-white">{{ }}</span></p>
<p class="right"><span class="color-blue">部门名称：</span><span class="color-white">{{ }}</span></p>
</div>
<div class="dpflex">
<p class="left"><span class="color-blue">归档年度：</span><span class="color-white">{{ }}</span></p>
<p class="right"><span class="color-blue">目录号：</span><span class="color-white">{{ }}</span></p>
</div>
<div class="dpflex">
<p class="left"><span class="color-blue">实体分类号：</span><span class="color-white">{{ }}</span></p>
<p class="right"><span class="color-blue">件号：</span><span class="color-white">{{ }}</span></p>
</div>
<div class="dpflex">
<p class="left"><span class="color-blue">成文日期：</span><span class="color-white">{{ }}</span></p>
<p class="right"><span class="color-blue">案卷级档号：</span><span class="color-white">{{ }}</span></p>
</div>
<p class="sin-row"><span class="color-blue">题名：</span><span class="color-white">{{ }}</span></p>
<div class="dpflex">
<p class="left"><span class="color-blue">保管期限：</span><span class="color-white">{{ }}</span></p>
<p class="right"><span class="color-blue">密级：</span><span class="color-white">{{ }}</span></p>
</div>
<div class="dpflex">
<p class="left"><span class="color-blue">总页数：</span><span class="color-white">{{ }}</span></p>
<p class="right"><span class="color-blue">总份数：</span><span class="color-white">{{ }}</span></p>
</div>
<div class="dpflex">
<p class="left"><span class="color-blue">立卷人：</span><span class="color-white">{{ }}</span></p>
<p class="right"><span class="color-blue">立卷时间：</span><span class="color-white">{{ }}</span></p>
</div>
<div class="dpflex">
<p class="left"><span class="color-blue">检查人：</span><span class="color-white">{{ }}</span></p>
<p class="right"><span class="color-blue">检查时间：</span><span class="color-white">{{ }}</span></p>
</div>
<p class="sin-row"><span class="color-blue">备注：</span><span class="color-white">{{ }}</span></p>
<div class="dpflex">
<p class="left"><span class="color-blue">TID：</span><span class="color-white">{{ }}</span></p>
<p class="right"><span class="color-blue">盒名称：</span><span class="color-white">{{ }}</span></p>
</div>
<div class="dpflex">
<p class="left"><span class="color-blue">库房位置：</span><span class="color-white">{{ }}</span></p>
<p class="right"><span class="color-blue">借阅状态：</span><span class="color-white">{{ }}</span></p>
</div>
<p class="sin-row"><span class="color-blue">条形码：</span><span class="color-white">{{ }}</span></p>
</div>
</div>
<!-- 元数据 -->
<div v-if="archivesTabIndex==2" class="item-content">
<pre v-highlightjs="xml_show">
<code class="highlight_s">
{{ xml_show }}
</code>
</pre>
</div>
</div>
</div>
</el-dialog>
</div>
</template>
<script>
export default {
data() {
return {
detailVisible: false,
rowData: {},
tableData: [],
archivesTabIndex: 0,
xml_show: null
}
},
methods: {
changeActiveTab(index) {
this.archivesTabIndex = index
}
}
}
</script>
<style lang="scss" scoped>
@import "~@/assets/styles/archives-manage.scss";
::v-deep .el-dialog{
width: 820px;
}
::v-deep .el-dialog__body{
padding: 20px 0;
height: 600px;
}
.dpflex{
display: flex;
p{
margin-bottom: 20px;
}
.left{
width: 400px;
}
}
.sin-row{
margin-bottom: 20px;
}
.color-blue{
width: 86px;
display: inline-block;
text-align: right;
color: #339CFF;
}
.color-white{
color: #fff;
}
::v-deep .el-dialog .el-dialog__header .el-dialog__close::before{
position: absolute;
right: -100px;
bottom: -10px;
}
::v-deep .el-tabs__item{
color: #339CFF;
&.is-active{
color: #fff;
}
}
</style>
Write Preview
Loading…
Cancel
Save