22 changed files with 1408 additions and 216 deletions
-
10src/api/area/index.js
-
17src/api/bookBasice/index.js
-
27src/api/collectionBook/index.js
-
18src/api/shelf/index.js
-
14src/assets/iconfonts/light/iconfont.css
-
2src/assets/iconfonts/light/iconfont.js
-
14src/assets/iconfonts/light/iconfont.json
-
BINsrc/assets/iconfonts/light/iconfont.ttf
-
BINsrc/assets/iconfonts/light/iconfont.woff
-
BINsrc/assets/iconfonts/light/iconfont.woff2
-
13src/assets/styles/mixin.scss
-
131src/views/components/bookSwiper.vue
-
8src/views/dashboard/PanelGroup.vue
-
18src/views/home.vue
-
63src/views/visualCheck/bookstore/book/index.vue
-
254src/views/visualCheck/bookstore/collection/index.vue
-
438src/views/visualCheck/checkManage/bookSearch/index.vue
-
240src/views/visualCheck/checkManage/bookshelfSearch/index.vue
-
151src/views/visualCheck/checkManage/index.vue
-
183src/views/visualCheck/checkManage/statistic/reverseShelf/index.vue
-
2src/views/visualCheck/checkManage/statistic/search.vue
-
21src/views/visualCheck/venueDevice/area/index.vue
@ -0,0 +1,27 @@ |
|||
import request from '@/utils/request' |
|||
|
|||
export function add(data) { |
|||
return request({ |
|||
url: 'api/bookBasice/editBookDetails', |
|||
method: 'post', |
|||
data |
|||
}) |
|||
} |
|||
|
|||
export function edit(data) { |
|||
return request({ |
|||
url: 'api/bookBasice/editBookDetails', |
|||
method: 'post', |
|||
data |
|||
}) |
|||
} |
|||
|
|||
export function del(ids) { |
|||
return request({ |
|||
url: 'api/bookBasice/delBookDetails', |
|||
method: 'post', |
|||
data: ids |
|||
}) |
|||
} |
|||
|
|||
export default { add, edit, del } |
|||
2
src/assets/iconfonts/light/iconfont.js
File diff suppressed because it is too large
View File
File diff suppressed because it is too large
View File
@ -0,0 +1,131 @@ |
|||
<template> |
|||
<div> |
|||
<swiper |
|||
ref="swiperTitle" |
|||
class="swiper-title" |
|||
:options="swiperOptionTitle" |
|||
:auto-update="true" |
|||
:auto-destroy="true" |
|||
:delete-instance-on-destroy="true" |
|||
:cleanup-styles-on-destroy="true" |
|||
> |
|||
<swiper-slide |
|||
v-for="(item, index) of tabListData" |
|||
ref="swiperSlideItem" |
|||
:key="'name' + index" |
|||
:iname="item.name" |
|||
class="swiper-slide-title" |
|||
> |
|||
<div |
|||
class="tab-name" |
|||
:class="{ active: index === swiperActiveIndex }" |
|||
@click="handleSlidClickFun(index)" |
|||
> |
|||
{{ item.name }} |
|||
</div> |
|||
</swiper-slide> |
|||
</swiper> |
|||
<swiper |
|||
ref="swiperContent" |
|||
class="swiper-content" |
|||
:options="swiperOptionContent" |
|||
:auto-update="true" |
|||
:auto-destroy="true" |
|||
:delete-instance-on-destroy="true" |
|||
:cleanup-styles-on-destroy="true" |
|||
> |
|||
<swiper-slide |
|||
v-for="(item, index) of tabListData" |
|||
:key="'content' + index" |
|||
class="swiper-slide-content" |
|||
> |
|||
<ul class="cabinet-row"> |
|||
<li v-for="(item,index) in bookList" :key="index" :class="{ active: index === rightDataIndex }"> |
|||
<span>{{ item }}</span> |
|||
</li> |
|||
</ul> |
|||
</swiper-slide> |
|||
</swiper> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { mapGetters } from 'vuex' |
|||
import { swiper, swiperSlide } from 'vue-awesome-swiper' |
|||
import 'swiper/dist/css/swiper.css' |
|||
export default { |
|||
name: 'BookSwiper', |
|||
components: { swiper, swiperSlide }, |
|||
props: { |
|||
|
|||
}, |
|||
data() { |
|||
const _this = this |
|||
return { |
|||
swiperActiveIndex: 0, |
|||
rightDataIndex: null, |
|||
swiperOptionContent: { |
|||
slidesPerView: 'auto', |
|||
on: { |
|||
slideChangeTransitionStart: function() { |
|||
_this.rightDataIndex = null |
|||
_this.swiperActiveIndex = this.activeIndex |
|||
_this.swiperTitle.slideTo(this.activeIndex, 500, false) |
|||
} |
|||
} |
|||
}, |
|||
swiperOptionTitle: { |
|||
slidesPerView: 'auto', |
|||
freeMode: true |
|||
}, |
|||
tabListData: [{ name: '热门图书' }, { name: '热门架位' }, { name: '冷面图书' }], |
|||
bookList: [] |
|||
} |
|||
}, |
|||
computed: { |
|||
...mapGetters([ |
|||
'baseApi' |
|||
]) |
|||
}, |
|||
methods: { |
|||
handleSlidClickFun(index) { |
|||
this.rightDataIndex = null |
|||
this.handleSlideToFun(index) |
|||
}, |
|||
handleSlideToFun(index) { |
|||
this.swiperActiveIndex = index |
|||
this.swiperContent.slideTo(index, 500, false) |
|||
this.swiperTitle.slideTo(index, 500, false) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.swiper-title{ |
|||
::v-deep .swiper-wrapper{ |
|||
margin: 10px 0; |
|||
border-bottom: 1px solid #EDEFF3; |
|||
} |
|||
} |
|||
.swiper-slide-title { |
|||
width: auto !important; |
|||
margin-right: 20px; |
|||
cursor: pointer; |
|||
.tab-name { |
|||
padding: 10px; |
|||
&.active { |
|||
color: #0348F3; |
|||
border-bottom: 3px solid #0348F3; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.swiper-content{ |
|||
// height: 544px; |
|||
} |
|||
.swiper-slide-content { |
|||
// padding: 0 10px; |
|||
// margin: 0 10px 0 0; |
|||
} |
|||
</style> |
|||
@ -1,16 +1,448 @@ |
|||
<template> |
|||
<div class="app-container"> |
|||
图书检索 |
|||
<div class="app-container row-container"> |
|||
<div class="head-container"> |
|||
<div class="head-search"> |
|||
<!-- 搜索 --> |
|||
<el-select v-model="query.status" clearable size="small" placeholder="状态" class="filter-item" style="width: 100px" @change="crud.toQuery"> |
|||
<i slot="prefix" class="iconfont icon-zhuangtai" /> |
|||
<el-option v-for="item in statusOptions" :key="item.key" :label="item.display_name" :value="item.key" /> |
|||
</el-select> |
|||
<el-input v-model="query.search" clearable size="small" placeholder="输入检索条件检索" prefix-icon="el-icon-search" style="width: 220px;" class="filter-item" @clear="crud.toQuery" @keyup.enter.native="crud.toQuery" /> |
|||
<rrOperation /> |
|||
</div> |
|||
<crudOperation :permission="permission"> |
|||
<template v-slot:right> |
|||
<el-button size="mini" :disabled="crud.selections.length === 0" @click="handleBatchListing"> |
|||
<i class="iconfont icon-ruku" /> |
|||
批量上架 |
|||
</el-button> |
|||
<el-button size="mini" :loading="crud.downloadLoading" :disabled="crud.selections.length === 0" @click="handleRemoveShelf(crud.selections)"> |
|||
<i class="iconfont icon-chuku" /> |
|||
一键下架 |
|||
</el-button> |
|||
</template> |
|||
</crudOperation> |
|||
</div> |
|||
<div class="container-wrap"> |
|||
<span class="right-top-line" /> |
|||
<span class="left-bottom-line" /> |
|||
<el-table |
|||
ref="table" |
|||
v-loading="crud.loading" |
|||
class="archives-table" |
|||
:data="crud.data" |
|||
style="width: 100%;" |
|||
height="540" |
|||
@selection-change="crud.selectionChangeHandler" |
|||
@row-click="clickRowHandler" |
|||
@row-dblclick="handleDbClick" |
|||
> |
|||
<el-table-column type="selection" align="center" width="55" /> |
|||
<el-table-column prop="regionName" label="题名" /> |
|||
<el-table-column prop="regionCode" label="著者" /> |
|||
<el-table-column prop="floorName" label="条码" /> |
|||
<el-table-column prop="booksheflCount" label="索书号" /> |
|||
<el-table-column prop="booksheflCount" label="所在位置" /> |
|||
<el-table-column label="状态" align="center" prop="deptsStatus"> |
|||
<!-- slot-scope="scope" --> |
|||
<template> |
|||
<span class="row-state row-warehousing">未知</span> |
|||
<!-- <span class="row-state row-binding state-active">在架</span> |
|||
<span class="row-state row-lending state-active">错架</span> |
|||
<span class="row-state row-physical state-active">错序</span> --> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="createTime" label="所属馆藏"> |
|||
<template slot-scope="scope"> |
|||
<div>{{ scope.row.createTime | parseTime }}</div> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="createTime" label="更新时间"> |
|||
<template slot-scope="scope"> |
|||
<div>{{ scope.row.createTime | parseTime }}</div> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
<!--分页组件--> |
|||
<pagination v-if="crud.data.length!==0" /> |
|||
</div> |
|||
|
|||
<!-- form --> |
|||
<el-dialog append-to-body :close-on-click-modal="false" :modal-append-to-body="false" :before-close="handleCloseDialog" :visible="addBookShelfVisible" title="批量上架"> |
|||
<span class="dialog-right-top" /> |
|||
<span class="dialog-left-bottom" /> |
|||
<div class="setting-dialog"> |
|||
<div class="dialog-batch-listing"> |
|||
<div class="batch-left"> |
|||
<h5>已选图书</h5> |
|||
<ul class="left-book-list"> |
|||
<li>【条码号】图书题名1</li> |
|||
<li>【条码号】图书题名1</li> |
|||
<li>【条码号】图书题名1</li> |
|||
<li>【条码号】图书题名1</li> |
|||
<li>【条码号】图书题名1</li> |
|||
<li>【条码号】图书题名1</li> |
|||
<li>【条码号】图书题名1</li> |
|||
<li>【条码号】图书题名1</li> |
|||
<li>【条码号】图书题名1</li> |
|||
<li>【条码号】图书题名1</li> |
|||
</ul> |
|||
</div> |
|||
<div class="batch-right"> |
|||
<h5>选择上架位置</h5> |
|||
<el-form ref="form" :rules="rules" :model="form" size="small" label-width="30px"> |
|||
<el-form-item prop="floorId"> |
|||
<el-select v-model="form.floorId" placeholder="选择楼层" style="width: 280px;" @change="changeFloorValue($event)"> |
|||
<el-option |
|||
v-for="(item,index) in floorOptions" |
|||
:key="index" |
|||
:label="item.floorName" |
|||
:value="item.id" |
|||
/> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item prop="regionId"> |
|||
<el-select v-model="form.regionId" placeholder="选择区域" style="width: 280px;" @change="changeRegionValue($event)"> |
|||
<el-option |
|||
v-for="(item,index) in regionOptions" |
|||
:key="index" |
|||
:label="item.regionName" |
|||
:value="item.id" |
|||
/> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item prop="shelfId"> |
|||
<el-select v-model="form.shelfId" placeholder="选择书架" style="width: 280px;" @change="changeShelfValue($event)"> |
|||
<el-option |
|||
v-for="(item,index) in shelfOptions" |
|||
:key="index" |
|||
:label="item.shelfName" |
|||
:value="item.shelfId" |
|||
/> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item prop="girdId"> |
|||
<el-select v-model="form.girdId" placeholder="选择层位" style="width: 280px;" @change="changeGirdValue($event)"> |
|||
<el-option |
|||
v-for="(item,index) in girdOptions" |
|||
:key="index" |
|||
:label="item.gridName" |
|||
:value="item.id" |
|||
/> |
|||
</el-select> |
|||
</el-form-item> |
|||
</el-form> |
|||
</div> |
|||
</div> |
|||
<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 class="detailBook" append-to-body :close-on-click-modal="false" :modal-append-to-body="false" :before-close="handleCloseDialog" :visible="detailVisible" title="图书详情"> |
|||
<span class="dialog-right-top" /> |
|||
<span class="dialog-left-bottom" /> |
|||
<div class="setting-dialog"> |
|||
<div class="detail-tab tab-content"> |
|||
<ul class="tab-nav"> |
|||
<li :class="{'active-tab-nav': tabIndex === 0}" @click="changeDetailTab(0)">基础信息</li> |
|||
<li :class="{'active-tab-nav': tabIndex === 1}" @click="changeDetailTab(1)">盘点信息</li> |
|||
</ul> |
|||
<ul v-if="tabIndex===0" class="book-detail"> |
|||
<li><span>题名：</span>三国演义</li> |
|||
<li><span>著者：</span>罗贯中</li> |
|||
<li><span>出版社：</span>人民出版社</li> |
|||
<li><span>索书号：</span>I247.57/454:2</li> |
|||
<li><span>ISBN：</span>95431578551345</li> |
|||
<li><span>条码号：</span>54898789124454</li> |
|||
<li><span>馆藏地：</span>机构-楼层-馆藏地名称</li> |
|||
<li class="book-img"><img :src="imageUrl" :onerror="defaultImg" alt=""></li> |
|||
</ul> |
|||
<ul v-if="tabIndex===1" class="book-detail book-other"> |
|||
<li> |
|||
<span>状态：</span> |
|||
<i class="row-state no-state">未知</i> |
|||
<!-- <i class="row-state end-state">在架</i> |
|||
<i class="row-state cancel-state">错架</i> |
|||
<i class="row-state ing-state">错序</i> --> |
|||
</li> |
|||
<li><span>当前位置：</span>一楼-区域A-001排A面01架1层</li> |
|||
<li><span>应在位置：</span>一楼-区域A-001排A面01架1层</li> |
|||
<li><span>更新时间：</span>2024-12-05 15:14</li> |
|||
</ul> |
|||
</div> |
|||
<div slot="footer" class="dialog-footer"> |
|||
<el-button :loading="crud.status.cu === 2" type="primary" @click="detailVisible=false">确定</el-button> |
|||
</div> |
|||
</div> |
|||
</el-dialog> |
|||
|
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { FetchLibraryFloorListAll } from '@/api/floor/index' |
|||
import { FetchRegionAllByFloor } from '@/api/area/index' |
|||
import { FetchShelfAllByRegionId, FetchShelfGridAllByShelfId } from '@/api/shelf/index' |
|||
import crudRegion from '@/api/area/index' |
|||
import CRUD, { presenter, header, form, crud } from '@crud/crud' |
|||
import crudOperation from '@crud/CRUD.operation' |
|||
import rrOperation from '@crud/RR.operation' |
|||
import pagination from '@crud/Pagination' |
|||
import { mapGetters } from 'vuex' |
|||
import defaultImg from '@/assets/images/system/default-img.jpg' |
|||
// import { exportFile } from '@/utils/index' |
|||
// import qs from 'qs' |
|||
const defaultForm = { id: null, floorId: null, regionId: null, shelfId: null, girdId: null } |
|||
export default { |
|||
name: 'BookSearch', |
|||
components: { crudOperation, rrOperation, pagination }, |
|||
cruds() { |
|||
return CRUD({ title: '图书检索', url: 'api/libraryRegion/initLibraryRegionList', crudMethod: { ...crudRegion }, sort: [], optShow: { |
|||
add: false, |
|||
edit: false, |
|||
del: false, |
|||
download: false, |
|||
group: false, |
|||
reset: true |
|||
}}) |
|||
}, |
|||
mixins: [presenter(), header(), form(defaultForm), crud()], |
|||
data() { |
|||
return { |
|||
statusOptions: [ |
|||
{ key: '1', display_name: '在架' }, |
|||
{ key: '2', display_name: '错架' }, |
|||
{ key: '3', display_name: '错序' }, |
|||
{ key: '4', display_name: '未知' } |
|||
], |
|||
permission: { |
|||
add: ['admin', 'search:add'], |
|||
edit: ['admin', 'search:edit'], |
|||
del: ['admin', 'search:del'] |
|||
}, |
|||
addBookShelfVisible: false, |
|||
detailVisible: false, |
|||
floorOptions: [], |
|||
regionOptions: [], |
|||
shelfOptions: [], |
|||
girdOptions: [], |
|||
rules: { |
|||
floorId: [ |
|||
{ required: true, message: '请选择楼层', trigger: 'change' } |
|||
], |
|||
regionId: [ |
|||
{ required: true, message: '请选择区域', trigger: 'change' } |
|||
], |
|||
shelfId: [ |
|||
{ required: true, message: '请选择架位', trigger: 'change' } |
|||
], |
|||
girdId: [ |
|||
{ required: true, message: '请选择层位', trigger: 'change' } |
|||
] |
|||
}, |
|||
tabIndex: 0, |
|||
imageUrl: defaultImg |
|||
} |
|||
}, |
|||
computed: { |
|||
...mapGetters([ |
|||
'user', |
|||
'baseApi' |
|||
]) |
|||
}, |
|||
created() { |
|||
this.getLibraryFloorListAll() |
|||
}, |
|||
methods: { |
|||
[CRUD.HOOK.beforeRefresh]() { |
|||
}, |
|||
[CRUD.HOOK.afterRefresh](crud) { |
|||
}, |
|||
// 新增前将多选的值设置为空 |
|||
[CRUD.HOOK.beforeToAdd]() { |
|||
}, // 初始化编辑时候的角色与岗位 |
|||
[CRUD.HOOK.beforeToEdit](crud, form) { |
|||
}, |
|||
[CRUD.HOOK.beforeValidateCU](crud, form) { |
|||
}, |
|||
// 提交前做的操作 |
|||
[CRUD.HOOK.afterValidateCU](crud) { |
|||
return false |
|||
}, |
|||
changeDetailTab(index) { |
|||
this.tabIndex = index |
|||
}, |
|||
// 获取楼层数据 |
|||
getLibraryFloorListAll() { |
|||
FetchLibraryFloorListAll().then(res => { |
|||
this.floorOptions = res |
|||
}).catch(() => { |
|||
}) |
|||
}, |
|||
changeFloorValue(value) { |
|||
console.log(value) |
|||
this.crud.form.regionId = null |
|||
this.crud.form.shelfId = null |
|||
this.crud.form.girdId = null |
|||
this.shelfOptions = [] |
|||
this.girdOptions = [] |
|||
const params = { |
|||
'floorId': value |
|||
} |
|||
FetchRegionAllByFloor(params).then(res => { |
|||
this.regionOptions = res |
|||
}).catch(() => { |
|||
}) |
|||
}, |
|||
changeRegionValue(value) { |
|||
console.log(value) |
|||
this.crud.form.shelfId = null |
|||
this.crud.form.girdId = null |
|||
this.girdOptions = [] |
|||
const params = { |
|||
'regionId': value |
|||
} |
|||
FetchShelfAllByRegionId(params).then(res => { |
|||
this.shelfOptions = res |
|||
}).catch(() => { |
|||
}) |
|||
}, |
|||
changeShelfValue(value) { |
|||
console.log(value) |
|||
this.crud.form.girdId = null |
|||
const params = { |
|||
'shelfId': value |
|||
} |
|||
FetchShelfGridAllByShelfId(params).then(res => { |
|||
this.girdOptions = res |
|||
}).catch(() => { |
|||
}) |
|||
}, |
|||
changeGirdValue(value) { |
|||
console.log(value) |
|||
}, |
|||
clickRowHandler(row) { |
|||
this.$refs.table.clearSelection() |
|||
this.$refs.table.toggleRowSelection(row) |
|||
}, |
|||
handleDbClick(row) { |
|||
this.detailVisible = true |
|||
}, |
|||
handleBatchListing() { |
|||
this.addBookShelfVisible = true |
|||
}, |
|||
handleRemoveShelf(data) { |
|||
console.log(data) |
|||
this.crud.downloadLoading = true |
|||
this.$confirm('此操作将下架所选图书' + '<span>你是否还要继续？</span>', '提示', { |
|||
confirmButtonText: '继续', |
|||
cancelButtonText: '取消', |
|||
type: 'warning', |
|||
dangerouslyUseHTMLString: true |
|||
}).then(() => { |
|||
const ids = [] |
|||
data.forEach(val => { |
|||
ids.push(val.deptsId) |
|||
}) |
|||
const params = { |
|||
'deptsIds': ids |
|||
} |
|||
console.log(params) |
|||
// exportFile(this.baseApi + '/api/depts/download?' + qs.stringify(params, { indices: false })) |
|||
// this.crud.downloadLoading = false |
|||
}).catch(() => { |
|||
this.crud.downloadLoading = false |
|||
}) |
|||
}, |
|||
handleCloseDialog() { |
|||
this.addBookShelfVisible = false |
|||
this.detailVisible = false |
|||
if (this.$refs.form) { |
|||
this.crud.cancelCU() |
|||
this.$refs.form.resetFields() |
|||
} |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
<style scoped> |
|||
|
|||
<style lang="scss" scoped> |
|||
.dialog-batch-listing{ |
|||
display: flex; |
|||
justify-content: space-between; |
|||
border: 1px solid #E6E8ED; |
|||
.batch-left{ |
|||
width: calc(100%/2); |
|||
border-right: 1px solid #E6E8ED; |
|||
.left-book-list{ |
|||
height: 400px; |
|||
padding: 10px 0; |
|||
overflow: hidden; |
|||
overflow-y: scroll; |
|||
li{ |
|||
padding: 0 10px; |
|||
line-height: 40px; |
|||
border-bottom: 1px solid #E6E8ED; |
|||
} |
|||
} |
|||
} |
|||
.batch-right{ |
|||
width: calc(100%/2); |
|||
.el-form{ |
|||
padding-top: 20px |
|||
} |
|||
} |
|||
h5{ |
|||
height: 40px; |
|||
line-height: 40px; |
|||
font-size: 14px; |
|||
text-align: center; |
|||
background-color: #F5F9FC; |
|||
color: #0C0E1E; |
|||
} |
|||
} |
|||
.detailBook { |
|||
::v-deep .el-dialog .el-dialog__body{ |
|||
padding: 0 0 30px 0; |
|||
} |
|||
.book-detail{ |
|||
position: relative; |
|||
padding: 20px 30px; |
|||
background-color: #F6F8FC; |
|||
li{ |
|||
line-height: 40px; |
|||
span{ |
|||
display: inline-block; |
|||
width: 60px; |
|||
text-align: right; |
|||
margin-right: 20px; |
|||
color: #0C0E1E; |
|||
} |
|||
} |
|||
.book-img{ |
|||
position: absolute; |
|||
right: 20px; |
|||
top: 20px; |
|||
height: 140px; |
|||
img{ |
|||
display: block; |
|||
height: 100%; |
|||
} |
|||
} |
|||
} |
|||
.book-other{ |
|||
li{ |
|||
span{ |
|||
width: 80px; |
|||
} |
|||
i{ |
|||
font-style: normal; |
|||
padding: 0 8px; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
</style> |
|||
@ -1,16 +1,248 @@ |
|||
<template> |
|||
<div class="app-container"> |
|||
图架检索 |
|||
<div class="app-container row-container"> |
|||
<div class="head-container"> |
|||
<div class="head-search"> |
|||
<!-- 搜索 --> |
|||
<el-select v-model="query.floorId" clearable size="small" placeholder="楼层" class="filter-item" style="width: 100px" @change="changeFloorValue"> |
|||
<i slot="prefix" class="iconfont icon-zhuangtai" /> |
|||
<el-option v-for="item in floorOptions" :key="item.key" :label="item.floorName" :value="item.id" /> |
|||
</el-select> |
|||
<el-select v-model="query.regionId" clearable size="small" placeholder="区域" class="filter-item" style="width: 180px" @change="crud.toQuery"> |
|||
<i slot="prefix" class="iconfont icon-zhuangtai" /> |
|||
<el-option v-for="item in regionOptions" :key="item.key" :label="item.regionName" :value="item.id" /> |
|||
</el-select> |
|||
<el-input v-model="query.search" clearable size="small" placeholder="输入检索条件检索" prefix-icon="el-icon-search" style="width: 220px;" class="filter-item" @clear="crud.toQuery" @keyup.enter.native="crud.toQuery" /> |
|||
<rrOperation /> |
|||
</div> |
|||
<crudOperation :permission="permission"> |
|||
<template v-slot:right> |
|||
<el-button size="mini" :loading="crud.downloadLoading" :disabled="crud.selections.length === 0" @click="handleRemoveShelf(crud.selections)"> |
|||
<i class="iconfont icon-chuku" /> |
|||
一键下架 |
|||
</el-button> |
|||
</template> |
|||
</crudOperation> |
|||
</div> |
|||
<div class="container-wrap"> |
|||
<span class="right-top-line" /> |
|||
<span class="left-bottom-line" /> |
|||
<el-table |
|||
ref="table" |
|||
v-loading="crud.loading" |
|||
class="archives-table" |
|||
:data="crud.data" |
|||
style="width: 100%;" |
|||
height="540" |
|||
@selection-change="crud.selectionChangeHandler" |
|||
@row-click="clickRowHandler" |
|||
> |
|||
<el-table-column type="selection" align="center" width="55" /> |
|||
<el-table-column prop="regionName" label="层位名称" /> |
|||
<el-table-column prop="regionCode" label="所属楼层" /> |
|||
<el-table-column prop="floorName" label="所属区域" /> |
|||
<el-table-column prop="booksheflCount" label="盘点开关" align="center"> |
|||
<!-- slot-scope="scope" --> |
|||
<template> |
|||
<span class="row-state row-binding state-active">盘点开启</span> |
|||
<!-- <span class="row-state row-lending state-active">盘点关闭</span> --> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="booksheflCount" label="有序检查" align="center"> |
|||
<!-- slot-scope="scope" --> |
|||
<template> |
|||
<span class="row-state row-binding state-active">是</span> |
|||
<!-- <span class="row-state row-lending state-active">否</span> --> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="booksheflCount" label="索书号范围" /> |
|||
<el-table-column prop="deptsStatus" label="盘点概况" min-width="340"> |
|||
<!-- slot-scope="scope" --> |
|||
<template> |
|||
<ul class="tag-list"> |
|||
<li class="blue-tag"><p>错序：</p><span><em>1</em><i class="iconfont icon-biaoqian" /></span></li> |
|||
<li class="yellow-tag"><p>错架：</p><span><em>2</em><i class="iconfont icon-biaoqian" /></span></li> |
|||
<li class="green-tag"><p>在架：</p><span><em>33</em><i class="iconfont icon-biaoqian" /></span></li> |
|||
</ul> |
|||
<!-- <span class="row-state row-binding state-active">在架</span> |
|||
<span class="row-state row-lending state-active">错架</span> |
|||
<span class="row-state row-physical state-active">错序</span> --> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="createTime" label="操作"> |
|||
<!-- slot-scope="scope" --> |
|||
<template> |
|||
<el-button>定位</el-button> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
<!--分页组件--> |
|||
<pagination v-if="crud.data.length!==0" /> |
|||
</div> |
|||
|
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { FetchLibraryFloorListAll } from '@/api/floor/index' |
|||
import { FetchRegionAllByFloor } from '@/api/area/index' |
|||
import crudRegion from '@/api/area/index' |
|||
import CRUD, { presenter, header, crud } from '@crud/crud' |
|||
import crudOperation from '@crud/CRUD.operation' |
|||
import rrOperation from '@crud/RR.operation' |
|||
import pagination from '@crud/Pagination' |
|||
import { mapGetters } from 'vuex' |
|||
// import { exportFile } from '@/utils/index' |
|||
// import qs from 'qs' |
|||
export default { |
|||
name: 'BookshelfSearch', |
|||
name: 'BookSearch', |
|||
components: { crudOperation, rrOperation, pagination }, |
|||
cruds() { |
|||
return CRUD({ title: '架位检索', url: 'api/libraryRegion/initLibraryRegionList', crudMethod: { ...crudRegion }, sort: [], optShow: { |
|||
add: false, |
|||
edit: false, |
|||
del: false, |
|||
download: false, |
|||
group: false, |
|||
reset: true |
|||
}}) |
|||
}, |
|||
mixins: [presenter(), header(), crud()], |
|||
data() { |
|||
return { |
|||
permission: { |
|||
add: ['admin', 'search:add'], |
|||
edit: ['admin', 'search:edit'], |
|||
del: ['admin', 'search:del'] |
|||
}, |
|||
floorOptions: [], |
|||
regionOptions: [] |
|||
} |
|||
}, |
|||
computed: { |
|||
...mapGetters([ |
|||
'user', |
|||
'baseApi' |
|||
]) |
|||
}, |
|||
created() { |
|||
this.getLibraryFloorListAll() |
|||
}, |
|||
methods: { |
|||
[CRUD.HOOK.beforeRefresh]() { |
|||
}, |
|||
[CRUD.HOOK.afterRefresh](crud) { |
|||
}, |
|||
// 新增前将多选的值设置为空 |
|||
[CRUD.HOOK.beforeToAdd]() { |
|||
}, // 初始化编辑时候的角色与岗位 |
|||
[CRUD.HOOK.beforeToEdit](crud, form) { |
|||
}, |
|||
[CRUD.HOOK.beforeValidateCU](crud, form) { |
|||
}, |
|||
// 提交前做的操作 |
|||
[CRUD.HOOK.afterValidateCU](crud) { |
|||
return false |
|||
}, |
|||
// 获取楼层数据 |
|||
getLibraryFloorListAll() { |
|||
FetchLibraryFloorListAll().then(res => { |
|||
this.floorOptions = res |
|||
}).catch(() => { |
|||
}) |
|||
}, |
|||
changeFloorValue(value) { |
|||
console.log(value) |
|||
this.crud.query.regionId = null |
|||
const params = { |
|||
'floorId': value |
|||
} |
|||
FetchRegionAllByFloor(params).then(res => { |
|||
this.regionOptions = res |
|||
}).catch(() => { |
|||
}) |
|||
}, |
|||
clickRowHandler(row) { |
|||
this.$refs.table.clearSelection() |
|||
this.$refs.table.toggleRowSelection(row) |
|||
}, |
|||
handleRemoveShelf(data) { |
|||
console.log(data) |
|||
this.crud.downloadLoading = true |
|||
this.$confirm('此操作将下架所选层位的所有图书' + '<span>你是否还要继续？</span>', '提示', { |
|||
confirmButtonText: '继续', |
|||
cancelButtonText: '取消', |
|||
type: 'warning', |
|||
dangerouslyUseHTMLString: true |
|||
}).then(() => { |
|||
const ids = [] |
|||
data.forEach(val => { |
|||
ids.push(val.deptsId) |
|||
}) |
|||
const params = { |
|||
'deptsIds': ids |
|||
} |
|||
console.log(params) |
|||
// exportFile(this.baseApi + '/api/depts/download?' + qs.stringify(params, { indices: false })) |
|||
// this.crud.downloadLoading = false |
|||
}).catch(() => { |
|||
this.crud.downloadLoading = false |
|||
}) |
|||
}, |
|||
handleCloseDialog() { |
|||
this.addBookShelfVisible = false |
|||
this.detailVisible = false |
|||
if (this.$refs.form) { |
|||
this.crud.cancelCU() |
|||
this.$refs.form.resetFields() |
|||
} |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
<style scoped> |
|||
|
|||
<style lang="scss" scoped> |
|||
.tag-list{ |
|||
display: flex; |
|||
justify-content: flex-start; |
|||
li{ |
|||
display: flex; |
|||
justify-content: flex-start; |
|||
align-items: center; |
|||
margin-right: 10px; |
|||
p{ |
|||
font-weight: bold; |
|||
} |
|||
span{ |
|||
display: flex; |
|||
justify-content: flex-start; |
|||
align-items: center; |
|||
font-size: 18px; |
|||
} |
|||
i{ |
|||
font-size: 22px; |
|||
} |
|||
em{ |
|||
display: inline-block; |
|||
font-style: normal; |
|||
font-weight: bold; |
|||
margin-right: 4px |
|||
} |
|||
} |
|||
.blue-tag{ |
|||
i,em{ |
|||
color: #0348F3; |
|||
} |
|||
} |
|||
.yellow-tag{ |
|||
i,em{ |
|||
color: #FF8329; |
|||
} |
|||
|
|||
} |
|||
.green-tag{ |
|||
i,em{ |
|||
color: #2ECAAC; |
|||
} |
|||
} |
|||
} |
|||
</style> |
|||
@ -1,16 +1,159 @@ |
|||
<template> |
|||
<div> |
|||
<router-view /> |
|||
<div class="app-container row-container"> |
|||
<div class="head-container"> |
|||
<div class="head-search"> |
|||
<!-- 搜索 --> |
|||
<el-select v-model="query.type" clearable size="small" placeholder="类型" class="filter-item" style="width: 120px" @change="crud.toQuery"> |
|||
<i slot="prefix" class="iconfont icon-zhuangtai" /> |
|||
<el-option v-for="item in typeOptions" :key="item.key" :label="item.display_name" :value="item.key" /> |
|||
</el-select> |
|||
<el-select v-model="query.other" clearable size="small" placeholder="方式" class="filter-item" style="width: 120px" @change="crud.toQuery"> |
|||
<i slot="prefix" class="iconfont icon-zhuangtai" /> |
|||
<el-option v-for="item in otherOptions" :key="item.key" :label="item.display_name" :value="item.key" /> |
|||
</el-select> |
|||
<el-input v-model="query.search" clearable size="small" placeholder="输入关键字搜索" prefix-icon="el-icon-search" style="width: 220px;" class="filter-item" @clear="crud.toQuery" @keyup.enter.native="crud.toQuery" /> |
|||
<rrOperation /> |
|||
</div> |
|||
<crudOperation :permission="permission"> |
|||
<template v-slot:right> |
|||
<el-button :loading="crud.downloadLoading" size="mini" @click="doExport(crud.selections)"> |
|||
<i class="iconfont icon-daochu" /> |
|||
导出 |
|||
</el-button> |
|||
</template> |
|||
</crudOperation> |
|||
</div> |
|||
<div class="container-wrap"> |
|||
<span class="right-top-line" /> |
|||
<span class="left-bottom-line" /> |
|||
<el-table |
|||
ref="table" |
|||
v-loading="crud.loading" |
|||
class="archives-table" |
|||
:data="crud.data" |
|||
style="width: 100%;" |
|||
height="590" |
|||
@selection-change="crud.selectionChangeHandler" |
|||
@row-click="clickRowHandler" |
|||
@row-dblclick="handleDbClick" |
|||
> |
|||
<el-table-column prop="regionName" label="类型" /> |
|||
<el-table-column prop="regionCode" label="方式" /> |
|||
<el-table-column prop="floorName" label="题名" /> |
|||
<el-table-column prop="booksheflCount" label="索书号" /> |
|||
<el-table-column prop="booksheflCount" label="条码" /> |
|||
<el-table-column prop="booksheflCount" label="目标层位" /> |
|||
<el-table-column prop="booksheflCount" label="盘点单号" /> |
|||
<el-table-column prop="booksheflCount" label="操作者" /> |
|||
<el-table-column prop="createTime" label="操作时间"> |
|||
<template slot-scope="scope"> |
|||
<div>{{ scope.row.createTime | parseTime }}</div> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
<!--分页组件--> |
|||
<pagination v-if="crud.data.length!==0" /> |
|||
</div> |
|||
|
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import crudRegion from '@/api/area/index' |
|||
import CRUD, { presenter, header, form, crud } from '@crud/crud' |
|||
import crudOperation from '@crud/CRUD.operation' |
|||
import rrOperation from '@crud/RR.operation' |
|||
import pagination from '@crud/Pagination' |
|||
import { mapGetters } from 'vuex' |
|||
// import { exportFile } from '@/utils/index' |
|||
// import qs from 'qs' |
|||
|
|||
const defaultForm = { id: null, taskType: null, taskName: null, location: null, number: null, remark: null } |
|||
export default { |
|||
name: 'CheckManage', |
|||
name: 'UpDownLog', |
|||
components: { crudOperation, rrOperation, pagination }, |
|||
cruds() { |
|||
return CRUD({ title: '上架/下架日志', url: 'api/libraryRegion/initLibraryRegionList', crudMethod: { ...crudRegion }, sort: [], optShow: { |
|||
add: false, |
|||
edit: false, |
|||
del: false, |
|||
download: false, |
|||
group: false, |
|||
reset: false |
|||
}}) |
|||
}, |
|||
mixins: [presenter(), header(), form(defaultForm), crud()], |
|||
data() { |
|||
return { |
|||
otherOptions: [ |
|||
{ key: '1', display_name: '自动' }, |
|||
{ key: '2', display_name: '手动' } |
|||
], |
|||
typeOptions: [ |
|||
{ key: '1', display_name: '上架' }, |
|||
{ key: '2', display_name: '下架' } |
|||
], |
|||
permission: { |
|||
add: ['admin', 'checkLog:add'], |
|||
edit: ['admin', 'checkLog:edit'], |
|||
del: ['admin', 'checkLog:del'] |
|||
} |
|||
} |
|||
}, |
|||
computed: { |
|||
...mapGetters([ |
|||
'user', |
|||
'baseApi' |
|||
]) |
|||
}, |
|||
methods: { |
|||
[CRUD.HOOK.beforeRefresh]() { |
|||
}, |
|||
[CRUD.HOOK.afterRefresh](crud) { |
|||
}, |
|||
// 新增前将多选的值设置为空 |
|||
[CRUD.HOOK.beforeToAdd]() { |
|||
}, // 初始化编辑时候的角色与岗位 |
|||
[CRUD.HOOK.beforeToEdit](crud, form) { |
|||
}, |
|||
[CRUD.HOOK.beforeValidateCU](crud, form) { |
|||
}, |
|||
// 提交前做的操作 |
|||
[CRUD.HOOK.afterValidateCU](crud) { |
|||
return false |
|||
}, |
|||
clickRowHandler(row) { |
|||
this.$refs.table.clearSelection() |
|||
this.$refs.table.toggleRowSelection(row) |
|||
}, |
|||
doExport(data) { |
|||
console.log(data) |
|||
this.crud.downloadLoading = true |
|||
this.$confirm('此操作将导出所选数据' + '<span>你是否还要继续？</span>', '提示', { |
|||
confirmButtonText: '继续', |
|||
cancelButtonText: '取消', |
|||
type: 'warning', |
|||
dangerouslyUseHTMLString: true |
|||
}).then(() => { |
|||
const ids = [] |
|||
data.forEach(val => { |
|||
ids.push(val.deptsId) |
|||
}) |
|||
const params = { |
|||
'deptsIds': ids |
|||
} |
|||
console.log(params) |
|||
// exportFile(this.baseApi + '/api/depts/download?' + qs.stringify(params, { indices: false })) |
|||
// this.crud.downloadLoading = false |
|||
}).catch(() => { |
|||
}) |
|||
}, |
|||
handleCloseDialog() { |
|||
|
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
<style scoped> |
|||
|
|||
<style lang="scss" scoped> |
|||
</style> |
|||
Write
Preview
Loading…
Cancel
Save
Reference in new issue