232 lines
8.4 KiB
Vue
232 lines
8.4 KiB
Vue
<template>
|
||
<view class="container">
|
||
<uni-card v-if="!totalCount" title="查询结果" sub-title="" extra="" padding="10px 0">
|
||
<view class="uni-body uni-mt-5">
|
||
<view>
|
||
<text>没有查询到相关运单</text>
|
||
</view>
|
||
</view>
|
||
</uni-card>
|
||
|
||
<uni-section v-else :title="'运单'+order.id" type="line" v-for="order in orders" :data-oid="order.id"
|
||
:data-carid="order.car_id">
|
||
<uni-card title="基础卡片" sub-title="副标题" extra="额外信息" padding="10px 0" :thumbnail="avatar">
|
||
<template v-slot:title>
|
||
<uni-list>
|
||
<uni-list-item :show-switch="false" :title="order.car_title + ' ' + order.car_number" />
|
||
</uni-list>
|
||
</template>
|
||
<view class="uni-body uni-mt-5">
|
||
<view>
|
||
<text>日期：{{order.signdate}}</text>
|
||
</view>
|
||
<view>
|
||
<text>起运地：{{order.start_city}} => 目的地：{{order.aim_city}}</text>
|
||
</view>
|
||
<view>
|
||
<text>验车人：{{order.checker}}</text>
|
||
</view>
|
||
</view>
|
||
<view slot="actions" class="card-actions">
|
||
|
||
<view v-if="order.is_checked" class="card-actions-item" @click="showCheck(order.id)">
|
||
<uni-icons type="images" size="18" color="#999"></uni-icons>
|
||
<text class="card-actions-item-text">验车情况</text>
|
||
</view>
|
||
<view class="card-actions-item" @click="actionsCheck(order.id)">
|
||
<uni-icons type="cloud-upload" size="18" color="#999"></uni-icons>
|
||
<text class="card-actions-item-text">上传验车</text>
|
||
</view>
|
||
|
||
<view class="card-actions-item" @click="actionsDetail(order.id)">
|
||
<uni-icons type="link" size="18" color="#999"></uni-icons>
|
||
<text class="card-actions-item-text">详情</text>
|
||
</view>
|
||
</view>
|
||
</uni-card>
|
||
</uni-section>
|
||
<view class="pagination">
|
||
<uni-pagination :show-icon="false" :total="totalCount" :pageSize='psize' v-model='page' title="分页栏"
|
||
@change="newPage" />
|
||
</view>
|
||
|
||
<uni-fab ref="fab" :pattern="fabs.pattern" :content="fabs.content" :horizontal="fabs.horizontal"
|
||
:vertical="fabs.vertical" :direction="fabs.direction" @trigger="fabTrigger" @fabClick="fabClick" />
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import utils from "@/utils/common.js";
|
||
import config from "@/config/ctms.config.js";
|
||
import ctms from '@/apis/ctms/index.js';
|
||
|
||
export default {
|
||
data() {
|
||
return {
|
||
userinfo: {},
|
||
orders: {},
|
||
employees: {},
|
||
stores: {},
|
||
totalCount: 0, //一共多少条数据
|
||
psize: 10,
|
||
page: 1,
|
||
avatar: '@/static/logo.png',
|
||
|
||
//悬浮按钮
|
||
fabs: {
|
||
horizontal: 'left',
|
||
vertical: 'bottom',
|
||
direction: 'horizontal', //horizontal水平展开；vertical垂直展开
|
||
pattern: {
|
||
color: '#7A7E83',
|
||
backgroundColor: '#fff',
|
||
selectedColor: '#007AFF',
|
||
buttonColor: '#fff',
|
||
iconColor: '#aaa'
|
||
},
|
||
content: [{
|
||
iconPath: '/static/fab/home.png',
|
||
selectedIconPath: '/static/fab/homeactive.png',
|
||
text: '首页',
|
||
active: false,
|
||
diyfn: 'home'
|
||
},
|
||
{
|
||
iconPath: '/static/fab/guanzhu.png',
|
||
selectedIconPath: '/static/fab/guanzhuactive.png',
|
||
text: '关注',
|
||
active: false,
|
||
diyfn: 'news'
|
||
},
|
||
{
|
||
iconPath: '/static/fab/me.png',
|
||
selectedIconPath: '/static/fab/meactive.png',
|
||
text: '用户',
|
||
active: false,
|
||
diyfn: 'user'
|
||
},
|
||
|
||
{
|
||
iconPath: '/static/fab/news.png',
|
||
selectedIconPath: '/static/fab/newsactive.png',
|
||
text: '公告',
|
||
active: false,
|
||
diyfn: 'notice'
|
||
}
|
||
]
|
||
}
|
||
}
|
||
},
|
||
methods: {
|
||
showCheck(e) {
|
||
uni.navigateTo({
|
||
url: '../detail/check?oid=' + e
|
||
})
|
||
},
|
||
actionsDetail(e) {
|
||
uni.navigateTo({
|
||
url: '../detail/detail?oid=' + e
|
||
})
|
||
},
|
||
actionsCheck(e) {
|
||
uni.navigateTo({
|
||
url: '../yanche/yanche?oid=' + e
|
||
})
|
||
},
|
||
//分页器动作
|
||
newPage(e) {
|
||
var page = e.current;
|
||
this.page = page;
|
||
var res = ctms.order.list(this.page);
|
||
if (res) {
|
||
this.orders = res.orders;
|
||
} else {
|
||
this.checkOrder();
|
||
}
|
||
},
|
||
//刷新列表
|
||
checkOrder() {
|
||
var _that = this;
|
||
ctms.order.search(null, this.page, this.psize).then(
|
||
function(res) {
|
||
if (res) {
|
||
_that.orders = res.orders;
|
||
_that.totalCount = res.total;
|
||
uni.showToast({
|
||
title: "查询完成!",
|
||
icon: "success"
|
||
});
|
||
} else {
|
||
_that.orders = {}
|
||
_that.totalCount = 0;
|
||
}
|
||
}
|
||
);
|
||
},
|
||
|
||
//浮窗按钮相关操作
|
||
fabClick(e) {
|
||
// utils.debug('点击了悬浮按钮')
|
||
},
|
||
fabTrigger(e) {
|
||
var eindex = e.index;
|
||
this.fabs.content[e.index].active = !e.item.active;
|
||
|
||
if (!e.item.diyfn) {
|
||
//未设置这个difyfn字段的，无操作
|
||
return false;
|
||
}
|
||
var diyfn = e.item.diyfn,
|
||
dir = config.pageDir,
|
||
page;
|
||
switch (diyfn) {
|
||
case 'home':
|
||
page = 'tabbar/index/index';
|
||
return uni.reLaunch({
|
||
url: dir + page
|
||
})
|
||
break;
|
||
case 'news':
|
||
page = 'news/list/list';
|
||
break;
|
||
case 'user':
|
||
page = 'me/index';
|
||
break;
|
||
case 'notice':
|
||
page = 'tabbar/notice/index';
|
||
return uni.reLaunch({
|
||
url: dir + page
|
||
})
|
||
break;
|
||
}
|
||
return uni.navigateTo({
|
||
url: dir + page
|
||
})
|
||
}
|
||
},
|
||
|
||
onLoad() {
|
||
// utils.debug('运单列表页启动')
|
||
},
|
||
onShow() {
|
||
var res = ctms.order.list(this.page);
|
||
if (res) {
|
||
this.orders = res.orders;
|
||
this.totalCount = res.total;
|
||
}
|
||
},
|
||
|
||
onPullDownRefresh() {
|
||
this.page = 1;
|
||
this.checkOrder();
|
||
setTimeout(() => {
|
||
uni.stopPullDownRefresh();
|
||
}, 3000);
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style>
|
||
@import url("list.css");
|
||
@import url("../../statusBar.css");
|
||
</style> |