用工小程序前端代码
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.
 
 
 

178 lines
3.9 KiB

<template>
<view>
<u-sticky bgColor="#ff7a31">
<u-tabs :list="nav" :current="current" lineColor="#ffffff" :activeStyle="{
color: '#ffffff',
transform: 'scale(1.05)'
}" :inactiveStyle="{
color: '#f5f5f5',
transform: 'scale(1)'
}" :scrollable="true" itemStyle="padding-left: 60rpx; padding-right: 60rpx;font-size:22rpx; height: 100rpx;"
@change="handleChangeTab"></u-tabs>
</u-sticky>
<view class="se-p-40">
<view class="se-px-40 se-mb-30 se-py-30 se-bgc-white se-br-40 se-bs-b" v-for="item in list" :key="item.id">
<view class="se-flex se-flex-h-sb se-fw-6 se-fs-32 se-pb-20">
<view class="se-flex">
<text>{{item.companyName}}</text>
<u-icon name="arrow-right"></u-icon>
</view>
<view class="se-c-red">
{{getOrderStatus(item.orderStatus)}}
</view>
</view>
<view class="se-flex se-bgc-f5 se-br-20">
<view class="se-w-160 se-h-160">
<image class="se-w-160 se-h-160 se-br-10" src="https://cdn.uviewui.com/uview/album/1.jpg"
mode=""></image>
</view>
<view class="se-ml-20 se-flex se-flex-v-sa se-flex-ai-fs">
<view class="se-fs-24 se-c-text-third se-display-ib">师傅姓名: {{item.workName}}</view>
<view class="se-fs-24 se-c-text-third se-display-ib">接单时间: {{item.createTime}}</view>
<view class="se-fs-24 se-c-text-third se-display-ib">联系电话: {{item.phone}}</view>
</view>
</view>
<view class="se-flex se-flex-h-sb se-w-p-100 se-pt-20">
<view class="se-fs-24 se-display-ib">
<text class="se-c-black">总价格:</text>
<text class="se-c-orange se-fs-30 se-fw-6"><text class="se-fs-24">¥</text>{{item.amount}}</text>
</view>
<view
class="se-display-ib se-px-20 se-br-40 se-flex-h-c se-h-50 se-lh-50 se-ta-c se-fs-24 se-fs-24 se-c-66 se-b">
<text>联系客服</text>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
import {
workOrderList
} from "@/common/api.js"
export default {
components: {
},
data() {
return {
current: 0,
nav: [{
name: '全部',
},
{
name: '待接单',
},
{
name: '已接单',
},
{
name: '进行中',
},
{
name: '试工完成',
},
{
name: '企业确认',
},
{
name: '已支付',
},
{
name: '已完成',
},
{
name: '已取消',
},
{
name: '发起支付',
}
],
list: [],
orderStatus: null,
pageNo: 1,
pageSize: 20,
}
},
computed: {
getOrderStatus() {
return function(status) {
let text = ''
switch (status) {
case 0:
text = "待聘用"
break;
case 1:
text = "已接单"
break;
case 2:
text = "进行中"
break;
case 3:
text = "试工完成"
break;
case 4:
text = "企业确认"
break;
case 5:
text = "已支付"
break;
case 6:
text = "已完成"
break;
case 7:
text = "已取消"
break;
case 8:
text = "发起支付"
break;
}
return text;
}
}
},
created() {
// 初始数据获取
},
mounted() {
this.onOrder()
},
methods: {
onOrder(selectNew) {
let params = {
orderStatus: this.orderStatus,
pageNo: this.pageNo,
pageSize: this.pageSize
}
workOrderList(params).then(response => {
const {
code,
result
} = response
if (code === 200) {
if (selectNew) {
this.list = result.records
} else {
this.list = [...this.list, ...result.records]
}
}
}).catch(error => {
})
},
handleChangeTab({
index
}) {
this.pageNo = 1
this.current = index
this.orderStatus = index === 0 ? "" : index - 1
this.onOrder(true)
}
}
}
</script>
<style>
</style>