|
|
@@ -22,39 +22,80 @@
|
|
|
</el-descriptions-item>
|
|
|
<el-descriptions-item :span="2">
|
|
|
<template slot="label"> 分类 </template>
|
|
|
- {{information.categoryLevelPath}}
|
|
|
+ {{ information.categoryLevelPath }}
|
|
|
</el-descriptions-item>
|
|
|
<el-descriptions-item>
|
|
|
<template slot="label"> 长/宽/高(mm) </template>
|
|
|
- {{information.extendField.length}}/{{information.extendField.width}}/{{information.extendField.high}}
|
|
|
+ {{ information.extendField.length }}/{{
|
|
|
+ information.extendField.width
|
|
|
+ }}/{{ information.extendField.high }}
|
|
|
</el-descriptions-item>
|
|
|
<el-descriptions-item>
|
|
|
<template slot="label"> 计量单位</template>
|
|
|
- {{information.measuringUnit}}
|
|
|
+ {{ information.measuringUnit }}
|
|
|
</el-descriptions-item>
|
|
|
</el-descriptions>
|
|
|
<div class="basic-details-title border-none">
|
|
|
<span class="border-span">舟皿明细</span>
|
|
|
</div>
|
|
|
<div>
|
|
|
- <el-tabs v-model="activeName" type="card" @tab-click="tabClick" class="basic-tab">
|
|
|
- <el-tab-pane :label="`在用(${countInfo.inUseSum?countInfo.inUseSum:'0'})`" name="inUse" >
|
|
|
- </el-tab-pane>
|
|
|
- <el-tab-pane :label="`在库(${countInfo.inLibrarySum?countInfo.inLibrarySum:'0'})`" name="inLibrary">
|
|
|
- </el-tab-pane>
|
|
|
- <el-tab-pane :label="`消耗(${countInfo.consumeSum?countInfo.consumeSum:'0'})`" name="hasConsume">
|
|
|
- </el-tab-pane>
|
|
|
+ <el-tabs
|
|
|
+ v-model="activeName"
|
|
|
+ type="card"
|
|
|
+ @tab-click="tabClick"
|
|
|
+ class="basic-tab"
|
|
|
+ >
|
|
|
+ <el-tab-pane
|
|
|
+ :label="`在用(${countInfo.inUseSum ? countInfo.inUseSum : '0'})`"
|
|
|
+ name="inUse"
|
|
|
+ >
|
|
|
+ </el-tab-pane>
|
|
|
+ <el-tab-pane
|
|
|
+ :label="`在库(${
|
|
|
+ countInfo.inLibrarySum ? countInfo.inLibrarySum : '0'
|
|
|
+ })`"
|
|
|
+ name="inLibrary"
|
|
|
+ >
|
|
|
+ </el-tab-pane>
|
|
|
+ <el-tab-pane
|
|
|
+ :label="`消耗(${countInfo.consumeSum ? countInfo.consumeSum : '0'})`"
|
|
|
+ name="hasConsume"
|
|
|
+ >
|
|
|
+ </el-tab-pane>
|
|
|
</el-tabs>
|
|
|
- <el-table :data="tableData" class="table-box"
|
|
|
- :header-cell-style="{ background: '#F0F3F3', border: 'none'}"
|
|
|
+ <el-table
|
|
|
+ :data="tableData"
|
|
|
+ class="table-box"
|
|
|
+ :header-cell-style="{ background: '#F0F3F3', border: 'none' }"
|
|
|
>
|
|
|
- <el-table-column type="index" label="序号" width="100"> </el-table-column>
|
|
|
- <el-table-column prop="code" label="编码" > </el-table-column>
|
|
|
- <el-table-column prop="name" label="名称" > </el-table-column>
|
|
|
- <el-table-column prop="inCode" label="入库单号" v-if="activeName=='inLibrary'"> </el-table-column>
|
|
|
- <el-table-column prop="inTime" label="入库时间" v-if="activeName=='inLibrary'"> </el-table-column>
|
|
|
- <el-table-column prop="outCode" label="出库单号" v-if="activeName!='inLibrary'"> </el-table-column>
|
|
|
- <el-table-column prop="outTime" label="出库时间" v-if="activeName!='inLibrary'"> </el-table-column>
|
|
|
+ <el-table-column type="index" label="序号" width="100">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="code" label="编码"> </el-table-column>
|
|
|
+ <el-table-column prop="name" label="名称"> </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="inCode"
|
|
|
+ label="入库单号"
|
|
|
+ v-if="activeName == 'inLibrary'"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="inTime"
|
|
|
+ label="入库时间"
|
|
|
+ v-if="activeName == 'inLibrary'"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="outCode"
|
|
|
+ label="出库单号"
|
|
|
+ v-if="activeName != 'inLibrary'"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="outTime"
|
|
|
+ label="出库时间"
|
|
|
+ v-if="activeName != 'inLibrary'"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
</el-table>
|
|
|
<div class="pagination">
|
|
|
<el-pagination
|
|
|
@@ -74,170 +115,166 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
- import {
|
|
|
- getCategoryInfo,
|
|
|
- getPageSingle
|
|
|
- } from '@/api/ledgerAssets/boat.js';
|
|
|
-export default {
|
|
|
- props: {
|
|
|
- rowId:{
|
|
|
- type:String ,
|
|
|
- default:''
|
|
|
+ import { getCategoryInfo, getPageSingle } from '@/api/ledgerAssets';
|
|
|
+ export default {
|
|
|
+ props: {
|
|
|
+ rowId: {
|
|
|
+ type: String,
|
|
|
+ default: ''
|
|
|
+ }
|
|
|
},
|
|
|
- },
|
|
|
- data () {
|
|
|
- return {
|
|
|
- information:{
|
|
|
- extendField:{}
|
|
|
- },
|
|
|
- activeName:'inUse',
|
|
|
- tableData:[],
|
|
|
- pagination: {
|
|
|
- pageNum: 1,
|
|
|
- size: 15
|
|
|
- },
|
|
|
- total: 0,
|
|
|
- searchForm:{
|
|
|
- categoryId:this.rowId,
|
|
|
- positionType:1
|
|
|
- },
|
|
|
- countInfo:{}
|
|
|
-
|
|
|
- }
|
|
|
- },
|
|
|
- created () {
|
|
|
- this.getDetilInfo()
|
|
|
- this.handleList()
|
|
|
- // this.getCountNum()
|
|
|
- },
|
|
|
- methods:{
|
|
|
- getDetilInfo(){
|
|
|
- getCategoryInfo(this.rowId).then(res=>{
|
|
|
- this.information = res.data
|
|
|
- if(res.data.extendField){
|
|
|
- this.$set(this.information, 'extendField', JSON.parse(res.data.extendField))
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ information: {
|
|
|
+ extendField: {}
|
|
|
+ },
|
|
|
+ activeName: 'inUse',
|
|
|
+ tableData: [],
|
|
|
+ pagination: {
|
|
|
+ pageNum: 1,
|
|
|
+ size: 15
|
|
|
+ },
|
|
|
+ total: 0,
|
|
|
+ searchForm: {
|
|
|
+ categoryId: this.rowId,
|
|
|
+ positionType: 1
|
|
|
+ },
|
|
|
+ countInfo: {}
|
|
|
+ };
|
|
|
+ },
|
|
|
+ created () {
|
|
|
+ this.getDetilInfo();
|
|
|
+ this.handleList();
|
|
|
+ // this.getCountNum()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ getDetilInfo () {
|
|
|
+ getCategoryInfo(this.rowId).then((res) => {
|
|
|
+ this.information = res.data;
|
|
|
+ if (res.data.extendField) {
|
|
|
+ this.$set(
|
|
|
+ this.information,
|
|
|
+ 'extendField',
|
|
|
+ JSON.parse(res.data.extendField)
|
|
|
+ );
|
|
|
}
|
|
|
- })
|
|
|
- },
|
|
|
- tabClick(val){
|
|
|
+ });
|
|
|
+ },
|
|
|
+ tabClick (val) {
|
|
|
switch (this.activeName) {
|
|
|
case 'inUse': {
|
|
|
- this.searchForm.positionType = 1
|
|
|
+ this.searchForm.positionType = 1;
|
|
|
break;
|
|
|
}
|
|
|
case 'inLibrary': {
|
|
|
- this.searchForm.positionType = 2
|
|
|
+ this.searchForm.positionType = 2;
|
|
|
break;
|
|
|
}
|
|
|
case 'hasConsume': {
|
|
|
- this.searchForm.positionType = 3
|
|
|
+ this.searchForm.positionType = 3;
|
|
|
break;
|
|
|
}
|
|
|
default:
|
|
|
break;
|
|
|
}
|
|
|
- this.handleList()
|
|
|
- },
|
|
|
+ this.handleList();
|
|
|
+ },
|
|
|
|
|
|
- handleCurrent (page) {
|
|
|
- this.pagination.pageNum = page
|
|
|
- this.handleList()
|
|
|
- },
|
|
|
- handleSize (size) {
|
|
|
- this.pagination.pageNum = 1
|
|
|
- this.pagination.size = size
|
|
|
- this.handleList()
|
|
|
- },
|
|
|
+ handleCurrent (page) {
|
|
|
+ this.pagination.pageNum = page;
|
|
|
+ this.handleList();
|
|
|
+ },
|
|
|
+ handleSize (size) {
|
|
|
+ this.pagination.pageNum = 1;
|
|
|
+ this.pagination.size = size;
|
|
|
+ this.handleList();
|
|
|
+ },
|
|
|
|
|
|
handleList () {
|
|
|
- const params = {
|
|
|
- ...this.searchForm,
|
|
|
- ...this.pagination
|
|
|
- }
|
|
|
- getPageSingle(params).then(res=>{
|
|
|
- this.tableData = res.list
|
|
|
- this.total = res.count
|
|
|
- })
|
|
|
-
|
|
|
+ const params = {
|
|
|
+ ...this.searchForm,
|
|
|
+ ...this.pagination
|
|
|
+ };
|
|
|
+ getPageSingle(params).then((res) => {
|
|
|
+ this.tableData = res.list;
|
|
|
+ this.total = res.count;
|
|
|
+ });
|
|
|
},
|
|
|
|
|
|
- getCountNum(){
|
|
|
- const params = {
|
|
|
- assetType:'ZHOUMIN',
|
|
|
- informationId:this.rowInfo.id
|
|
|
- }
|
|
|
- getCount(params).then(res=>{
|
|
|
- if(res?.success){
|
|
|
- this.countInfo = res.data
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- },
|
|
|
-
|
|
|
- watch:{
|
|
|
- // 监听类别id变化
|
|
|
- // rowId() {
|
|
|
- // this.getDetilInfo()
|
|
|
- // }
|
|
|
- },
|
|
|
+ getCountNum () {
|
|
|
+ const params = {
|
|
|
+ assetType: 'ZHOUMIN',
|
|
|
+ informationId: this.rowInfo.id
|
|
|
+ };
|
|
|
+ getCount(params).then((res) => {
|
|
|
+ if (res?.success) {
|
|
|
+ this.countInfo = res.data;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
|
|
|
-}
|
|
|
+ watch: {
|
|
|
+ // 监听类别id变化
|
|
|
+ // rowId() {
|
|
|
+ // this.getDetilInfo()
|
|
|
+ // }
|
|
|
+ }
|
|
|
+ };
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
- .baseinfo-container {
|
|
|
+ .baseinfo-container {
|
|
|
background-color: #fff;
|
|
|
padding: 20px;
|
|
|
.content {
|
|
|
padding: 0 20px;
|
|
|
}
|
|
|
- .basic-details-title{
|
|
|
- font-size: 16px;
|
|
|
- margin: 15px 0;
|
|
|
- }
|
|
|
- .basic-tab{
|
|
|
- margin-bottom: 15px;
|
|
|
- }
|
|
|
- .upload-container {
|
|
|
- display: flex;
|
|
|
- .img-box {
|
|
|
- width: 280px;
|
|
|
- height: 342px;
|
|
|
- border: 1px solid rgba(215, 215, 215, 1);
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- img {
|
|
|
- max-width: 100%;
|
|
|
- }
|
|
|
+ .basic-details-title {
|
|
|
+ font-size: 16px;
|
|
|
+ margin: 15px 0;
|
|
|
}
|
|
|
- .file-list {
|
|
|
- margin-left: 50px;
|
|
|
- flex: 1;
|
|
|
+ .basic-tab {
|
|
|
+ margin-bottom: 15px;
|
|
|
+ }
|
|
|
+ .upload-container {
|
|
|
display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- flex-wrap: wrap;
|
|
|
- justify-items: baseline;
|
|
|
- align-content: flex-start;
|
|
|
- .file-box {
|
|
|
- width: 30%;
|
|
|
- margin-bottom: 20px;
|
|
|
- height: 57px;
|
|
|
- text-align: center;
|
|
|
- line-height: 55px;
|
|
|
- border: 1px solid var(--mainColor);
|
|
|
- color: var(--mainColor);
|
|
|
- cursor: pointer;
|
|
|
+ .img-box {
|
|
|
+ width: 280px;
|
|
|
+ height: 342px;
|
|
|
+ border: 1px solid rgba(215, 215, 215, 1);
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ img {
|
|
|
+ max-width: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .file-list {
|
|
|
+ margin-left: 50px;
|
|
|
+ flex: 1;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ justify-items: baseline;
|
|
|
+ align-content: flex-start;
|
|
|
+ .file-box {
|
|
|
+ width: 30%;
|
|
|
+ margin-bottom: 20px;
|
|
|
+ height: 57px;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 55px;
|
|
|
+ border: 1px solid var(--mainColor);
|
|
|
+ color: var(--mainColor);
|
|
|
+ cursor: pointer;
|
|
|
|
|
|
- &.disabled {
|
|
|
- cursor: not-allowed;
|
|
|
- border-color: rgba(215, 215, 215, 1);
|
|
|
- color: rgba(215, 215, 215, 1);
|
|
|
+ &.disabled {
|
|
|
+ cursor: not-allowed;
|
|
|
+ border-color: rgba(215, 215, 215, 1);
|
|
|
+ color: rgba(215, 215, 215, 1);
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-}
|
|
|
</style>
|