6 changed files with 714 additions and 169 deletions
-
2public/static/config.js
-
13src/api/asset/index.js
-
491src/views/assetManage/inOutLog/index.vue
-
207src/views/assetManage/inventory/index.vue
-
27src/views/dashboard/PanelGroup.vue
-
121src/views/home.vue
@ -1,5 +1,5 @@ |
|||
window.g = { |
|||
AXIOS_TIMEOUT: 10000, |
|||
ApiUrl: 'http://192.168.99.72:15000', // 配置服务器地址
|
|||
ApiUrl: 'http://172.17.162.10:15000', // 配置服务器地址
|
|||
ApiWebRtcServerUrl: '127.0.0.1:8000', // 配置监控视频服务器地址
|
|||
} |
|||
@ -0,0 +1,491 @@ |
|||
<template> |
|||
<div class="app-container row-container"> |
|||
<div class="head-container"> |
|||
<div v-if="crud.props.searchToggle" class="head-search"> |
|||
<!-- 搜索 --> |
|||
<el-input |
|||
v-model="keyWord" |
|||
size="small" |
|||
clearable |
|||
placeholder="请输入出入库单号搜索" |
|||
style="width: 300px;" |
|||
class="input-prepend filter-item" |
|||
@clear="crud.toQuery" |
|||
@keyup.enter.native="crud.toQuery" |
|||
> |
|||
<el-select slot="prepend" v-model="optionVal" style="width: 92px" @change="searchChange"> |
|||
<el-option |
|||
v-for="item in options" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
/> |
|||
</el-select> |
|||
</el-input> |
|||
<el-select v-model="query.status" 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 statusOptions" :key="item.value" :label="item.label" :value="item.value" /> |
|||
</el-select> |
|||
<el-button class="filter-item filter-search" size="mini" type="success" icon="el-icon-search" @click="crud.toQuery">搜索</el-button> |
|||
<el-button class="filter-item filter-refresh" size="mini" type="warning" icon="el-icon-refresh-left" @click="resetQuery()">重置</el-button> |
|||
</div> |
|||
<crudOperation :permission="permission"> |
|||
<template v-slot:middle> |
|||
<el-button :loading="crud.downloadLoading" size="mini" :disabled="crud.selections.length === 0" @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" |
|||
highlight-current-row |
|||
stripe |
|||
style="width: 100%;" |
|||
height="calc(100vh - 330px)" |
|||
:data="crud.data" |
|||
@selection-change="crud.selectionChangeHandler" |
|||
@row-click="clickRowHandler" |
|||
@row-dblclick="handleRowDblClick" |
|||
> |
|||
<!-- <el-table-column type="selection" align="center" width="55" /> --> |
|||
<el-table-column prop="type" label="类型" /> |
|||
<el-table-column prop="billNo" label="任务单号" min-width="180px" :show-overflow-tooltip="true" /> |
|||
<el-table-column prop="warehouseName" label="所属市州" /> |
|||
<el-table-column prop="stockNum" label="关联单号" /> |
|||
<el-table-column prop="stockNum" label="申请人" /> |
|||
<el-table-column prop="stockNum" label="申请部门" /> |
|||
<el-table-column prop="takeDate" label="创建时间" width="150px"> |
|||
<template slot-scope="scope"> |
|||
<div>{{ scope.row.takeDate | parseTime }}</div> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="takeStart" label="入库开始时间" width="150px"> |
|||
<template slot-scope="scope"> |
|||
<div>{{ scope.row.takeStart | parseTime }}</div> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="takeEnd" label="入库结束时间" width="150px"> |
|||
<template slot-scope="scope"> |
|||
<div>{{ scope.row.takeEnd | parseTime }}</div> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="stockNum" label="总金额" /> |
|||
<el-table-column prop="stockNum" label="总数量" /> |
|||
<el-table-column prop="stockNum" label="异常数量" /> |
|||
<el-table-column prop="status" label="状态" align="center" min-width="100px"> |
|||
<template slot-scope="scope"> |
|||
<span v-if="(scope.row.status || '').toString().trim() === '0'" class="row-state row-lending ">未盘点</span> |
|||
<span v-if="(scope.row.status || '').toString().trim() === '-1'" class="row-state row-lending state-active">已终止</span> |
|||
<span v-if="(scope.row.status || '').toString().trim() === '1'" class="row-state row-warehousing state-active">盘点中</span> |
|||
<span v-if="(scope.row.status || '').toString().trim() === '2'" class="row-state row-binding state-active">已完成</span> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
<!--分页组件--> |
|||
<pagination v-if="crud.data.length!==0" /> |
|||
</div> |
|||
|
|||
<!--详情对话框 --> |
|||
<el-dialog |
|||
class="inventory-detail-dialog" |
|||
:visible.sync="detailDialogVisible" |
|||
title="入库/出库详情" |
|||
width="1000px" |
|||
append-to-body |
|||
:close-on-click-modal="false" |
|||
:modal-append-to-body="false" |
|||
> |
|||
<div v-if="selectedTask" class="task-detail"> |
|||
<!-- 任务基本信息 --> |
|||
<el-table class="archives-table" stripe style="width: 100%;" :data="selectedTask"> |
|||
<el-table-column prop="type" label="类型" /> |
|||
<el-table-column prop="billNo" label="任务单号" min-width="180px" :show-overflow-tooltip="true" /> |
|||
<el-table-column prop="warehouseName" label="所属市州" /> |
|||
<el-table-column prop="stockNum" label="关联单号" /> |
|||
<el-table-column prop="stockNum" label="申请人" /> |
|||
<el-table-column prop="stockNum" label="申请部门" /> |
|||
<el-table-column prop="takeDate" label="创建时间" width="150px"> |
|||
<template slot-scope="scope"> |
|||
<div>{{ scope.row.takeDate | parseTime }}</div> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="takeStart" label="入库开始时间" width="150px"> |
|||
<template slot-scope="scope"> |
|||
<div>{{ scope.row.takeStart | parseTime }}</div> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="takeEnd" label="入库结束时间" width="150px"> |
|||
<template slot-scope="scope"> |
|||
<div>{{ scope.row.takeEnd | parseTime }}</div> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="stockNum" label="总金额" /> |
|||
<el-table-column prop="stockNum" label="总数量" /> |
|||
<el-table-column prop="stockNum" label="异常数量" /> |
|||
<el-table-column prop="status" label="状态" align="center" min-width="100px"> |
|||
<template slot-scope="scope"> |
|||
<span v-if="(scope.row.status || '').toString().trim() === '0'" class="row-state row-lending ">未盘点</span> |
|||
<span v-if="(scope.row.status || '').toString().trim() === '-1'" class="row-state row-lending state-active">已终止</span> |
|||
<span v-if="(scope.row.status || '').toString().trim() === '1'" class="row-state row-warehousing state-active">盘点中</span> |
|||
<span v-if="(scope.row.status || '').toString().trim() === '2'" class="row-state row-binding state-active">已完成</span> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
|
|||
<!-- 盘点清单 --> |
|||
<div class="inventory-list"> |
|||
<h3>明细列表</h3> |
|||
<el-table v-loading="inventoryLoading" stripe style="width: 100%;" height="calc(100vh - 460px)" :data="inventoryList"> |
|||
<el-table-column label="序号" align="center" width="55"> |
|||
<template slot-scope="scope"> |
|||
{{ (inventoryPage - 1) * inventoryPageSize + scope.$index + 1 }} |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="taskResult" label="结果"> |
|||
<template slot-scope="scope"> |
|||
<el-tag v-if="scope.row.taskResult === 0">未盘</el-tag> |
|||
<el-tag v-if="scope.row.taskResult === 1" type="success">正常</el-tag> |
|||
<el-tag v-if="scope.row.taskResult === 2" type="error">盘亏</el-tag> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="assetMark" label="资产编码" min-width="220px" :show-overflow-tooltip="true" /> |
|||
<el-table-column prop="assetName" label="资产名称" min-width="180px" :show-overflow-tooltip="true" /> |
|||
<el-table-column prop="taskRemark" label="盘点备注" min-width="100px" /> |
|||
<el-table-column prop="capitalStatus" label="资产状态" min-width="100px" /> |
|||
<el-table-column prop="capitaltypename" label="资产类型" min-width="100px" /> |
|||
<el-table-column prop="departmentname" label="使用部门" min-width="260px" :show-overflow-tooltip="true" /> |
|||
<el-table-column prop="resourcename" label="使用人" min-width="100px" /> |
|||
<el-table-column prop="glrname" label="管理人" min-width="100px" /> |
|||
<el-table-column prop="cfd" label="存放地" min-width="260px" :show-overflow-tooltip="true" /> |
|||
</el-table> |
|||
<div style="margin-top: 10px; display: flex; justify-content: flex-end;"> |
|||
<el-pagination |
|||
:current-page="inventoryPage" |
|||
:page-sizes="[10, 20, 50, 100]" |
|||
:page-size="inventoryPageSize" |
|||
layout="total, sizes, prev, pager, next" |
|||
:total="inventoryTotal" |
|||
style="margin: 20px 0 !important;" |
|||
@size-change="handleInventorySizeChange" |
|||
@current-change="handleInventoryCurrentChange" |
|||
/> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div v-else> |
|||
暂无数据 |
|||
</div> |
|||
</el-dialog> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import crudAsset, { FetchInitAssetInfo, FetchStockTakeDetailsByTaskId } from '@/api/asset/index' |
|||
import CRUD, { presenter, header, form, crud } from '@crud/crud' |
|||
import crudOperation from '@crud/CRUD.operation' |
|||
import pagination from '@crud/Pagination' |
|||
import { exportFile } from '@/utils/index' |
|||
import qs from 'qs' |
|||
import { mapGetters } from 'vuex' |
|||
|
|||
const defaultForm = { } |
|||
export default { |
|||
name: 'InOutLog', |
|||
components: { pagination, crudOperation }, |
|||
cruds() { |
|||
return CRUD({ title: '出入库日志', url: 'api/stocktake/initStockTakeBill', crudMethod: { ...crudAsset }, optShow: { |
|||
add: false, |
|||
edit: false, |
|||
del: false, |
|||
reset: true, |
|||
download: false, |
|||
group: false |
|||
}}) |
|||
}, |
|||
mixins: [presenter(), header(), form(defaultForm), crud()], |
|||
data() { |
|||
return { |
|||
permission: { add: [], edit: [], del: [] }, |
|||
keyWord: '', |
|||
optionVal: '', |
|||
options: [ |
|||
{ value: '', label: '全部' }, |
|||
{ value: 'billNo', label: '入库' }, |
|||
{ value: 'departmentname', label: '出库' } |
|||
], |
|||
fetchLoading: false, |
|||
showFilterList: false, |
|||
listTable: [], |
|||
totalAssets: 0, |
|||
currentPage: 1, |
|||
pageSize: 10, |
|||
detailDialogVisible: false, |
|||
selectedTask: [], |
|||
inventoryList: [], |
|||
inventoryLoading: false, |
|||
inventoryPage: 1, |
|||
inventoryPageSize: 10, |
|||
inventoryTotal: 0, |
|||
statusOptions: [ |
|||
{ value: 0, label: '未完成' }, |
|||
{ value: 1, label: '执行中' }, |
|||
{ value: 2, label: '已完成' } |
|||
], |
|||
query: { |
|||
status: '' |
|||
} |
|||
} |
|||
}, |
|||
computed: { |
|||
...mapGetters([ |
|||
'baseApi' |
|||
]), |
|||
hasAssets() { |
|||
return this.totalAssets > 0 |
|||
} |
|||
}, |
|||
created() { |
|||
}, |
|||
mounted() { |
|||
}, |
|||
methods: { |
|||
[CRUD.HOOK.beforeRefresh]() { |
|||
// 传递搜索参数 |
|||
this.crud.query[this.optionVal] = this.keyWord |
|||
// this.crud.params.billNo = this.query.billNo |
|||
// this.crud.params.warehouseId = this.query.warehouseId |
|||
this.crud.params.status = this.query.status |
|||
|
|||
// 保存原始参数 |
|||
this.originalPage = this.crud.page.page |
|||
this.originalSize = this.crud.page.size |
|||
// 添加pageNo和pageSize参数 |
|||
this.crud.params.pageNo = this.crud.page.page |
|||
this.crud.params.pageSize = this.crud.page.size |
|||
// 清空page和size参数 |
|||
this.crud.params.page = undefined |
|||
this.crud.params.size = undefined |
|||
}, |
|||
[CRUD.HOOK.afterRefresh]() { |
|||
// 恢复原始参数 |
|||
if (this.originalPage !== undefined) { |
|||
this.crud.page.page = this.originalPage |
|||
this.crud.page.size = this.originalSize |
|||
// 移除pageNo和pageSize参数 |
|||
delete this.crud.params.pageNo |
|||
delete this.crud.params.pageSize |
|||
delete this.crud.params.page |
|||
delete this.crud.params.size |
|||
} |
|||
}, |
|||
// 新增前 |
|||
[CRUD.HOOK.beforeToAdd](crud, form) { |
|||
}, |
|||
// 编辑前 |
|||
[CRUD.HOOK.beforeToEdit](crud, form) { |
|||
}, |
|||
// 提交前做的操作 |
|||
[CRUD.HOOK.afterValidateCU](crud) { |
|||
console.log(crud.form) |
|||
return true |
|||
}, |
|||
// 关闭弹框前的操作 |
|||
[CRUD.HOOK.beforeAddCancel](crud) { |
|||
}, |
|||
searchChange(val) { |
|||
if (val) { |
|||
this.keyWord = '' |
|||
this.options.forEach(option => { |
|||
if (option.value !== val) { |
|||
this.crud.query[option.value] = null |
|||
} |
|||
}) |
|||
} |
|||
}, |
|||
resetQuery() { |
|||
this.keyWord = '' |
|||
this.crud.query[this.optionVal] = this.keyWord |
|||
this.query.status = '' |
|||
this.crud.toQuery() |
|||
}, |
|||
// 触发单选 |
|||
clickRowHandler(row) { |
|||
this.$refs.table.clearSelection() |
|||
this.$refs.table.toggleRowSelection(row) |
|||
}, |
|||
doExport(data) { |
|||
crud.downloadLoading = true |
|||
this.$confirm('此操作将导出所选数据' + '<span>你是否还要继续？</span>', '提示', { |
|||
confirmButtonText: '继续', |
|||
cancelButtonText: '取消', |
|||
type: 'warning', |
|||
dangerouslyUseHTMLString: true |
|||
}).then(() => { |
|||
const ids = [] |
|||
data.forEach(val => { |
|||
ids.push(val.fondsId) |
|||
}) |
|||
const params = { |
|||
'fondsIds': ids |
|||
} |
|||
exportFile(this.baseApi + '/api/fonds/download?' + qs.stringify(params, { indices: false })) |
|||
}).catch(() => { |
|||
}) |
|||
}, |
|||
// 获取资产数据 |
|||
fetchAssetsData(isBtn) { |
|||
this.$refs.form.validate((valid) => { |
|||
if (valid) { |
|||
if (isBtn) { |
|||
this.fetchLoading = true |
|||
} |
|||
|
|||
this.showFilterList = true |
|||
const params = { |
|||
'departmentname': this.crud.form.departmentname, |
|||
'pageNo': this.currentPage, |
|||
'pageSize': this.pageSize |
|||
} |
|||
FetchInitAssetInfo(params).then(res => { |
|||
console.log('res', res) |
|||
this.listTable = res.records |
|||
this.totalAssets = res.total |
|||
this.fetchLoading = false |
|||
}).catch(err => { |
|||
console.log(err) |
|||
this.$message({ message: '获取数据失败', type: 'error', offset: 8 }) |
|||
this.fetchLoading = false |
|||
}) |
|||
} else { |
|||
return false |
|||
} |
|||
}) |
|||
}, |
|||
// 处理双击行事件 |
|||
handleRowDblClick(row) { |
|||
this.selectedTask = [] |
|||
this.selectedTask.push(row) |
|||
this.detailDialogVisible = true |
|||
this.inventoryPage = 1 |
|||
this.inventoryPageSize = 10 |
|||
// 获取盘点清单数据 |
|||
this.fetchInventoryList() |
|||
}, |
|||
// 获取盘点清单数据 |
|||
fetchInventoryList() { |
|||
if (!this.selectedTask) return |
|||
|
|||
this.inventoryLoading = true |
|||
const params = { |
|||
'taskId': this.selectedTask[0].id, |
|||
'pageNo': this.inventoryPage, |
|||
'pageSize': this.inventoryPageSize |
|||
} |
|||
FetchStockTakeDetailsByTaskId(params).then(res => { |
|||
console.log('FetchStockTakeDetailsByTaskId', res) |
|||
this.inventoryList = res.records |
|||
this.inventoryTotal = res.total |
|||
this.inventoryLoading = false |
|||
}).catch(err => { |
|||
console.log(err) |
|||
this.$message({ message: '获取数据失败', type: 'error', offset: 8 }) |
|||
this.inventoryLoading = false |
|||
}) |
|||
}, |
|||
// 处理盘点清单分页大小变化 |
|||
handleInventorySizeChange(size) { |
|||
this.inventoryPage = 1 |
|||
this.inventoryPageSize = size |
|||
this.fetchInventoryList() |
|||
}, |
|||
// 处理盘点清单当前页码变化 |
|||
handleInventoryCurrentChange(current) { |
|||
this.inventoryPage = current |
|||
this.fetchInventoryList() |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.group-form{ |
|||
.el-form-item{ |
|||
&:nth-child(odd){ |
|||
margin-right: 0; |
|||
} |
|||
&.form-item-style{ |
|||
margin-right: 40px; |
|||
} |
|||
::v-deep .el-form-item__content{ |
|||
width: 300px !important; |
|||
} |
|||
} |
|||
} |
|||
|
|||
::v-deep .input-prepend .el-input__inner{ |
|||
padding-left: 100px; |
|||
} |
|||
|
|||
::v-deep .el-tag{ |
|||
&.el-tag--small{ |
|||
color: #0348f3 !important; |
|||
background-color: #eef5fe !important; |
|||
border-color: #c1dbfc !important; |
|||
} |
|||
&.el-tag--success { |
|||
background-color: #e7faf0 !important; |
|||
border-color: #d0f5e0!important; |
|||
color: #13ce66!important; |
|||
} |
|||
&.el-tag--info { |
|||
background-color: #f4f4f5 !important; |
|||
border-color: #f4f4f5!important; |
|||
color: #909399!important; |
|||
} |
|||
&.el-tag--error { |
|||
background-color: #fbc0b5 !important; |
|||
border-color: #fcab9d !important; |
|||
color: #ed4a41!important; |
|||
} |
|||
} |
|||
|
|||
.task-detail { |
|||
padding: 10px 0; |
|||
} |
|||
|
|||
.task-info { |
|||
margin-bottom: 20px; |
|||
} |
|||
|
|||
.task-info h3, |
|||
.inventory-list h3 { |
|||
margin-bottom: 10px; |
|||
font-size: 16px; |
|||
font-weight: bold; |
|||
color: #333; |
|||
} |
|||
|
|||
.inventory-list { |
|||
margin-top: 30px; |
|||
} |
|||
|
|||
.inventory-list .el-table { |
|||
margin-top: 10px; |
|||
} |
|||
|
|||
.inventory-detail-dialog{ |
|||
::v-deep .el-dialog__body{ |
|||
padding: 0 !important; |
|||
} |
|||
} |
|||
.el-table .el-button{ |
|||
padding: 7px 10px !important; |
|||
} |
|||
</style> |
|||
Write
Preview
Loading…
Cancel
Save
Reference in new issue