hly
/
aluminium-trading-uniapp-240925
generated from hly/uniapp-shop-templates
1
0
Fork 0
Code Issues 0 Pull Requests 0 Projects 0 Releases 0 Wiki Activity
Browse Source

对接登录

master
前端-胡立永 8 months ago
parent
fe21e78da2
commit
37a6a6027d
6 changed files with 775 additions and 339 deletions
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +1
    -1
      config.js
  2. +473
    -0
      pages/index/index - 副本.vue
  3. +36
    -129
      pages/index/index.vue
  4. +62
    -4
      pages_order/auth/loginAndRegisterAndForgetPassword.vue
  5. +4
    -2
      pages_order/auth/registerShop.vue
  6. +199
    -203
      pages_order/components/order/orderList.vue

+ 1
- 1
config.js View File

@ -16,7 +16,7 @@ const config = {
baseUrl : 'http://www.gcosc.fun:82', baseUrl : 'http://www.gcosc.fun:82',
}, },
prod : { prod : {
baseUrl : 'http://42.194.239.145:8014/aluminium-prod',
baseUrl : 'https://aluminium-prod.hhlm1688.com/aluminium-prod',
} }
} }


+ 473
- 0
pages/index/index - 副本.vue View File

@ -0,0 +1,473 @@
<template>
<view class="page">
<!--顶部栏-->
<topbar showRight="1"></topbar>
<!-- 供应商 -->
<view class="supplier" v-if="userShop">
<!--上面第一个-->
<view class="topItem">
<view class="imageFrame">
<!-- <uv-swiper :list="bannerList[0]" height="320rpx" keyName="image">
</uv-swiper> -->
<img src="../../static/image/index/4.png" style="width:100%;height:100%;">
</view>
</view>
<!-- 下面三个-->
<view class="threeHeOne">
<!-- 第一个-->
<view class="oneItem">
<view class="left">
<!--<span>Company Profile</span>-->
<span> {{ $t('pages.index.index.companyProfile') }}</span>
<span class="subText"> {{ $t('pages.index.index.aluminiumProduct') }}</span>
</view>
<view class="right">
随着全球经济的快速发展，我们这家领先的企业公司应运而生，致力于为客户提供卓越的服务和优质的产品。我们公司成立于2001年，总部位于深圳市横岗大厦，拥有广泛的业务领域和专业的团队，专注于实现客户的期望和需求。
</view>
</view>
<!-- 第二个-->
<view class="twoItem">
<view class="left">
<img src="../../static/image/index/2.png" style="width:100%;height:100%;">
</view>
<view class="right">
<img src="../../static/image/index/3.png" style="width:100%;height:100%;">
</view>
</view>
<!-- 第三个-->
<view class="threeItem">
<view class="right">
随着全球经济的快速发展，我们这家领先的企业公司应运而生，致力于为客户提供卓越的服务和优质的产品。我们公司成立于2001年，总部位于深圳市横岗大厦，拥有广泛的业务领域和专业的团队，专注于实现客户的期望和需求。
</view>
<view class="left">
<!--<span>Company Profile</span>-->
<span> {{ $t('pages.index.index.companyProfile') }}</span>
<span class="subText"> {{ $t('pages.index.index.aluminiumProduct') }}</span>
</view>
</view>
</view>
<!--报价和挂单-->
<view class="btns">
<span @click="goToPage(0)" class="oneBtn">
{{ $t('other.supplierQuotation') }}
</span>
<!-- 这个提单不需要了 -->
<!-- <span @click="goToPage(1)" class="twoBtn">
{{ $t('other.supplierBilLading') }}
</span> -->
</view>
</view>
<!-- 采购商 -->
<view class="purchaser" v-else>
<!--上面第一个-->
<view class="topItem">
<view class="imageFrame">
<img src="../../static/image/index/4.png" style="width:100%;height:100%;">
</view>
</view>
<!-- 下面三个-->
<view class="threeHeOne">
<!-- 第一个-->
<view class="oneItem">
<view class="left">
<span>Company Profile</span>
<span> {{ $t('pages.index.index.companyProfile') }}</span>
<span class="subText"> {{ $t('pages.index.index.aluminiumProduct') }}</span>
</view>
<view class="right">
随着全球经济的快速发展，我们这家领先的企业公司应运而生，致力于为客户提供卓越的服务和优质的产品。我们公司成立于2001年，总部位于深圳市横岗大厦，拥有广泛的业务领域和专业的团队，专注于实现客户的期望和需求。
</view>
</view>
<!-- 第二个-->
<view class="twoItem">
<view class="left">
<img src="../../static/image/index/2.png" style="width:100%;height:100%;">
</view>
<view class="right">
<img src="../../static/image/index/3.png" style="width:100%;height:100%;">
</view>
</view>
<!-- 第三个-->
<view class="threeItem">
<view class="right">
随着全球经济的快速发展，我们这家领先的企业公司应运而生，致力于为客户提供卓越的服务和优质的产品。我们公司成立于2001年，总部位于深圳市横岗大厦，拥有广泛的业务领域和专业的团队，专注于实现客户的期望和需求。
</view>
<view class="left">
<span>Company Profile</span>
<span> {{ $t('pages.index.index.companyProfile') }}</span>
<span class="subText"> {{ $t('pages.index.index.aluminiumProduct') }}</span>
</view>
</view>
</view>
</view>
<tabber select="0" />
</view>
</template>
<script>
import topbar from '@/components/base/topbar.vue'
import tabber from '@/components/base/tabbar.vue'
import productList from '@/components/user/productList.vue'
import {
mapGetters
} from 'vuex'
import changeLanguage from '@/components/base/changeLanguage.vue'
export default {
components: {
tabber,
topbar,
productList,
changeLanguage
},
data() {
return {
queryParams: {
pageNo: 1,
pageSize: 10,
title: ''
},
bannerList: []
}
},
onShow() {
this.getImagePhoneOther()
if (!this.$store.state.shop && !this.$store.state.buy) {
uni.reLaunch({
url: '/pages_order/auth/selectionIdentity?back=no&'
})
}
this.$store.commit('getUserInfo')
this.getBannerList()
},
computed: {
...mapGetters(['userShop']),
},
methods: {
getBannerList() {
this.$api('bannerList', res => {
this.bannerList = res.result
})
},
goToPage(titleIndex) {
uni.navigateTo({
url: '/pages_order/order/offerOrBillLading?titleIndex=' + titleIndex
})
},
getImagePhoneOther() {
this.$api('getImagePhoneOther', res => {
})
},
}
}
</script>
<style scoped lang="scss">
* {
box-sizing: border-box;
}
.page {
background-color: #2e394d;
min-height: 100vh;
// 供应商
.supplier {
display: flex;
flex-direction: column;
height: calc(100vh - 120rpx - 120rpx);
background-color: #2e394d;
.topItem {
display: flex;
justify-content: center;
align-items: center;
height: 30%;
background-image: url('../../static/image/index/1.png');
background-size: cover;
.imageFrame {
width: 90%;
height: 90%;
//padding:80rpx;
}
}
.threeHeOne {
display: flex;
padding: 20rpx 40rpx 10rpx;
flex-direction: column;
height: 60%;
.oneItem {
display: flex;
height: 33%;
.left {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
gap: 10rpx;
width: 33%;
background-color: #1e293d;
color: white;
font-size: 26rpx;
.subText {
text-align: center;
width: 80%;
background-color: #2e394d;
padding: 0 20rpx;
}
}
.right {
//height: 30%;
width: 66%;
padding: 20rpx;
background-image: url('../../static/image/index/1.png');
background-size: cover;
font-size: 20rpx;
color: white;
}
}
.twoItem {
display: flex;
justify-content: space-between;
gap: 20rpx;
height: 33%;
margin-top: 20rpx;
padding: 10rpx;
.left {
width: 60%;
padding: 20rpx;
background-color: #1e293d;
}
.right {
width: 40%;
padding: 20rpx;
background-color: #1e293d;
}
}
.threeItem {
display: flex;
//width: 100vw;
height: 33%;
.left {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
gap: 20rpx;
width: 33%;
background-color: #1e293d;
color: white;
font-size: 26rpx;
.subText {
text-align: center;
background-color: #2e394d;
width: 80%;
padding: 0 20rpx;
}
}
.right {
//height: 200rpx;
width: 66%;
padding: 20rpx;
background-image: url('../../static/image/index/1.png');
background-size: cover;
font-size: 20rpx;
color: white;
}
}
}
.btns {
display: flex;
justify-content: center;
align-items: center;
gap: 40rpx;
.oneBtn {
display: flex;
align-items: center;
justify-content: center;
width: 40%;
height: 70rpx;
border-radius: 40rpx;
color: #1F1C39;
font-size: 28rpx;
margin: 20rpx 10rpx 0 0;
background: #f2f2f2;
//margin-top: 20rpx;
border-radius: 40rpx;
}
.twoBtn {
display: flex;
align-items: center;
justify-content: center;
width: 40%;
height: 70rpx;
border-radius: 40rpx;
color: #1F1C39;
font-size: 28rpx;
margin: 20rpx 10rpx 0 0;
background: #f2f2f2;
//margin-top: 20rpx;
border-radius: 40rpx;
}
}
}
// 采购商
.purchaser {
display: flex;
flex-direction: column;
//gap: 40rpx;
background-color: #2e394d;
.topItem {
display: flex;
justify-content: center;
align-items: center;
height: 280rpx;
background-image: url('../../static/image/index/1.png');
background-size: cover;
.imageFrame {
width: 90%;
height: 90%;
//padding:80rpx;
}
}
.threeHeOne {
display: flex;
padding: 20rpx 40rpx 10rpx;
flex-direction: column;
.oneItem {
display: flex;
.left {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
gap: 10rpx;
width: 33%;
background-color: #1e293d;
color: white;
font-size: 26rpx;
.subText {
background-color: #2e394d;
padding: 0 20rpx;
}
}
.right {
height: 180rpx;
width: 66%;
padding: 20rpx;
background-image: url('../../static/image/index/1.png');
background-size: cover;
font-size: 20rpx;
color: white;
}
}
.twoItem {
display: flex;
justify-content: space-between;
gap: 20rpx;
height: 280rpx;
margin-top: 20rpx;
padding: 10rpx;
.left {
width: 60%;
padding: 20rpx;
background-color: #1e293d;
}
.right {
width: 40%;
padding: 20rpx;
background-color: #1e293d;
}
}
.threeItem {
display: flex;
//width: 100vw;
.left {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
gap: 20rpx;
width: 33%;
background-color: #1e293d;
color: white;
font-size: 26rpx;
.subText {
background-color: #2e394d;
padding: 0 20rpx;
}
}
.right {
height: 200rpx;
width: 66%;
padding: 20rpx;
background-image: url('../../static/image/index/1.png');
background-size: cover;
font-size: 20rpx;
color: white;
}
}
}
}
}
</style>

