master
刘翔宇-旅管家
3 years ago
parent
18f67a9850
commit
c1ae040734
@ -0,0 +1,360 @@
|
||||
<template>
|
||||
<div class="container">
|
||||
<!-- 查询配置 -->
|
||||
<div style="padding: 0px 20px">
|
||||
<div ref="lxHeader">
|
||||
<LxHeader icon="md-apps" text="活动人员名单" style="margin-bottom: 10px; border: 0px; margin-top: 15px">
|
||||
<div slot="content"></div>
|
||||
<slot>
|
||||
<div>
|
||||
<el-date-picker class="vm10" v-model="visitRange" value-format="yyyy-MM-dd" type="daterange"
|
||||
range-separator="至" start-placeholder="参观开始时间" end-placeholder="参观结束时间">
|
||||
</el-date-picker>
|
||||
<el-select style="margin-left: 10px;margin-right: 10px;" v-model="searchFields.time" placeholder="预约时段">
|
||||
<el-option value="">
|
||||
</el-option>
|
||||
<el-option v-for="item in parameters.visittime" :key="item.id" :label="item.value" :value="item.value">
|
||||
</el-option>
|
||||
|
||||
</el-select>
|
||||
<el-date-picker class="vm10" v-model="orderRange" value-format="yyyy-MM-dd" type="daterange"
|
||||
range-separator="至" start-placeholder="订单开始时间" end-placeholder="订单结束时间">
|
||||
</el-date-picker>
|
||||
<el-select class="vm10 vm15" v-model="searchFields.type" placeholder="请选择类型">
|
||||
<el-option v-for="item in parameters.type_list" :key="item.id" :label="item.value" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
<Input class="inputwrap" v-model="searchFields.keyword" placeholder="请输入关键词" />
|
||||
<Input class="inputwrap" v-model="searchFields.unit" placeholder="请输入单位" />
|
||||
<el-select style="margin-right: 10px;width: 120px;" v-model="searchFields.status" placeholder="请选择状态">
|
||||
<el-option value="">
|
||||
</el-option>
|
||||
<el-option v-for="item in parameters.status_list" :key="item.id" :label="item.value" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
<Button type="primary" style="margin-right:10px" @click="searchload">查询</Button>
|
||||
<Button type="primary" style="margin-right:10px" @click="resetload">重置</Button>
|
||||
<Button type="primary" @click="exportExcel">导出</Button>
|
||||
<!-- <Button type="primary" @click="searchload">查询</Button> -->
|
||||
</div>
|
||||
</slot>
|
||||
</LxHeader>
|
||||
</div>
|
||||
<div class="table-tree">
|
||||
<el-table :data="tableData" :height="tableHeight" style="width: 100%">
|
||||
<el-table-column type="index" width="50" align="center" label="序号" fixed="left"> </el-table-column>
|
||||
<el-table-column :prop="column.field" :align="column.align" v-for="(column,index) in columns"
|
||||
:label="column.title" :width="column.width" :fixed="column.fixed">
|
||||
|
||||
<template slot-scope="scope">
|
||||
<div v-if="column.type=='status'">
|
||||
<div v-for="item in parameters.status_list">
|
||||
<div v-if="item.id==scope.row[column.field]">
|
||||
<el-tag v-if="scope.row[column.field]==1" type="warning">{{item.value}}</el-tag>
|
||||
<el-tag v-if="scope.row[column.field]==2" type="success">{{item.value}}</el-tag>
|
||||
<el-tag v-if="scope.row[column.field]==0" type="info">{{item.value}}</el-tag>
|
||||
<el-tag v-if="scope.row[column.field]==3" type="info">{{item.value}}</el-tag>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>{{scope.row[column.field]}}</div>
|
||||
</template>
|
||||
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div class="pagination">
|
||||
<el-pagination @current-change="handleCurrentChange" :current-page="paginations.page"
|
||||
:page-size="paginations.page_size" background layout="prev, pager, next" :total="paginations.total">
|
||||
</el-pagination>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import LxHeader from "@/components/LxHeader/index.vue";
|
||||
import {
|
||||
listvisitor
|
||||
} from "../../api/order/activeorder.js";
|
||||
import {
|
||||
getToken
|
||||
} from '@/utils/auth'
|
||||
export default {
|
||||
components: {
|
||||
LxHeader
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
parameters: {
|
||||
visittime: [{
|
||||
value: "09:00-10:00",
|
||||
id: "1"
|
||||
}, {
|
||||
value: "10:00-11:00",
|
||||
id: "2"
|
||||
}, {
|
||||
value: "11:00-12:00",
|
||||
id: "3"
|
||||
}, {
|
||||
value: "12:00-13:00",
|
||||
id: "4"
|
||||
}, {
|
||||
value: "13:00-14:00",
|
||||
id: "41"
|
||||
}, {
|
||||
value: "14:00-15:00",
|
||||
id: "51"
|
||||
}, {
|
||||
value: "15:00-16:00",
|
||||
id: "61"
|
||||
}, {
|
||||
value: "16:00-17:00",
|
||||
id: "71"
|
||||
}],
|
||||
type_list: [{
|
||||
value: '团体',
|
||||
id: "1"
|
||||
}, {
|
||||
value: '个人',
|
||||
id: "2"
|
||||
}],
|
||||
status_list: [{
|
||||
value: '待参观',
|
||||
id: "1"
|
||||
}, {
|
||||
value: '已参观',
|
||||
id: "2"
|
||||
}, {
|
||||
value: '已取消',
|
||||
id: "0"
|
||||
}, {
|
||||
value: '已过期',
|
||||
id: "3"
|
||||
}]
|
||||
},
|
||||
tableHeight: 0,
|
||||
clientHeight: 0,
|
||||
//查询条件字段
|
||||
visitRange: ['', ''],
|
||||
orderRange: ['', ''],
|
||||
tokens: "",
|
||||
baseurl: "",
|
||||
searchFields: {
|
||||
keyword: "",
|
||||
start_date: "",
|
||||
end_date: "",
|
||||
order_start_date: "",
|
||||
order_end_date: "",
|
||||
is_export: 0,
|
||||
type: "",
|
||||
unit: "",
|
||||
time: "",
|
||||
status: ""
|
||||
},
|
||||
tableData: [],
|
||||
paginations: {
|
||||
page: 1,
|
||||
page_size: 15,
|
||||
total: 0
|
||||
},
|
||||
columns: [{
|
||||
field: "date",
|
||||
title: "预约日期",
|
||||
type: "date",
|
||||
width: 180,
|
||||
fixed: "left"
|
||||
},
|
||||
{
|
||||
field: "person",
|
||||
title: "预约人",
|
||||
type: "string",
|
||||
align: "center",
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
field: "name",
|
||||
title: "游客",
|
||||
type: "string",
|
||||
align: "center",
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
field: "personmobile",
|
||||
title: "游客电话",
|
||||
type: "string",
|
||||
align: "center",
|
||||
width: 180,
|
||||
},
|
||||
{
|
||||
field: "typeName",
|
||||
title: "类型",
|
||||
type: "string",
|
||||
align: "center",
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
field: "leader",
|
||||
title: "领队人",
|
||||
type: "string",
|
||||
align: "center",
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
field: "mobile",
|
||||
title: "联系电话",
|
||||
type: "string",
|
||||
align: "center",
|
||||
width: 180,
|
||||
},
|
||||
{
|
||||
field: "unit",
|
||||
title: "单位",
|
||||
type: "string",
|
||||
align: "center",
|
||||
width: 200,
|
||||
},
|
||||
{
|
||||
field: "created_at",
|
||||
title: "下单时间",
|
||||
type: "string",
|
||||
align: "center",
|
||||
width: 180,
|
||||
},
|
||||
{
|
||||
field: "status",
|
||||
title: "订单状态",
|
||||
type: "status",
|
||||
align: "center",
|
||||
fixed: "right",
|
||||
width: 120
|
||||
}
|
||||
]
|
||||
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.initLoad();
|
||||
this.load();
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
initLoad() {
|
||||
var that = this;
|
||||
var clientHeight = document.documentElement.clientHeight
|
||||
var lxHeader_height = 96.5; //查询 头部
|
||||
var paginationHeight = 37; //分页的高度
|
||||
var topHeight = 50; //页面 头部
|
||||
let tableHeight = clientHeight - lxHeader_height - topHeight - paginationHeight - 20;
|
||||
that.tableHeight = tableHeight;
|
||||
that.baseurl = location.host; //process.env.VUE_APP_BASE_API
|
||||
console.log("aa", process.env)
|
||||
},
|
||||
load(is_export) {
|
||||
console.log(is_export)
|
||||
var that = this;
|
||||
listvisitor({
|
||||
page: this.paginations.page,
|
||||
page_size: this.paginations.page_size,
|
||||
...this.searchFields
|
||||
}).then(res => {
|
||||
let tokens = getToken();
|
||||
console.log(is_export)
|
||||
console.log(tokens)
|
||||
console.log(that.searchFields.is_export)
|
||||
if (is_export) {
|
||||
var url = "/api/admin/activity/order-detail-index?token=" + tokens
|
||||
console.log(url)
|
||||
for (var m in that.searchFields) {
|
||||
url += "&" + m + "=" + that.searchFields[m]
|
||||
}
|
||||
url = that.baseurl + url
|
||||
window.open("https://" + url, '_blank')
|
||||
that.searchFields.is_export = 0
|
||||
return;
|
||||
}
|
||||
let _data = [];
|
||||
// let result = Object.assign(_data, res.data);
|
||||
for (var m of res.data) {
|
||||
var mod = {};
|
||||
|
||||
mod.status = m.status
|
||||
_data.push(m)
|
||||
}
|
||||
that.tableData = _data;
|
||||
that.paginations.total = res.total
|
||||
}).catch(error => {
|
||||
|
||||
})
|
||||
},
|
||||
searchload() {
|
||||
if (this.visitRange) {
|
||||
this.searchFields.start_date = this.visitRange[0]
|
||||
this.searchFields.end_date = this.visitRange[1]
|
||||
} else {
|
||||
this.searchFields.start_date = ""
|
||||
this.searchFields.end_date = ""
|
||||
}
|
||||
if (this.orderRange) {
|
||||
this.searchFields.order_start_date = this.orderRange[0]
|
||||
this.searchFields.order_end_date = this.orderRange[1]
|
||||
} else {
|
||||
this.searchFields.order_start_date = ""
|
||||
this.searchFields.order_end_date = ""
|
||||
}
|
||||
this.load()
|
||||
},
|
||||
resetload() {
|
||||
this.searchFields = {
|
||||
keyword: "",
|
||||
start_date: "",
|
||||
end_date: "",
|
||||
order_start_date: "",
|
||||
order_end_date: "",
|
||||
// is_export:0,
|
||||
type: "",
|
||||
unit: ""
|
||||
},
|
||||
this.visitRange = ['', '']
|
||||
this.orderRange = ['', '']
|
||||
this.load()
|
||||
},
|
||||
exportExcel() {
|
||||
this.searchFields.is_export = 1;
|
||||
this.load(true);
|
||||
},
|
||||
handleCurrentChange(page) {
|
||||
this.paginations.page = page;
|
||||
this.load();
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.inputwrap {
|
||||
width: 150px;
|
||||
margin: 10px;
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.inputwrap input {
|
||||
height: 40px;
|
||||
|
||||
}
|
||||
|
||||
.inputwrap .ivu-input-suffix {
|
||||
line-height: 40px !important;
|
||||
}
|
||||
|
||||
.vm10 {
|
||||
vertical-align: middle;
|
||||
margin: 10px;
|
||||
margin-left: 0;
|
||||
width: 360px !important;
|
||||
}
|
||||
|
||||
.vm15 {
|
||||
width: 150px !important;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in new issue