洋浦学校 待办工作阶段代码提交

init
gongdi 3 years ago
parent ab8a6d5adb
commit c63fb67644

@ -1,7 +1,7 @@
<template> <template>
<div :class="'operate-car-page-style ' + (pageType === 1?'use-style':'return-style')"> <div :class="'operate-car-page-style ' + (pageType === 1?'use-style':'return-style')">
<a-spin :spinning="isLoading"> <a-spin :spinning="isLoading">
<vue-scroll :ops="listScroll" style="height:12rem"> <vue-scroll :ops="listScroll" :style="{height:(pageHeight?pageHeight:12) + 'rem'}">
<div :class="'apply-info-div' + (isLarge === true?' large-page-style':'')"> <div :class="'apply-info-div' + (isLarge === true?' large-page-style':'')">
<div class="person-info-row-style"> <div class="person-info-row-style">
<div class="person-img-style"> <div class="person-img-style">
@ -91,7 +91,7 @@
<a-button class="button-style button-left" @click="cancel()"> <a-button class="button-style button-left" @click="cancel()">
返回 返回
</a-button> </a-button>
<a-button type="primary" class="button-style" @click="submit()"> <a-button v-if="!isView" type="primary" class="button-style" @click="submit()">
提交 提交
</a-button> </a-button>
</div> </div>
@ -117,8 +117,14 @@
isLarge: { isLarge: {
type: Boolean type: Boolean
}, },
isView: {
type: Boolean
},
pageType: { pageType: {
type: Number type: Number
},
pageHeight:{
type:Number
} }
}, },
data(){ data(){

@ -1,6 +1,6 @@
<template> <template>
<div :class="'car-use-return-row-info-style ' + (pageType === 1?'use-car-back':'return-car-back')" <div :class="'car-use-return-row-info-style ' + (pageType === 1?'use-car-back':'return-car-back')"
@mouseenter="showButton" @mouseleave="hiddenButton" @mouseenter="showButton" @mouseleave="hiddenButton" @click="viewInfo"
> >
<div class="user-image-box"> <div class="user-image-box">
<Portrait :personId="info.user_person_id"/> <Portrait :personId="info.user_person_id"/>
@ -27,6 +27,20 @@
</div> </div>
</div> </div>
</div> </div>
<div :class="'car-check-status-flag-style ' + getCheckStatusStyle(info)">
<span v-if="info.apply_check_flag === 0"></span>
<span v-if="info.apply_check_flag === 1"></span>
<span v-if="info.apply_check_flag === -1"></span>
<span v-if="info.apply_check_flag === 11"></span>
</div>
<div v-if="info.apply_car_status === 0 || info.apply_car_status === 1 || info.apply_car_status === 2 || info.apply_car_status === 3 || info.apply_car_status === -1"
:class="'car-check-status-flag-style car-status-flag-style ' + getCarStatusStyle(info)">
<span v-if="info.apply_car_status === 0"></span>
<span v-if="info.apply_car_status === 1"></span>
<span v-if="info.apply_car_status === 2"></span>
<span v-if="info.apply_car_status === 3"></span>
<span v-if="info.apply_car_status === -1"></span>
</div>
<div class="button-div" v-if="showButtonFlag"> <div class="button-div" v-if="showButtonFlag">
<div v-if="pageType === 1" style="width: 100%;height: 100%"> <div v-if="pageType === 1" style="width: 100%;height: 100%">
<div class="button-span" style="background-color: #31a8fa;color: white"> <div class="button-span" style="background-color: #31a8fa;color: white">
@ -54,7 +68,7 @@
}, },
info: { info: {
type: Object type: Object
} },
}, },
data(){ data(){
return { return {
@ -84,6 +98,47 @@
}, },
toCancel:function () { toCancel:function () {
this.$emit("toCancel"); this.$emit("toCancel");
},
getCheckStatusStyle:function (info) {
let checkStatus = info.apply_check_flag;
let style = "";
switch (checkStatus){
case 0:
style = "be-check";
break;
case 1:
style = "passed";
break;
case -1:
style = "no-pass";
break;
case 11:
style = "be-cancel";
break;
default:
break;
}
return style;
},
getCarStatusStyle:function (info) {
let carStatus = info.apply_car_status;
let style = "";
switch (carStatus){
case 0:
case 1:
case 2:
style = "be-check";
break;
case 3:
style = "passed";
break;
default:
break;
}
return style;
},
viewInfo:function () {
this.$emit("viewInfo")
} }
}, },
components: { components: {
@ -139,6 +194,32 @@
} }
} }
.car-check-status-flag-style{
position: absolute;
right: 5px;
border: 1px solid #cccccc;
padding: 5px 10px;
transform: rotate(7deg);
-ms-transform: rotate(7deg); /* IE 9 */
-moz-transform: rotate(7deg); /* Firefox */
-webkit-transform: rotate(7deg); /* Safari 和 Chrome */
-o-transform: rotate(7deg); /* Opera */
}
.car-status-flag-style{
margin-top: 2rem;
}
.be-check{
border: 1px solid #F59A23;
color: #F59A23;
}
.passed{
border: 1px solid #31a8fa;
color: #31a8fa;
}
.no-pass{
border: 1px solid red;
color: red;
}
.button-div { .button-div {
position: absolute; position: absolute;
top: 0; top: 0;

@ -1,6 +1,8 @@
<template> <template>
<div class="office-car-history-style"> <div class="office-car-history-style">
<DateChoose @flushDate="flushDate" :begin_date="begin_date" :end_date="end_date" :callInter="true"></DateChoose> <template v-if="pageType === 0">
<DateChoose @flushDate="flushDate" :begin_date="begin_date" :end_date="end_date"
:callInter="true"></DateChoose>
<div class="status-search-box"> <div class="status-search-box">
<StatusSearch @statusChange="statusChange"/> <StatusSearch @statusChange="statusChange"/>
</div> </div>
@ -8,7 +10,9 @@
<a-spin :spinning="isLoading"> <a-spin :spinning="isLoading">
<vue-scroll :ops="listScroll" style="height:25rem"> <vue-scroll :ops="listScroll" style="height:25rem">
<div v-if="!isLoading && dataList.length > 0" class="data-list-style"> <div v-if="!isLoading && dataList.length > 0" class="data-list-style">
<InfoRow v-for="item,index in dataList" :key="'info-'+ index" :info="item"/> <InfoRow v-for="item,index in dataList"
:key="'info-'+ index" :info="item" @viewInfo="viewInfo(item)"/>
</div> </div>
<div v-if="!isLoading && dataList.length === 0" class="data-list-style"> <div v-if="!isLoading && dataList.length === 0" class="data-list-style">
<a-empty></a-empty> <a-empty></a-empty>
@ -16,6 +20,19 @@
</vue-scroll> </vue-scroll>
</a-spin> </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">{{totolNum}}</span>
<a-icon type="right-circle" title="下一页"
:class="'page-icon-dom '+ (pageNumber == totalPage?'cannot-click':'can-click')"
v-on:click="changePage('next')"/>
</div>
</template>
<template v-if="pageType === 1">
<CarInfo :applyId="applyId" :isView="true" @cancel="cancel" :pageHeight="17"/>
</template>
</div> </div>
</template> </template>
<script> <script>
@ -24,10 +41,12 @@
import StatusSearch from './carStatusSearch.vue'; import StatusSearch from './carStatusSearch.vue';
import moment from 'moment'; import moment from 'moment';
import InfoRow from '../carUseReturn/infoRow.vue'; import InfoRow from '../carUseReturn/infoRow.vue';
import {Empty, Spin} from 'ant-design-vue'; import {Empty, Spin,Icon} from 'ant-design-vue';
import CarInfo from '../carUseReturn/checkPage.vue';
export default{ export default{
data(){ data(){
return { return {
pageType: 0,//0 1
listScroll: this.StaticParams.scrollOption, listScroll: this.StaticParams.scrollOption,
isLoading: false, isLoading: false,
begin_date: null, begin_date: null,
@ -35,10 +54,11 @@
checkStatus: "", checkStatus: "",
useStatus: "", useStatus: "",
pageNumber: 1, pageNumber: 1,
pageSize: 100000, pageSize: 8,
totalPage: 0, totalPage: 0,
totolNum: 0, totolNum: 0,
dataList: [], dataList: [],
applyId: "",
} }
}, },
methods: { methods: {
@ -80,6 +100,27 @@
this.totolNum = resData.data.total_row; this.totolNum = resData.data.total_row;
} }
}) })
},
viewInfo: function (item) {
this.applyId = item.apply_id;
this.pageType = 1;
},
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.getDataList();
},
cancel:function () {
this.pageType = 0;
} }
}, },
components: { components: {
@ -87,7 +128,9 @@
StatusSearch, StatusSearch,
InfoRow, InfoRow,
AEmpty: Empty, AEmpty: Empty,
ASpin: Spin ASpin: Spin,
CarInfo,
AIcon:Icon
} }
} }
</script> </script>
@ -113,5 +156,28 @@
height: auto; height: auto;
} }
} }
.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> </style>

