moxuan_takeaway_manage/src/views/shopManagement/duanxinlist.vue

<template>
	<div>
		<div style="display: inline-block;">
			<span>状态：</span>
			<el-select v-model="successFlag" style="width:150px;margin-left: 10px;" @change="select()">
				<el-option v-for="item in statesnum2" :key="item.value" :label="item.label" :value="item.value">
				</el-option>
			</el-select>&nbsp;&nbsp;
			<div style="position: relative;display: inline-block;">
				<span>订单id：</span>
				<el-input style="width: 200px;" @keydown.enter.native="select" placeholder="请输入订单编号" v-model="orderId">
				</el-input>&nbsp;&nbsp;
			</div>
			<div style="position: relative;display: inline-block;">
				<span>发送商户：</span>
				<el-input style="width: 200px;" @keydown.enter.native="select" placeholder="请输入发送商户手机号" v-model="fromTo">
				</el-input>&nbsp;&nbsp;
			</div>
			<div style="position: relative;display: inline-block;">
				<span>接收人：</span>
				<el-input style="width: 200px;" @keydown.enter.native="select" placeholder="请输入接收人手机号" v-model="sendTo">
				</el-input>&nbsp;&nbsp;
			</div>
			<div style="margin:5px;display: inline-block;">
					<span>开始时间：</span>
					<el-date-picker style="width: 160px;margin-left: 10px;" v-model="startTime" align="right"
						type="datetime" format="yyyy-MM-dd" value-format="yyyy-MM-dd" placeholder="选择开始时间">
					</el-date-picker>&nbsp;&nbsp;&nbsp;
				</div>
				<div style="margin:5px;display: inline-block;">
					<span>截止时间：</span>
					<el-date-picker style="width: 160px;margin-left: 10px;" v-model="endTime" align="right"
						type="datetime" format="yyyy-MM-dd" value-format="yyyy-MM-dd" placeholder="选择截止时间">
					</el-date-picker>
				</div>
			<el-button style='margin-left:15px;' size="mini" type="primary" icon="document" @click="select">查询
			</el-button>
			<el-button style='margin-left:15px;' size="mini" type="primary" icon="document" @click="cleans">重置
			</el-button>
			<!-- <el-button style='margin:0 0 20px 20px;' v-if="isAuth('autonym:tongguo')" size="mini" type="primary"
				icon="document" @click="passClick()" :disabled="checkBoxData.length <= 0">通过</el-button> -->
		</div>
		<el-table v-loading="tableDataLoading" :data="duanxinData.list">
		  <el-table-column fixed prop="complaintId" label="编号" width="80">
			 <template slot-scope="scope">
					  <span>{{scope.$index+1}}</span>
				  </template>
		  </el-table-column>
		  <el-table-column prop="orderId" label="订单id" width="200" align="center">
		  </el-table-column>
		  <el-table-column prop="goodsCover" label="图片" width="150">
            <template slot-scope="scope">
              <div v-for="(item,index) in scope.row.imgs" :key="index"
                style="display: inline-block; margin: 3px;">
                <el-popover placement="top-start" title="" trigger="hover">
                  <img style="width: 50px; height: 50px" :src="item" alt="" slot="reference">
                  <img style="width: 300px; height: auto" :src="item" alt="">
                </el-popover>
              </div>
            </template>
          </el-table-column>
		  <el-table-column prop="successFlag" label="发送状态" width="150">
			<template slot-scope="scope">
					  <div v-if="scope.row.successFlag==0">发送失败</div>
					  <div v-if="scope.row.successFlag==1">发送成功</div>
				  </template>
		  </el-table-column>
		  <el-table-column prop="sendContent" label="短信内容" width="180"></el-table-column>
		  <el-table-column prop="sendResult" label="发送结果" width="120" align="center">
		  </el-table-column>
		  <el-table-column prop="sendTo" label="接受人" width="180"></el-table-column>
		  <el-table-column prop="sendFromShopName" label="发送商户" width="180"></el-table-column>
		  <el-table-column prop="sendTime" label="发送时间" width="100"></el-table-column>
		</el-table>
		<div style="text-align: center;margin-top: 10px;">
			<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
				:page-sizes="[10, 20, 30, 40]" :page-size="limit" :current-page="page"
				layout="total,sizes, prev, pager, next,jumper" :total="duanxinData.totalCount">
			</el-pagination>
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				limit: 10,
				page: 1,
				activeName: 'first',
				tableDataLoading: false,
				dialogFormVisible: false,
				tableData: [],
				checkBoxData: [], //多选框选择的值
				helpTakeId:'',
				info: {
					stockDate: this.getNowTime(), //日期
				},
				info1: {
					stockDate1: this.getNowTime1(), //日期
				},
				info2: {
					stockDate2: this.getNowTime2(), //日期
				},
				startTime: '',
				endTime: '',
				orderId:'',
				sendTo:'',
				fromTo:'',
				statesnum2: [{
					label: '全部',
					value: ''
					},
					{
					label: '发送成功',
					value: 1
					},
					{
					label: '发送失败',
					value: 0
					},
				],
				successFlag:'',
				duanxinData:[],
				// info: {
				// 	stockDate: this.getNowTime(), //日期
				// },
				// info1: {
				// 	stockDate1: this.getNowTime1(), //日期
				// },
				// info2: {
				// 	stockDate2: this.getNowTime2(), //日期
				// },
			}
		},
		methods: {
			handleSizeChange(val) {
				this.limit = val;
				this.dataSelect()
			},
			handleCurrentChange(val) {
				this.page = val;
				this.dataSelect()
			},
			//处理默认选中当前日期
			getNowTime1() {
				var now = new Date();
				var year = now.getFullYear(); //得到年份
				var month = now.getMonth(); //得到月份
				var date = now.getDate(); //得到日期
				var hh = now.getHours() < 10 ? "0" + now.getHours() : now.getHours();
				var mm = now.getMinutes() < 10 ? "0" + now.getMinutes() : now.getMinutes();
				var ss = now.getSeconds() < 10 ? "0" + now.getSeconds() : now.getSeconds();
				month = month + 1;
				month = month.toString().padStart(2, "0");
				date = date.toString().padStart(2, "0");
				var defaultDate = `${year}-${month}-${date} ${hh}:${mm}:${ss}`;
				return defaultDate;
				this.$set(this.info, "stockDate", defaultDate);
			},
			getNowTime2() {
				var now = new Date();
				var year = now.getFullYear(); //得到年份
				var month = now.getMonth(); //得到月份
				var date = now.getDate(); //得到日期
				month = month + 1;
				month = month.toString().padStart(2, "0");
				date = date.toString().padStart(2, "0");
				var defaultDate = `${year}-${month}-${date}`;
				return defaultDate;
				this.$set(this.info, "stockDate", defaultDate);
			},
			//处理默认选中当前日期
			getNowTime() {
				var now = new Date()
				var year = now.getFullYear() //得到年份
				var month = now.getMonth() - now.getMonth() //得到月份
				var date = now.getDate() - now.getDate() + 1 //得到日期
				month = month + 1
				month = month.toString().padStart(2, '0')
				date = date.toString().padStart(2, '0')
				var defaultDate = `${year}-${month}-${date}`
				return defaultDate
				this.$set(this.info, 'stockDate', defaultDate)
			},
			// 查询
			select() {
				this.page = 1
				this.limit = 10
				this.dataSelect()
			},
			// 重置
			cleans() {
				this.orderId = ''
				this.successFlag = ''
				this.sendTo = ''
				this.fromTo= ''
				this.startTime = ''
				this.endTime = ''
				this.page = 1
				this.dataSelect()
			},
			// 获取派单数据列表
			dataSelect() {
				// if (this.endTime == '') {
				// 	  this.endTime = this.info2.stockDate2
				//   }
				//   if (this.startTime == '') {
				// 	  this.startTime = this.info.stockDate
				//   }
				this.tableDataLoading = true
				this.$http({
					url: this.$http.adornUrl('admin/tb-indent-sms/log'),
					method: 'get',
					params: this.$http.adornParams({
					'page': this.page,
					'limit': this.limit,
					'orderId': this.orderId,//订单id
					'successFlag': this.successFlag,//是否发送成功
					'sendTo': this.sendTo,//接受人
					'fromTo': this.fromTo,//发送骑手
					'startTime': this.startTime,//开始时间
					'endTime': this.endTime,//结束时间
          'sourceType':2//1骑手、2商家，默认为1
					})
				}).then(({
					data
				}) => {
					if (data && data.code === 0) {
					this.tableDataLoading = false
					for (var i in data.data.list) {
						if (data.data.list[i].imgs) {
						data.data.list[i].imgs = data.data.list[i].imgs.split(',')
						}

					}
					let returnData = data.data
					this.duanxinData = returnData
					}
				})
			}
		},
		mounted() {
			this.dataSelect()
		}
	};
</script>

<style>

</style>