+ 36
- 129
pages/index/index.vue View File

@ -6,73 +6,24 @@
<!-- 供应商 --> <!-- 供应商 -->
<view class="supplier" v-if="userShop">
<!--上面第一个-->
<view class="topItem">
<view class="imageFrame">
<uv-swiper
:list="bannerList[0]"
height="320rpx"
keyName="image">
</uv-swiper>
<!--<img src="../../static/image/index/4.png" style="width:100%;height:100%;">-->
</view>
</view>
<!-- 下面三个-->
<view class="threeHeOne">
<!-- 第一个-->
<view class="oneItem">
<view class="left">
<!--<span>Company Profile</span>-->
<span> {{ $t('pages.index.index.companyProfile') }}</span>
<span class="subText"> {{ $t('pages.index.index.aluminiumProduct') }}</span>
</view>
<view class="right">
随着全球经济的快速发展，我们这家领先的企业公司应运而生，致力于为客户提供卓越的服务和优质的产品。我们公司成立于2001年，总部位于深圳市横岗大厦，拥有广泛的业务领域和专业的团队，专注于实现客户的期望和需求。
</view>
</view>
<!-- 第二个-->
<view class="twoItem">
<view class="left">
<uv-swiper
:list="bannerList[1]"
keyName="image"
>
</uv-swiper>
<!--<img src="../../static/image/index/2.png" style="width:100%;height:100%;">-->
</view>
<view class="right">
<uv-swiper
:list="bannerList[2]"
keyName="image"
>
</uv-swiper>
<!--<img src="../../static/image/index/3.png" style="width:100%;height:100%;">-->
</view>
</view>
<!-- 第三个-->
<view class="threeItem">
<view class="right">
随着全球经济的快速发展，我们这家领先的企业公司应运而生，致力于为客户提供卓越的服务和优质的产品。我们公司成立于2001年，总部位于深圳市横岗大厦，拥有广泛的业务领域和专业的团队，专注于实现客户的期望和需求。
</view>
<view class="left">
<!--<span>Company Profile</span>-->
<span> {{ $t('pages.index.index.companyProfile') }}</span>
<span class="subText"> {{ $t('pages.index.index.aluminiumProduct') }}</span>
</view>
</view>
<view class="supplier">
<view style="padding: 40rpx 0;"
v-for="(item, index) in bannerList">
<uv-swiper
:list="item"
:height="bannerSize[index]"
keyName="image">
</uv-swiper>
<!-- imgMode="widthFix" -->
</view> </view>
<!--报价和挂单--> <!--报价和挂单-->
<view class="btns">
<view class="btns" v-if="userShop">
<span @click="goToPage(0)" class="oneBtn"> <span @click="goToPage(0)" class="oneBtn">
{{ $t('other.supplierQuotation') }} {{ $t('other.supplierQuotation') }}
</span> </span>
<!-- 这个提单不需要了 --> <!-- 这个提单不需要了 -->
<!-- <span @click="goToPage(1)" class="twoBtn"> <!-- <span @click="goToPage(1)" class="twoBtn">
{{ $t('other.supplierBilLading') }} {{ $t('other.supplierBilLading') }}
@ -80,64 +31,20 @@
</view> </view>
</view> </view>
<!-- 采购商 -->
<view class="purchaser" v-else>
<!--上面第一个-->
<view class="topItem">
<view class="imageFrame">
<img src="../../static/image/index/4.png" style="width:100%;height:100%;">
</view>
</view>
<!-- 下面三个-->
<view class="threeHeOne">
<!-- 第一个-->
<view class="oneItem">
<view class="left">
<span>Company Profile</span>
<span> {{ $t('pages.index.index.companyProfile') }}</span>
<span class="subText"> {{ $t('pages.index.index.aluminiumProduct') }}</span>
</view>
<view class="right">
随着全球经济的快速发展，我们这家领先的企业公司应运而生，致力于为客户提供卓越的服务和优质的产品。我们公司成立于2001年，总部位于深圳市横岗大厦，拥有广泛的业务领域和专业的团队，专注于实现客户的期望和需求。
</view>
</view>
<!-- 第二个-->
<view class="twoItem">
<view class="left">
<img src="../../static/image/index/2.png" style="width:100%;height:100%;">
</view>
<view class="right">
<img src="../../static/image/index/3.png" style="width:100%;height:100%;">
</view>
</view>
<!-- 第三个-->
<view class="threeItem">
<view class="right">
随着全球经济的快速发展，我们这家领先的企业公司应运而生，致力于为客户提供卓越的服务和优质的产品。我们公司成立于2001年，总部位于深圳市横岗大厦，拥有广泛的业务领域和专业的团队，专注于实现客户的期望和需求。
</view>
<view class="left">
<span>Company Profile</span>
<span> {{ $t('pages.index.index.companyProfile') }}</span>
<span class="subText"> {{ $t('pages.index.index.aluminiumProduct') }}</span>
</view>
</view>
</view>
</view>
<tabber select="0" /> <tabber select="0" />
</view> </view>
</template> </template>
<script> <script>
import topbar from '@/components/base/topbar.vue'
import tabber from '@/components/base/tabbar.vue'
import productList from '@/components/user/productList.vue'
import {mapGetters} from 'vuex'
import changeLanguage from '@/components/base/changeLanguage.vue'
export default {
import topbar from '@/components/base/topbar.vue'
import tabber from '@/components/base/tabbar.vue'
import productList from '@/components/user/productList.vue'
import {
mapGetters
} from 'vuex'
import changeLanguage from '@/components/base/changeLanguage.vue'
export default {
components: { components: {
tabber, tabber,
topbar, topbar,
@ -151,38 +58,39 @@ export default {
pageSize: 10, pageSize: 10,
title: '' title: ''
}, },
bannerList: []
bannerList: [],
bannerSize : ['420rpx', '220rpx', '220rpx'],
} }
}, },
onShow(){
onShow() {
this.getImagePhoneOther() this.getImagePhoneOther()
if(!this.$store.state.shop && !this.$store.state.buy){
if (!this.$store.state.shop && !this.$store.state.buy) {
uni.reLaunch({ uni.reLaunch({
url: '/pages_order/auth/selectionIdentity?back=no&' url: '/pages_order/auth/selectionIdentity?back=no&'
}) })
} }
this.$store.commit('getUserInfo') this.$store.commit('getUserInfo')
this.getBannerList()
this.getBannerList()
}, },
computed: { computed: {
...mapGetters(['userShop']), ...mapGetters(['userShop']),
}, },
methods: { methods: {
getBannerList() {
this.$api('bannerList', res => {
this.bannerList = res.result
})
},
getBannerList() {
this.$api('bannerList', res => {
this.bannerList = res.result
})
},
goToPage(titleIndex) { goToPage(titleIndex) {
uni.navigateTo({ uni.navigateTo({
url: '/pages_order/order/offerOrBillLading?titleIndex=' + titleIndex url: '/pages_order/order/offerOrBillLading?titleIndex=' + titleIndex
}) })
}, },
getImagePhoneOther(){
getImagePhoneOther() {
this.$api('getImagePhoneOther', res => { this.$api('getImagePhoneOther', res => {
}) })
}, },
} }
@ -197,6 +105,7 @@ export default {
.page { .page {
background-color: #2e394d; background-color: #2e394d;
min-height: 100vh; min-height: 100vh;
background-image: url('../../static/image/index/1.png');
// 供应商 // 供应商
.supplier { .supplier {
display: flex; display: flex;
@ -204,13 +113,11 @@ export default {
height: calc(100vh - 120rpx - 120rpx); height: calc(100vh - 120rpx - 120rpx);
background-color: #2e394d; background-color: #2e394d;
.topItem { .topItem {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
height: 30%; height: 30%;
background-image: url('../../static/image/index/1.png');
background-size: cover; background-size: cover;
.imageFrame { .imageFrame {
@ -246,7 +153,7 @@ export default {
font-size: 26rpx; font-size: 26rpx;
.subText { .subText {
text-align: center;
text-align: center;
width: 80%; width: 80%;
background-color: #2e394d; background-color: #2e394d;
padding: 0 20rpx; padding: 0 20rpx;
@ -303,7 +210,7 @@ export default {
font-size: 26rpx; font-size: 26rpx;
.subText { .subText {
text-align: center;
text-align: center;
background-color: #2e394d; background-color: #2e394d;
width: 80%; width: 80%;
padding: 0 20rpx; padding: 0 20rpx;


+ 62
- 4
pages_order/auth/loginAndRegisterAndForgetPassword.vue View File

@ -4,7 +4,58 @@
<view class="frame"> <view class="frame">
<!-- 登录和注册 -->
<!-- 注册 -->
<view class='forgetPassword' v-if='titleIndex == 0'>
<!-- 标题 -->
<view class="title">{{titleList[titleIndex]}}</view>
<!-- 表单 -->
<view class="form1">
<view class="userName">
<uv-input v-model="form1.username" placeholder="请输入手机号" border="surround" shape='circle'
clearable :customStyle="{ backgroundColor: '#f6f6f6'}"></uv-input>
</view>
<view class="code">
<view class="left">
<uv-input v-model="form1.captcha" placeholder="请输入验证码" border="surround" shape='circle'
clearable :customStyle="{ backgroundColor: '#f6f6f6'}"></uv-input>
</view>
<view class="right">
<view>
<uv-toast ref="toast"></uv-toast>
<uv-code :seconds="seconds" @end="end" @start="start" ref="code"
@change="codeChange"></uv-code>
<uv-button @tap="getCode" iconSize='10rpx' color='#1f1c39'
shape='circle'>{{tips}}</uv-button>
</view>
</view>
</view>
<view class="password1">
<uv-input v-model="form1.password" placeholder="设置您的新密码(6到50个字符)" password clearable
border="surround" shape='circle' :customStyle="{ backgroundColor: '#f6f6f6'}"></uv-input>
</view>
<view class="password2">
<uv-input v-model="form1.newPassword" placeholder="重新确认密码" password clearable border="surround"
shape='circle' :customStyle="{ backgroundColor: '#f6f6f6'}"></uv-input>
</view>
</view>
<view>
<uv-checkbox-group v-model="checkboxValue" shape="circle">
<view class="content">
<view style="display: flex;">
<uv-checkbox size="30rpx" :name="1"></uv-checkbox>
请你阅读并同意我们的<span style="color: #fd5100"
@click="$refs.popup.open('getPrivacyPolicy')">《隐私条款》</span>和<span
style="color: #fd5100"
@click="$refs.popup.open('getUserAgreement')">《服务协议》</span>
</view>
</view>
</uv-checkbox-group>
</view>
</view>
<!-- 登录 -->
<view class="loginRegister" v-if='titleIndex==1'> <view class="loginRegister" v-if='titleIndex==1'>
<!-- 标题 --> <!-- 标题 -->
<view class="title">{{titleList[titleIndex]}}</view> <view class="title">{{titleList[titleIndex]}}</view>
@ -45,7 +96,7 @@
</view> </view>
<!-- 忘记密码 --> <!-- 忘记密码 -->
<view class='forgetPassword' v-if='titleIndex != 1'>
<view class='forgetPassword' v-if='titleIndex == 2'>
<!-- 标题 --> <!-- 标题 -->
<view class="title">{{titleList[titleIndex]}}</view> <view class="title">{{titleList[titleIndex]}}</view>
@ -124,7 +175,7 @@
checkboxValue: [], checkboxValue: [],
form: { form: {
username: '19330214982', username: '19330214982',
password: '123456',
password: '1234567',
loginModel: 0, loginModel: 0,
captcha: '', captcha: '',
}, },
@ -205,6 +256,7 @@
} }
this.$api('registerUser', this.form1, res => { this.$api('registerUser', this.form1, res => {
this.form1 = {}
if (res.code == 200) { if (res.code == 200) {
this.titleIndex = 1 this.titleIndex = 1
uni.showToast({ uni.showToast({
@ -304,6 +356,11 @@
* { * {
box-sizing: border-box; box-sizing: border-box;
} }
.content{
font-size: 22rpx;
margin: 0 auto;
}
.refundsOrExchange { .refundsOrExchange {
background-color: #FFF; background-color: #FFF;
@ -316,6 +373,7 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 40rpx; gap: 40rpx;
padding-bottom: 50rpx;
.title { .title {
display: flex; display: flex;
@ -354,7 +412,7 @@
>view:nth-of-type(3) { >view:nth-of-type(3) {
display: flex; display: flex;
padding: 30rpx 100rpx 0 100rpx; padding: 30rpx 100rpx 0 100rpx;
font-size: 22rpx
font-size: 22rpx;
} }
} }
} }


+ 4
- 2
pages_order/auth/registerShop.vue View File

@ -8,9 +8,11 @@
<view class="basicInfo"> <view class="basicInfo">
<!--用户名--> <!--用户名-->
<view class="item"> <view class="item">
<view>{{ $t('components.username')}}</view>
<view>账号/手机号</view>
<!-- <view>{{ $t('components.username')}}</view> -->
<view> <view>
<input v-model="form.userName" :placeholder="$t('components.enterUserName')" clearable></input>
<!-- <input v-model="form.userName" :placeholder="$t('components.enterUserName')" clearable></input> -->
<input v-model="form.userName" placeholder="请输入账号/手机号" clearable></input>
</view> </view>
</view> </view>
<!--密码--> <!--密码-->


+ 199
- 203
pages_order/components/order/orderList.vue View File

@ -1,212 +1,208 @@
<template> <template>
<view class="page">
<view v-if="list.length>0" class="item" v-for="(item, index) in list" :key="index">
<view class="top">
<view class="service">
<text>{{ $t('other.aluminumProducts') }}</text>
</view>
<view class="status">
<text> {{ item.auditStatus_dictText }}</text>
</view>
</view>
<view class="zhuti">
<view class="left">
<img :src="item.pic" style="width: 100%;height: 100%;"/>
</view>
<view class="right" @click="lookDetail(item,index)">
<view class="text-hidden-1"
v-if="item.userName">
{{ $t('components.customerName') }} ：{{ item.userName }}
</view>
<view class="text-hidden-1"
v-if="item.phone">
客户电话：{{ item.phone }}
</view>
<view class="text-hidden-1">
{{ $t('other.pickupAddress') }}：{{ item.address }}
</view>
<view class="text-hidden-1">
{{ $t('other.pickupDate') }}：{{ item.createTime }}
</view>
</view>
<view class="tip">
<!--审核状态 0审核中 1 审核通过 2审核未通过-->
<img v-if="item.auditStatus==0" src="../../static/order/3.svg" style="width: 100%;height: 100%;"/>
<img v-if="item.auditStatus==1" src="../../static/order/1.svg" style="width: 100%;height: 100%;"/>
<img v-if="item.auditStatus==2" src="../../static/order/2.svg" style="width: 100%;height: 100%;"/>
</view>
</view>
<!--撤单按钮-->
<view class="bottom" v-if="showBackOrder">
<view @click="backOrder(item.id)" class="btn">
{{ $t('other.withdrawOrder') }}
</view>
</view>
</view>
<!--无历史记录-->
<view
style="padding: 100rpx 0;"
v-else>
<uv-empty
mode="history"
textSize="28rpx"
iconSize="100rpx"/>
</view>
</view>
<view class="page">
<view v-if="list.length>0" class="item" v-for="(item, index) in list" :key="index">
<view class="top">
<view class="service">
<text>{{ $t('other.aluminumProducts') }}</text>
</view>
<view class="status">
<text v-if="item.showStatus"> {{ item.showStatus_dictText }}</text>
<text v-else> {{ item.auditStatus_dictText }}</text>
</view>
</view>
<view class="zhuti">
<view class="left">
<img :src="item.pic" style="width: 100%;height: 100%;" />
</view>
<view class="right" @click="lookDetail(item,index)">
<view class="text-hidden-1" v-if="item.userName">
{{ $t('components.customerName') }} ：{{ item.userName }}
</view>
<view class="text-hidden-1" v-if="item.phone">
客户电话：{{ item.phone }}
</view>
<view class="text-hidden-1">
{{ $t('other.pickupAddress') }}：{{ item.address }}
</view>
<view class="text-hidden-1">
{{ $t('other.pickupDate') }}：{{ item.createTime }}
</view>
</view>
<view class="tip" v-if="item.showStatus == 0">
<!--审核状态 0审核中 1 审核通过 2审核未通过-->
<img v-if="item.auditStatus==0" src="../../static/order/3.svg" style="width: 100%;height: 100%;" />
<img v-if="item.auditStatus==1" src="../../static/order/1.svg" style="width: 100%;height: 100%;" />
<img v-if="item.auditStatus==2" src="../../static/order/2.svg" style="width: 100%;height: 100%;" />
</view>
</view>
<!--撤单按钮-->
<view class="bottom" v-if="showBackOrder && item.showStatus == 0">
<view @click="backOrder(item.id)" class="btn">
{{ $t('other.withdrawOrder') }}
</view>
</view>
</view>
<!--无历史记录-->
<view style="padding: 100rpx 0;" v-else>
<uv-empty mode="history" textSize="28rpx" iconSize="100rpx" />
</view>
</view>
</template> </template>
<script> <script>
export default {
name: "orderList",
props: {
list: {
type: Array,
default: false
},
showBackOrder: {
type: Boolean,
default: false
}
},
data() {
return {}
},
methods: {
// 查看详情
lookDetail(item, index) {
// 交易平台的列表只用于展示，有撤单的说明是我的挂单，则可以查看详情
if (this.showBackOrder){
// uni.navigateTo({
// url: `/pages_order/order/orderDetail2?id`+item.id
// })
uni.navigateTo({
url: `/pages_order/order/myOrderDetail?orderInfo=${encodeURIComponent(JSON.stringify(item))}`
});
}
},
// 撤单
backOrder(id) {
let self = this
uni.showModal({
title: self.$t('other.backOrderTitle'),
content: self.$t('other.backOrderTitleConfirm'),
success(e) {
if(e.confirm){
self.$api('noShow', {id}, res => {
if (res.code == 200) {
uni.showToast({
title: self.$t('other.backOrderSuccess'),
icon: 'none'
})
self.$emit("getList")
}
})
}
}
})
},
}
}
export default {
name: "orderList",
props: {
list: {
type: Array,
default: false
},
showBackOrder: {
type: Boolean,
default: false
}
},
data() {
return {}
},
methods: {
// 查看详情
lookDetail(item, index) {
// 交易平台的列表只用于展示，有撤单的说明是我的挂单，则可以查看详情
if (this.showBackOrder && item.showStatus == 0) {
// uni.navigateTo({
// url: `/pages_order/order/orderDetail2?id`+item.id
// })
uni.navigateTo({
url: `/pages_order/order/myOrderDetail?orderInfo=${encodeURIComponent(JSON.stringify(item))}`
});
}
},
// 撤单
backOrder(id) {
let self = this
uni.showModal({
title: self.$t('other.backOrderTitle'),
content: self.$t('other.backOrderTitleConfirm'),
success(e) {
if (e.confirm) {
self.$api('noShow', {
id
}, res => {
if (res.code == 200) {
uni.showToast({
title: self.$t('other.backOrderSuccess'),
icon: 'none'
})
self.$emit("getList")
}
})
}
}
})
},
}
}
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.page {
display: flex;
flex-direction: column;
gap: 20rpx;
height: calc(90vh - 180rpx);
.item {
padding: 20rpx;
border-radius: 40rpx;
background-color: #fff;
overflow: hidden;
.top {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 30rpx;
.service {
color: #000;
}
.status {
color: #8d8d8d;
font-size: 26rpx;
font-weight: 600;
}
}
.zhuti {
display: flex;
margin: 10rpx 0;
position: relative;
.left {
width: 150rpx;
height: 150rpx;
border-radius: 10rpx;
image {
width: 150rpx;
height: 150rpx;
border-radius: 10rpx;
}
}
.right {
width: calc(100% - 160rpx);
color: #777;
font-size: 24rpx;
padding-left: 20rpx;
line-height: 40rpx;
background-color: #f8f8f8;
}
.tip {
width: 80rpx;
height: 80rpx;
position: absolute;
bottom: -20rpx;
right: -20rpx;
}
}
.bottom {
.btn {
display: flex;
align-items: center;
justify-content: center;
width: 40%;
height: 50rpx;
border-radius: 40rpx;
color: #afafaf;
font-size: 28rpx;
margin: 20rpx 10rpx 0 0;
background: #ffffff;
border: 1px solid #757986;
//margin-top: 20rpx;
border-radius: 40rpx;
}
}
}
}
.page {
display: flex;
flex-direction: column;
gap: 20rpx;
height: calc(90vh - 180rpx);
.item {
padding: 20rpx;
border-radius: 40rpx;
background-color: #fff;
overflow: hidden;
.top {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 30rpx;
.service {
color: #000;
}
.status {
color: #8d8d8d;
font-size: 26rpx;
font-weight: 600;
}
}
.zhuti {
display: flex;
margin: 10rpx 0;
position: relative;
.left {
width: 150rpx;
height: 150rpx;
border-radius: 10rpx;
image {
width: 150rpx;
height: 150rpx;
border-radius: 10rpx;
}
}
.right {
width: calc(100% - 160rpx);
color: #777;
font-size: 24rpx;
padding-left: 20rpx;
line-height: 40rpx;
background-color: #f8f8f8;
}
.tip {
width: 80rpx;
height: 80rpx;
position: absolute;
bottom: -20rpx;
right: -20rpx;
}
}
.bottom {
.btn {
display: flex;
align-items: center;
justify-content: center;
width: 40%;
height: 50rpx;
border-radius: 40rpx;
color: #afafaf;
font-size: 28rpx;
margin: 20rpx 10rpx 0 0;
background: #ffffff;
border: 1px solid #757986;
//margin-top: 20rpx;
border-radius: 40rpx;
}
}
}
}
</style> </style>

Write Preview
Loading…
Cancel
Save