You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
108 lines
3.1 KiB
108 lines
3.1 KiB
4 years ago
|
|
||
|
|
|
||
|
|
<template>
|
||
|
|
<div class="d-flex flex-wrap pb-3">
|
||
|
|
<div>
|
||
|
|
<a-date-picker
|
||
|
|
v-model="startValue"
|
||
|
|
:disabled-date="disabledStartDate"
|
||
|
|
show-time
|
||
|
|
placeholder="开始时间"
|
||
|
|
:default-value="$moment(`${timeObj.startTime}`, dateFormat)"
|
||
|
|
:format="dateFormat"
|
||
|
|
@openChange="handleStartOpenChange"
|
||
|
|
@change="getStartDate"
|
||
|
|
:allow-clear="clear"
|
||
|
|
/>
|
||
|
|
<a-date-picker
|
||
|
|
v-model="endValue"
|
||
|
|
:disabled-date="disabledEndDate"
|
||
|
|
show-time
|
||
|
|
placeholder="结束时间"
|
||
|
|
:open="endOpen"
|
||
|
|
:default-value="$moment(timeObj.endTime, dateFormat)"
|
||
|
|
:format="dateFormat"
|
||
|
|
@openChange="handleEndOpenChange"
|
||
|
|
@change="getEndDate"
|
||
|
|
:allow-clear="clear"
|
||
|
|
/>
|
||
|
|
<a-button @click="handleTableChange" class="mx-2" type="primary">搜索</a-button>
|
||
|
|
<a-button @click="downFile" icon="download" class="mx-2 down-btn" type="primary">下载</a-button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import { weightExport } from 'config/api';
|
||
|
|
|
||
|
|
export default {
|
||
|
|
name: 'Search',
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
timeObj: {
|
||
|
|
startTime: this.$moment(Date.parse(new Date()) - 3600 * 30 * 24 * 1000).format('YYYY-MM-DD'),
|
||
|
|
endTime: this.$moment(Date.parse(new Date())).format('YYYY-MM-DD'),
|
||
|
|
},
|
||
|
|
dateFormat: 'YYYY-MM-DD',
|
||
|
|
startValue: null,
|
||
|
|
endValue: null,
|
||
|
|
endOpen: false,
|
||
|
|
clear: false,
|
||
|
|
};
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
disabledStartDate(startValue) {
|
||
|
|
const endValue = this.endValue;
|
||
|
|
if (!startValue || !endValue) {
|
||
|
|
return false;
|
||
|
|
}
|
||
|
|
return startValue.valueOf() > endValue.valueOf() || startValue.valueOf() < endValue.valueOf() - 3600 * 30 * 24 * 1000;
|
||
|
|
},
|
||
|
|
disabledEndDate(endValue) {
|
||
|
|
const startValue = this.startValue;
|
||
|
|
if (!endValue || !startValue) {
|
||
|
|
return false;
|
||
|
|
}
|
||
|
|
return startValue.valueOf() >= endValue.valueOf() || startValue.valueOf() < endValue.valueOf() - 3600 * 30 * 24 * 1000;
|
||
|
|
},
|
||
|
|
handleStartOpenChange(open) {
|
||
|
|
if (!open) {
|
||
|
|
this.endOpen = true;
|
||
|
|
}
|
||
|
|
},
|
||
|
|
handleEndOpenChange(open) {
|
||
|
|
this.endOpen = open;
|
||
|
|
},
|
||
|
|
getStartDate(e) {
|
||
|
|
this.timeObj.startTime = this.$moment(e._d).unix() * 1000;
|
||
|
|
},
|
||
|
|
getEndDate(e) {
|
||
|
|
this.timeObj.endTime = this.$moment(e._d).unix() * 1000;
|
||
|
|
},
|
||
|
|
handleTableChange() {
|
||
|
|
if (typeof this.timeObj.startTime === 'string') {
|
||
|
|
this.timeObj.startTime = this.$moment(this.timeObj.startTime).unix() * 1000;
|
||
|
|
}
|
||
|
|
if (typeof this.timeObj.endTime === 'string') {
|
||
|
|
this.timeObj.endTime = this.$moment(this.timeObj.endTime).unix() * 1000;
|
||
|
|
}
|
||
|
|
this.$emit('getData', this.timeObj);
|
||
|
|
},
|
||
|
|
// 下载附件
|
||
|
|
downFile() {
|
||
|
|
window.open(
|
||
|
|
`http://test.tall.wiki/gateway/wisdomcar/record/weightExport?startTime=${this.timeObj.startTime}&&endTime=${this.timeObj.endTime}`,
|
||
|
|
);
|
||
|
|
},
|
||
|
|
},
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
||
|
|
<style scoped lang="stylus">
|
||
|
|
.down-btn {
|
||
|
|
position: absolute;
|
||
|
|
right: 25px;
|
||
|
|
}
|
||
|
|
</style>
|