parent
e748f683e7
commit
9f5630574b
@ -0,0 +1,109 @@
|
||||
<template>
|
||||
<div class="asset-flow-div">
|
||||
<vue-scroll v-if="!showLoading && assetList.length > 0" :ops="listScroll" style="height:25rem">
|
||||
<div :class="index%2 == 0?'position-left':'position-right'" v-for="item,index in assetList" :key="item.asset_code + '-' + index">
|
||||
<AssetItem :position="index%2 == 0?'left':'right'" :itemData="item"/>
|
||||
</div>
|
||||
<div class="show-more-div">
|
||||
<span v-if="!showMoreLoading" v-on:click="showMore" style="color: #31a8fa;cursor: pointer">查看更多>></span>
|
||||
<span v-if="showMoreLoading"><a-spin/></span>
|
||||
<span v-if="pageNumber == totalPage" style="color: rgba(0, 0, 0, 0.45)">无更多数据~</span>
|
||||
</div>
|
||||
</vue-scroll>
|
||||
<div v-if="showLoading" class="show-loading-div">
|
||||
<a-spin/>
|
||||
</div>
|
||||
<div v-if="!showLoading && assetList.length == 0" class="show-loading-div">
|
||||
<a-empty/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import interConfig from './interConfig';
|
||||
import AssetItem from './assetItem.vue';
|
||||
import {Spin,Empty} from 'ant-design-vue';
|
||||
export default{
|
||||
data(){
|
||||
return {
|
||||
listScroll: this.StaticParams.scrollOption,
|
||||
showLoading:true,
|
||||
showMoreLoading:false,
|
||||
pageNumber:1,
|
||||
pageSize:10,
|
||||
totalPage:0,
|
||||
totalRow:0,
|
||||
assetList:[]
|
||||
}
|
||||
},
|
||||
mounted(){
|
||||
this.getAssetWaterReport();
|
||||
},
|
||||
methods: {
|
||||
getAssetWaterReport: function () {
|
||||
const assetList = this.assetList;
|
||||
this.showMoreLoading = true;
|
||||
let param = {
|
||||
org_id:this.BaseConfig.person_info_my.bureau_id,
|
||||
begin_time:"",
|
||||
end_time:"",
|
||||
page_number:this.pageNumber,
|
||||
page_size:this.pageSize
|
||||
}
|
||||
this.InterfaceConfig.callInterface([{
|
||||
url: interConfig.getAssetWaterReport.url,
|
||||
params: param,
|
||||
method: interConfig.getAssetWaterReport.method,
|
||||
isTestLogin: interConfig.getAssetWaterReport.isTestLogin,
|
||||
}], (result) => {
|
||||
this.showLoading = false;
|
||||
this.showMoreLoading = false;
|
||||
let resData = result[0].data;
|
||||
if (result[0].status === 200) {
|
||||
if (resData.code === 2000) {
|
||||
this.assetList = assetList.concat(resData.data.list);
|
||||
this.totalPage = resData.data.total_page;
|
||||
this.totalRow = resData.data.total_row;
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
showMore:function () {
|
||||
this.pageNumber += 1;
|
||||
this.getAssetWaterReport();
|
||||
}
|
||||
},
|
||||
components:{
|
||||
AssetItem,
|
||||
ASpin:Spin,
|
||||
AEmpty:Empty
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.asset-flow-div {
|
||||
width: 100%;
|
||||
min-height: 20rem;
|
||||
padding-top: 1rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.position-left{
|
||||
margin-right: 2rem;
|
||||
}
|
||||
.position-right{
|
||||
margin-left: 2rem;
|
||||
}
|
||||
.show-more-div{
|
||||
height: 2rem;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.show-loading-div {
|
||||
min-height: 120px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,238 @@
|
||||
<template>
|
||||
<div class="asset-flow-large-div">
|
||||
<div class="search-div">
|
||||
<div class="task-search-div">
|
||||
<div class="search-title">类型</div>
|
||||
<div class="search-dom">
|
||||
<a-select :value="type" style="width: 200px" @change="typeChange">
|
||||
<a-select-option v-for="item in typsJson" :key="item.name">
|
||||
{{item.name}}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="time-search-div">
|
||||
<DateChoose @flushDate="flushDate" :begin_date="begin_date" :end_date="end_date" hideDefaultDate="true"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="asset-flow-list-div">
|
||||
<template v-if="!showLoading && assetList.length > 0">
|
||||
<div v-for="item,index in assetList" :key="item.asset_code + '-' + index" class="asset-item-div">
|
||||
<AssetItem :position="index%2 == 0?'left':'right'" :itemData="item"/>
|
||||
</div>
|
||||
</template>
|
||||
<div v-if="!showLoading && assetList.length == 0" class="no-data-div">
|
||||
<a-empty/>
|
||||
</div>
|
||||
<div v-if="showLoading" class="show-loading-div">
|
||||
<a-spin/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="page-dom-div">
|
||||
<a-icon type="left-circle" title="上一页"
|
||||
:class="'page-icon-dom '+ (pageNumber == 1?'cannot-click':'can-click')"
|
||||
v-on:click="changePage('previous')"/>
|
||||
<span class="total-num-span">共{{totalNum}}条</span>
|
||||
<a-icon type="right-circle" title="下一页"
|
||||
:class="'page-icon-dom '+ (pageNumber == totalPage?'cannot-click':'can-click')"
|
||||
v-on:click="changePage('next')"/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
<script>
|
||||
import {Select,Spin,Empty,Icon} from 'ant-design-vue';
|
||||
import DateChoose from '../common/dateChoose.vue';
|
||||
import interConfig from './interConfig';
|
||||
import AssetItem from './assetItem.vue';
|
||||
import moment from 'moment';
|
||||
const typsJson = [
|
||||
{name:"全部"},
|
||||
{name:"变更"},
|
||||
{name:"领用"},
|
||||
{name:"退库"},
|
||||
{name:"调拨"},
|
||||
{name:"借用"},
|
||||
{name:"归还"},
|
||||
{name:"维修"},
|
||||
{name:"报废"},
|
||||
{name:"处置"},
|
||||
]
|
||||
export default{
|
||||
data(){
|
||||
return {
|
||||
showLoading:true,
|
||||
begin_date: null,
|
||||
end_date: null,
|
||||
typsJson:typsJson,
|
||||
type:"全部",
|
||||
pageNumber:1,
|
||||
pageSize:12,
|
||||
totalPage:0,
|
||||
totalNum:0,
|
||||
assetList:[]
|
||||
}
|
||||
},
|
||||
mounted(){
|
||||
this.getAssetWaterReport();
|
||||
},
|
||||
methods:{
|
||||
getAssetWaterReport: function () {
|
||||
this.showLoading = true;
|
||||
let param = {
|
||||
org_id:this.BaseConfig.person_info_my.bureau_id,
|
||||
begin_time:"",
|
||||
end_time:"",
|
||||
page_number:this.pageNumber,
|
||||
page_size:this.pageSize
|
||||
}
|
||||
if(this.type != '全部'){
|
||||
param.operation_type = this.type;
|
||||
}
|
||||
if(this.begin_date){
|
||||
param.begin_time = moment(this.begin_date).format("YYYY-MM-DD");
|
||||
}
|
||||
if(this.end_date){
|
||||
param.end_time = moment(this.end_date).format("YYYY-MM-DD");
|
||||
}
|
||||
this.InterfaceConfig.callInterface([{
|
||||
url: interConfig.getAssetWaterReport.url,
|
||||
params: param,
|
||||
method: interConfig.getAssetWaterReport.method,
|
||||
isTestLogin: interConfig.getAssetWaterReport.isTestLogin,
|
||||
}], (result) => {
|
||||
this.showLoading = false;
|
||||
let resData = result[0].data;
|
||||
if (result[0].status === 200) {
|
||||
if (resData.code === 2000) {
|
||||
this.assetList = resData.data.list;
|
||||
this.totalPage = resData.data.total_page;
|
||||
this.totalNum = resData.data.total_row;
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
typeChange: function (value) {
|
||||
if (this.type != value) {
|
||||
this.type = value;
|
||||
}
|
||||
},
|
||||
flushDate: function (param) {
|
||||
this.begin_date = param.beginDate;
|
||||
this.end_date = param.endDate;
|
||||
this.pageNumber = 1;
|
||||
this.getAssetWaterReport();
|
||||
},
|
||||
changePage: function (type) {
|
||||
if (type == 'previous') {
|
||||
if (this.pageNumber == 1) {
|
||||
return;
|
||||
}
|
||||
this.pageNumber--;
|
||||
} else if (type == 'next') {
|
||||
if (this.pageNumber == this.totalPage) {
|
||||
return;
|
||||
}
|
||||
this.pageNumber++;
|
||||
}
|
||||
this.getAssetWaterReport();
|
||||
},
|
||||
},
|
||||
components: {
|
||||
ASelect: Select,
|
||||
ASelectOption: Select.Option,
|
||||
DateChoose,
|
||||
ASpin:Spin,
|
||||
AEmpty:Empty,
|
||||
AssetItem,
|
||||
AIcon:Icon
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.asset-flow-large-div {
|
||||
width: 100%;
|
||||
min-height: 16rem;
|
||||
padding: 0.5rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.search-div{
|
||||
width: 100%;
|
||||
height: 3rem;
|
||||
display: flex;
|
||||
.task-search-div{
|
||||
width: 50%;
|
||||
display: flex;
|
||||
.search-title {
|
||||
width: 100px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 13px;
|
||||
}
|
||||
.search-dom {
|
||||
width: calc(100% - 100px);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
.time-search-div{
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.asset-flow-list-div{
|
||||
width: 100%;
|
||||
min-height: 16rem;
|
||||
display: flex;
|
||||
/*flex-direction: column;*/
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
align-content: flex-start;
|
||||
.asset-item-div{
|
||||
width: calc(50% - 10px);
|
||||
}
|
||||
.show-loading-div {
|
||||
width: 100%;
|
||||
min-height: 120px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.no-data-div{
|
||||
width: 100%;
|
||||
min-height: 120px;
|
||||
margin-top: 1rem;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
.page-dom-div {
|
||||
height: 2.5rem;
|
||||
line-height: 2.5rem;
|
||||
text-align: right;
|
||||
padding-right: 0.5rem;
|
||||
.page-icon-dom {
|
||||
font-size: 1.2rem;
|
||||
border: none;
|
||||
border-radius: 1rem;
|
||||
}
|
||||
.cannot-click {
|
||||
background-color: #a3b0c0;
|
||||
color: white;
|
||||
}
|
||||
.can-click {
|
||||
background-color: #31a8fa;
|
||||
color: white;
|
||||
}
|
||||
.total-num-span {
|
||||
margin-left: 1rem;
|
||||
margin-right: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,18 @@
|
||||
export default {
|
||||
/*
|
||||
* 获取服务器端系统时间
|
||||
* */
|
||||
"getNowTime":{
|
||||
url:'/intellioa/common/getNowTime',
|
||||
method:'get',
|
||||
isTestLogin:true
|
||||
},
|
||||
/*
|
||||
* 资产流水报表
|
||||
* */
|
||||
"getAssetWaterReport":{
|
||||
url:'/intellioa/asset/assetReport/getAssetWaterReport',
|
||||
method:'get',
|
||||
isTestLogin:true
|
||||
},
|
||||
}
|
||||
Loading…
Reference in new issue