@ -1,5 +1,6 @@
<template> <template>
<div class="office-car-history-large-style"> <div class="office-car-history-large-style">
<template v-if="pageType === 0">
<SearchDom @toSearch="toSearch"/> <SearchDom @toSearch="toSearch"/>
<div class="status-search-box-style"> <div class="status-search-box-style">
<StatusSearch @statusChange="statusChange"/> <StatusSearch @statusChange="statusChange"/>
@ -9,7 +10,7 @@
<vue-scroll :ops="listScroll" style="height:25rem" v-if="!isLoading && dataList.length > 0"> <vue-scroll :ops="listScroll" style="height:25rem" v-if="!isLoading && dataList.length > 0">
<div class="data-list-div"> <div class="data-list-div">
<div class="data-row-div" v-for="item,index in dataList" :key="'info-'+ index"> <div class="data-row-div" v-for="item,index in dataList" :key="'info-'+ index">
<InfoRow :info="item"/> <InfoRow :info="item" @viewInfo="viewInfo(item)"/>
</div> </div>
</div> </div>
</vue-scroll> </vue-scroll>
@ -27,6 +28,10 @@
:class="'page-icon-dom '+ (pageNumber == totalPage?'cannot-click':'can-click')" :class="'page-icon-dom '+ (pageNumber == totalPage?'cannot-click':'can-click')"
v-on:click="changePage('next')"/> v-on:click="changePage('next')"/>
</div> </div>
</template>
<template v-if="pageType === 1">
<CarInfo :applyId="applyId" :isLarge="true" :isView="true" @cancel="cancel" :pageHeight="17"/>
</template>
</div> </div>
</template> </template>
<script> <script>
@ -35,9 +40,11 @@
import InterConfig from '../officeCar/interConfig'; import InterConfig from '../officeCar/interConfig';
import InfoRow from '../carUseReturn/infoRow.vue'; import InfoRow from '../carUseReturn/infoRow.vue';
import {Spin, Empty, Icon} from 'ant-design-vue'; import {Spin, Empty, Icon} from 'ant-design-vue';
import CarInfo from '../carUseReturn/checkPage.vue';
export default{ export default{
data(){ data(){
return { return {
pageType: 0,//0 1
pageNumber: 1, pageNumber: 1,
pageSize: 8, pageSize: 8,
totalPage: 0, totalPage: 0,
@ -54,6 +61,7 @@
checkStatus: "",// checkStatus: "",//
useStatus: "",//使 useStatus: "",//使
dataList: [], dataList: [],
applyId: "",
} }
}, },
created(){ created(){
@ -115,6 +123,13 @@
this.pageNumber++; this.pageNumber++;
} }
this.getDataList(); this.getDataList();
},
viewInfo: function (item) {
this.applyId = item.apply_id;
this.pageType = 1;
},
cancel:function () {
this.pageType = 0;
} }
}, },
components: { components: {
@ -123,7 +138,8 @@
ASpin: Spin, ASpin: Spin,
AEmpty: Empty, AEmpty: Empty,
AIcon: Icon, AIcon: Icon,
InfoRow InfoRow,
CarInfo
} }
} }
</script> </script>

Loading…
Cancel
Save