Skip to content

S
self-support
Commit 9d0a9f2c authored by Facius's avatar Facius
Browse files
Options

详情页弹窗

parent a44b66da
Hide whitespace changes
Inline Side-by-side
Showing with 320 additions and 113 deletions
src/components/parts/appliedPartsCell.vue
View file @ 9d0a9f2c
......@@ -3,13 +3,16 @@
<view class="return-cell" @click="handleClick">
<view class="title-view">
<text class="title-text" :style="{'color': titleColor}">{{title}}</text>
<view>
<text>工单编号：</text>
<text @longpress="handleLongpress">{{info.orderNumber}}</text>
<view class="express-view">
<text>物流单号：</text>
<view class="order-file-right" @click="$u.throttle(handleClickExpress, 500)">
<text>{{info.express.number}}</text>
<u-icon name="arrow-right"></u-icon>
</view>
</view>
</view>
<view class="line-view"></view>
<view class="list-content">
<view class="list-content" v-if="isHorizontal">
<view class="image-list">
<image class="image-view" v-for="(item, index) in images" :key="index" :src="item"></image>
<view class="info-view" v-if="info.items.length == 1">
......@@ -19,6 +22,11 @@
</view>
<view class="count-view">共{{info.items.length}}种</view>
</view>
<view v-else class="list-vertical-content">
<view class="list-item" v-for="(item, index) in info.items" :key="index">
<SpareCell :item="item"/>
</view>
</view>
<view class="bottom-view">
<view class="total-view">
<text>合计：</text>
......@@ -31,15 +39,25 @@
</template>
<script>
import SpareCell from "@/components/parts/spareCell.vue"
export default {
components: {
SpareCell
},
props: {
info: { // 申请材料列表
type: Object,
default() {
return {
status: 0, // 待签收 15；待发货 10；待审核 1；已取消 -1；已驳回 -2；已签收 20
items: [],
express: {}
}
}
},
type: { // horizontal；vertical
type: String,
default: 'horizontal'
}
},
data() {
......@@ -56,6 +74,9 @@
'20': '',
}
},
isHorizontal() {
return this.type == 'horizontal'
},
operateTypes() {
return {
'1': 'cancelParts',
......@@ -102,7 +123,7 @@
}
},
// 待签收 15 变 已签收 20； 10 待审核 1 变 已取消 -1
willStatus() {
willStatuses() {
return {
'1': '-1',
'10': '',
......@@ -112,6 +133,9 @@
'-1': ''
}
},
willStatus() {
return this.willStatuses[this.info.status]
},
total() { // 合计
var i = 0
for (var item of this.info.items) {
......@@ -142,18 +166,13 @@
},
methods: {
handleClick() {
this.$emit('action', this.info.id, this.buttonOperateType, this.willStatus)
this.$emit('action', this.info)
},
handleOperate() {
this.$emit('operate', this.info.id, this.buttonOperateType, this.willStatus)
},
handleLongpress() { // 长按复制单号
uni.setClipboardData({
data: this.info.orderNumber,
success: function () {
console.log('success');
}
})
handleClickExpress() {
this.$emit('express', this.info.id)
}
}
}
......@@ -165,6 +184,9 @@
background-color: #FFFFFF;
border-radius: 12rpx;
margin-bottom: 20rpx;
display: flex;
flex-direction: column;
height: 100%;
.title-view{
display: flex;
align-items: center;
......@@ -175,6 +197,15 @@
font-size: 36rpx;
font-weight: bold;
}
.express-view {
display: flex;
justify-content: center;
.order-file-right {
font-weight: 400;
color: #2272FF;
font-size: 26rpx;
}
}
}
.line-view {
background-color: #F4F5F7;
......@@ -186,7 +217,7 @@
display: flex;
width: 100%;
margin-top: 40rpx;
margin-bottom: 40rpx;
margin-bottom: 30rpx;
.image-list {
overflow-x: auto;
display: flex;
......@@ -217,10 +248,19 @@
color: #666666;
}
}
.list-vertical-content {
height: 100%;
overflow: auto;
.list-item {
margin-bottom: 30rpx;
margin-top: 20rpx;
}
}
.bottom-view {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 20rpx;
.total-view {
font-size: 32rpx;
font-weight: bold;
......
src/components/parts/applyList.vue
View file @ 9d0a9f2c
<template>
<u-popup v-model="show" mode="center" safe-area-inset-bottom width="690rpx" :mask-close-able="flase"
close-icon-color="#FFFFFF" height="80%">
close-icon-color="#FFFFFF" height="86%">
<!-- 申请列表 -->
<view class="apply-list-view">
<view class="content-view">
<view class="list-content">
<view v-for="(item, index) in list" :key="index">
<AppliedCell @operate="handleOperate" :info="item"></AppliedCell>
</view>
<view class="list-content">
<swiper class="swiper" :indicator-dots="true" style="height: 100%;" :current="currentIndex">
<swiper-item v-for="(item, index) in list" :key="index">
<view class="cell-view">
<AppliedCell @operate="handleOperate" @express="handleClickExpress" @action="handleClickCell" :info="item" :type="vertical" class="applied-cell"></AppliedCell>
</view>
</swiper-item>
</swiper>
</view>
<view class="bottom-view">
<view class="bottom-warehouse">
......@@ -62,12 +66,27 @@
},
data() {
return {
currentIndex: 0
}
},
computed: {
closeImage() {
return process.uniEnv.qn_base_url + 'dianjiquxiao.png'
},
spotlist() {
return [{
// image: 'https://cdn.uviewui.com/uview/swiper/1.jpg',
title: '昨夜星辰昨夜风，画楼西畔桂堂东'
},
{
// image: 'https://cdn.uviewui.com/uview/swiper/2.jpg',
title: '身无彩凤双飞翼，心有灵犀一点通'
},
{
// image: 'https://cdn.uviewui.com/uview/swiper/3.jpg',
title: '谁念西风独自凉，萧萧黄叶闭疏窗，沉思往事立残阳'
}
]
},
bottomItems() {
// index: 跳转到我的订单页面之后第几个tab,
......@@ -102,11 +121,14 @@
handleClose() {
this.$emit('update:show', false)
},
handleOperate(type) {
// 调接口
// 刷新页面
// 告诉父级做了操作
this.$emit('operate', type)
handleOperate(partsId, operateType, willStatus) {
this.$emit('operate', partsId, operateType, willStatus)
},
handleClickCell(info) {
this.$emit('action', info)
},
handleClickExpress() {
this.$emit('express', info)
},
handleApply() {
this.$emit('apply')
......@@ -134,7 +156,22 @@
flex-direction: column;
.list-content {
height: 100%;
height: 100%;
.swiper {
.cell-view {
height: 100%;
padding-bottom: 100rpx;
display: flex;
flex-direction: column;
.applied-cell {
border-radius: 12rpx;
margin:30rpx;
height: 100%;
box-shadow: 0px 6px 10px rgba(22,72,155,0.15);
}
}
}
}
.bottom-view {
......
src/pages/mine/warehouse/index.vue
View file @ 9d0a9f2c
......@@ -26,7 +26,7 @@
:customStyle="noPartsCustomStyle" />
<template v-else>
<view v-for="(item, index) in partsList" :key="item.id">
<AppliedCell @operate="handleOperate" :info="item" @action="handleClickCell"></AppliedCell>
<AppliedCell @operate="handleOperate" :info="item" @action="handleClickCell" @express="handleClickExpress"></AppliedCell>
</view>
<view class="load-more-view">
<u-loadmore v-show="(pageNumber == 1 && loaded) || pageNumber > 2" :status="loadStatus"
......@@ -129,6 +129,15 @@
getApp().trackPage('备件订单页')
this.reloadPartsList()
this._freshing = false;
},
onShow() {
// 从过程反馈回来，需要刷新数据
let pages = getCurrentPages()
let page = pages[pages.length - 1]
if (page.needApplyList) {
this.currentIndex = 0
this.reloadPartsList()
}
},
methods: {
// tab栏切换
......@@ -190,14 +199,23 @@
},
handleClickCell(info) {
var pages = getCurrentPages();
if (pages.length >= 1) {
var page = pages[pages.length - 1];
page.info = info
}
this.setPageInfo(info)
uni.navigateTo({
url: 'pages/mine/warehouse/partsDetail'
})
},
handleClickExpress(info) {
this.setPageInfo(info)
uni.navigateTo({
url: 'pages/mine/warehouse/express'
})
},
setPageInfo(info) {
var pages = getCurrentPages();
if (pages.length >= 1) {
var page = pages[pages.length - 1];
page.info = info
}
},
handleClickApply() {
uni.navigateTo({
......
src/pages/mine/warehouse/partsDetail.vue
View file @ 9d0a9f2c
......@@ -62,7 +62,8 @@
return {
info: {
items: [],
express: []
express: [],
status: '0'
},
logisticsRecords: [], // 物流
};
......@@ -132,7 +133,32 @@
'createTime': '申请时间：',
'deliveryTime': '发货时间：',
}
}
},
operateTypes() {
return {
'1': 'cancelParts',
'10': '',
'15': 'receiveParts',
'20': '',
}
},
buttonOperateType() {
return this.operateTypes[this.info.status]
},
// 待签收 15 变 已签收 20； 10 待审核 1 变 已取消 -1
willStatuses() {
return {
'1': '-1',
'10': '',
'15': '20',
'20': '',
'-2': '',
'-1': ''
}
},
willStatus() {
return this.willStatuses[this.info.status]
},
},
onLoad() {
getApp().trackPage('仓库配件详情')
......@@ -144,9 +170,28 @@
},
methods: {
handleClick() {
// 调借口
// 修改info
// 后退
this.$u.api[this.operateType](this.info.id).then(res => {
var type = 'error'
var message = res.message
if (res.code === 200) {
if (res.data == true) {
this.info.status = this.willStatus
}
} else {
console.log(res.message)
}
this.$refs.uToast.show({
title: message,
type: type,
duration: 1000,
callback: function() {}
})
var pages = getCurrentPages();
if (pages.length >= 2) {
var page = pages[pages.length - 2];
page.needApplyList = true
}
})
},
// 查看物流
handleClickExpress() {
......
src/pages/mine/warehouse/searchParts.vue
View file @ 9d0a9f2c
......@@ -28,7 +28,7 @@
<view class="content-item">
<view v-if="partsList && partsList.length > 0" class="order-row">
<view v-for="(item, index) in partsList" :key="item.orderId">
<AppliedCell @operate="handleOperate" :info="item" @action="handleClickCell"></AppliedCell>
<AppliedCell @operate="handleOperate" :info="item" @action="handleClickCell" @express="handleClickExpress"></AppliedCell>
</view>
<u-loadmore :status="loadStatus" bgColor="#F4F5F7"></u-loadmore>
</view>
......@@ -73,6 +73,14 @@
return 'margin-top: 100rpx;background-color: #F4F5F7'
},
},
onShow() {
// 从过程反馈回来，需要刷新数据
let pages = getCurrentPages()
let page = pages[pages.length - 1]
if (page.needApplyList) {
this.getPartsList()
}
},
methods: {
searchOrder(index) {
this.search.pageNumber = 1
......@@ -127,14 +135,23 @@
})
},
handleClickCell(info) {
this.setPageInfo(info)
uni.navigateTo({
url: 'pages/mine/warehouse/partsDetail'
})
},
handleClickExpress(info) {
this.setPageInfo(info)
uni.navigateTo({
url: 'pages/mine/warehouse/express'
})
},
setPageInfo(info) {
var pages = getCurrentPages();
if (pages.length >= 1) {
var page = pages[pages.length - 1];
page.info = info
}
uni.navigateTo({
url: 'pages/mine/warehouse/partsDetail'
})
},
},
onReachBottom() {
......
src/pages/order/detail.vue
View file @ 9d0a9f2c
<template>
<view class="order-wrap">
<u-navbar :title="title" title-color="#FFFFFF" title-size="32" back-icon-color="#FFFFFF" :background="background" :border-bottom="false" title-bold></u-navbar>
<u-navbar title-color="#FFFFFF" title-size="32" back-icon-color="#FFFFFF" :background="background" :border-bottom="false" title-bold></u-navbar>
<view class="content">
<view class="header" v-if="showTimeView">
<image class="bottom-tag-view" :src="tagImage"></image>
<!-- 倒计时 -->
<view class="title">
<u-count-down :timestamp="timestamp" font-size="28" show-days separator="zh" separator-size="32" height="40"
:color="countColor" separator-color="#FFFFFF" @change="timeOutChange" ref="order-count-down" bg-color="#FFFFFF"></u-count-down>
<view class="header-content">
<!-- 抓紧时间提示 -->
<view class="tip-text">{{tipText}}</view>
<!-- 拒单 -->
<view v-show="allowRejection" class="reject-button" @click="$u.throttle(rejectOrder, 500)">拒单</view>
</view>
</view>
<view class="title-view">
<view class="title-text">{{title}}</view>
<!-- 拒单 -->
<view v-show="allowRejection || 1" class="reject-button" @click="$u.throttle(rejectOrder, 500)">拒单</view>
</view>
<!-- 订单详情 -->
<view class="card">
<view class="header" v-if="showTimeView">
<view class="header-left-view">
<image class="bottom-tag-view" :src="tagImage"></image>
<view class="tip-text" :style="{'color': countColor}">{{tipText}}</view>
</view>
<!-- 倒计时 -->
<view class="title">
<u-count-down :timestamp="timestamp" font-size="28" show-days separator="zh" separator-size="32" height="40"
color="#FFFFFF" separator-color="#666666" @change="timeOutChange" ref="order-count-down" :bg-color="countColor"></u-count-down>
</view>
</view>
<Detail :order="order" :readMore.sync="readMore" :operate="isAllowDianhuaAndDaohang"></Detail>
</view>
<!-- 从我的页面进来显示结算信息 -->
......@@ -77,7 +79,7 @@
</view>
</u-popup>
<!-- 已申请配件列表 -->
<ApplyList :show.sync="showApplyList" :list="partsList" @operate="handleOperate" @apply="handleApply"></ApplyList>
<ApplyList :show.sync="showApplyList" :list="partsList" @action="handleClickCell" @operate="handleOperate" @apply="handleApply"></ApplyList>
</template>
</view>
</template>
......@@ -240,10 +242,10 @@
return this.timeout ? this.chaoshiImage : this.shengyuImage
},
chaoshiImage() {
return process.uniEnv.qn_base_url + 'chaoshi.png'
return process.uniEnv.qn_base_url + 'chaoshi-red.png'
},
shengyuImage() {
return process.uniEnv.qn_base_url + 'shengyu.png'
return process.uniEnv.qn_base_url + 'shengyu-blue.png'
},
types() {
return {
......@@ -268,13 +270,7 @@
return [this.type0Text,'预约','签到','去完工','','','','','已被抢','']
},
tipText() { // 时间紧迫提示文字
return this.timeout ? '您的订单已超时，请及时' + this.tipTypeText : '请您注意剩余时间，及时' + this.tipTypeText
},
tipTexts() {
return ['接单','预约','签到','完工','','','','','','']
},
tipTypeText() {
return this.tipTexts[this.types[this.type]]
return this.timeout ? '订单超时' : '剩余时间'
},
title() { // 标题
return this.titles[this.types[this.type]]
......@@ -359,6 +355,9 @@
this.loadOrderDetail()
this.loadOrderRecord()
}
if (page.needApplyList) {
this.getApplyList()
}
},
onUnload() {
this.unloaded = true
......@@ -655,9 +654,16 @@
break
}
},
async handleApplyParts() { // 点击了配件申请按钮
handleApplyParts() { // 点击了配件申请按钮
if (this.buttons[3].count > 0) { // 已经有配件,弹出配件列表
this.showApplyList = true
this.getApplyList()
} else { // 没有配件,跳到配件申请
this.toApplyParts()
}
},
async getApplyList() {
let res = await this.$u.api.applyList({
'pageSize': 1000,
'pageNumbr': 1,
......@@ -665,11 +671,8 @@
'workOrderId': this.order.orderId
})
if(res && res.code == 200) {
this.partsList = res.data
this.partsList = res.data || []
}
} else { // 没有配件,跳到配件申请
this.toApplyParts()
}
},
handleBtn() {
console.log('click button')
......@@ -907,7 +910,47 @@
// 添加客服
},
handleOperate() { // 点了弹窗里的配件操作
this.$u.api[operateType](partsId).then(res => {
var type = 'error'
var message = res.message
if (res.code === 200) {
if (res.data == true) {
for (var item of this.partsList) {
if (item.id == partsId) {
item.status = willStatus
break
}
}
}
} else {
console.log(res.message)
}
this.$refs.uToast.show({
title: message,
type: type,
duration: 1000,
callback: function() {}
})
})
},
handleClickCell(info) {
this.setPageInfo(info)
uni.navigateTo({
url: 'pages/mine/warehouse/partsDetail'
})
},
handleClickExpress(info) {
this.setPageInfo(info)
uni.navigateTo({
url: 'pages/mine/warehouse/express'
})
},
setPageInfo(info) {
var pages = getCurrentPages();
if (pages.length >= 1) {
var page = pages[pages.length - 1];
page.info = info
}
},
handleApply() { // 点了弹窗的申请配件
this.toApplyParts()
......@@ -926,14 +969,15 @@
margin-left: 6rpx;
margin-right: 6rpx;
}
.u-mode-center-box {
background-color: transparent !important;
padding-top: 40rpx;
}
}
</style>
<style lang="scss" scoped>
.order-wrap {
/deep/ .u-mode-center-box {
background-color: transparent !important;
}
width: 750rpx;
height: 100vh;
overflow: auto;
......@@ -944,55 +988,61 @@
display: flex;
flex-direction: column;
.header {
padding: 4rpx 2rpx 24rpx 2rpx;
display: flex;
align-items: center;
.bottom-tag-view {
width: 116rpx;
height: 116rpx;
flex-shrink: 0;
}
.title {
margin-left: 24rpx;
margin-top: 6rpx;
width: 100%;
.header-content {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 24rpx;
min-height: 36rpx;
.tip-text {
font-size: 26rpx;
color: #EFEFEF;
}
.reject-button {
text-align: center;
width: 106rpx;
height: 52rpx;
border-radius: 40rpx;
font-size: 24rpx;
font-weight: 400;
line-height: 52rpx;
color: #DEDEDE;
text-align: right;
}
}
}
}
.content {
height: 100%;
border-radius: 12rpx;
overflow: auto;
margin: 0rpx 30rpx 30rpx 30rpx;
.title-view {
display: flex;
justify-content: space-between;
align-items: flex-end;
margin-bottom: 20rpx;
.title-text {
font-weight: bold;
font-size: 48rpx;
color: #FFFFFF;
}
.reject-button {
width: 106rpx;
height: 52rpx;
font-size: 26rpx;
line-height: 52rpx;
color: #DEDEDE;
text-align: right;
margin-right: 4rpx;
}
}
.card {
background-color: #FFFFFF;
margin-bottom: 20rpx;
padding: 30rpx 30rpx 0 30rpx;
border-radius: 6px;
.header {
display: flex;
justify-content: space-between;
align-items: center;
border-bottom: 2rpx solid #F4F5F7;
padding-bottom: 30rpx;
margin-bottom: 30rpx;
.header-left-view {
display: flex;
align-items: center;
.bottom-tag-view {
width: 40rpx;
height: 40rpx;
margin-right: 10rpx;
}
.tip-text {
font-size: 32rpx;
font-weight: bold;
color: #2272FF;
}
}
}
}
.record-item {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment