Commit 28b397c8 authored by 潘永坪's avatar 潘永坪

订单页面修改

parent d815641e
<p align="center">
<img alt="logo" src="https://uviewui.com/common/logo.png" width="120" height="120" style="margin-bottom: 10px;">
</p>
<h3 align="center" style="margin: 30px 0 30px;font-weight: bold;font-size:40px;">uView</h3>
<h3 align="center">多平台快速开发的UI框架</h3>
## 说明
uView UI,是[uni-app](https://uniapp.dcloud.io/)生态优秀的UI框架,全面的组件和便捷的工具会让您信手拈来,如鱼得水
## 特性
- 兼容安卓,iOS,微信小程序,H5,QQ小程序,百度小程序,支付宝小程序,头条小程序
- 60+精选组件,功能丰富,多端兼容,让您快速集成,开箱即用
- 众多贴心的JS利器,让您飞镖在手,召之即来,百步穿杨
- 众多的常用页面和布局,让您专注逻辑,事半功倍
- 详尽的文档支持,现代化的演示效果
- 按需引入,精简打包体积
## 安装
```bash
# npm方式安装
npm i uview-ui
```
## 快速上手
1. `main.js`引入uView库
```js
// main.js
import uView from 'uview-ui';
Vue.use(uView);
```
2. `App.vue`引入基础样式(注意style标签需声明scss属性支持)
```css
/* App.vue */
<style lang="scss">
@import "uview-ui/index.scss";
</style>
```
3. `uni.scss`引入全局scss变量文件
```css
/* uni.scss */
@import "uview-ui/theme.scss";
```
4. `pages.json`配置easycom规则(按需引入)
```js
// pages.json
{
"easycom": {
// npm安装的方式不需要前面的"@/",下载安装的方式需要"@/"
// npm安装方式
"^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"
// 下载安装方式
// "^u-(.*)": "@/uview-ui/components/u-$1/u-$1.vue"
},
// 此为本身已有的内容
"pages": [
// ......
]
}
```
请通过[快速上手](https://uviewui.com/components/quickstart.html)了解更详细的内容
## 使用方法
配置easycom规则后,自动按需引入,无需`import`组件,直接引用即可。
```html
<template>
<u-button>按钮</u-button>
</template>
```
请通过[快速上手](https://uviewui.com/components/quickstart.html)了解更详细的内容
## 链接
- [官方文档](https://uviewui.com/)
- [更新日志](https://uviewui.com/components/changelog.html)
- [升级指南](https://uviewui.com/components/changelog.html)
- [关于我们](https://uviewui.com/cooperation/about.html)
## 预览
您可以通过**微信**扫码,查看最佳的演示效果。
<br>
<br>
<img src="https://uviewui.com/common/weixin_mini_qrcode.png" width="220" height="220" >
<!-- ## 捐赠uView的研发
uView文档和源码全部开源免费,如果您认为uView帮到了您的开发工作,您可以捐赠uView的研发工作,捐赠无门槛,哪怕是一杯可乐也好(相信这比打赏主播更有意义)。
<img src="https://uviewui.com/common/wechat.png" width="220" >
<img style="margin-left: 100px;" src="https://uviewui.com/common/alipay.png" width="220" >
-->
## 版权信息
uView遵循[MIT](https://en.wikipedia.org/wiki/MIT_License)开源协议,意味着您无需支付任何费用,也无需授权,即可将uView应用到您的产品中。
...@@ -63,9 +63,44 @@ export default{ ...@@ -63,9 +63,44 @@ export default{
var c = b.replace(regss,'') var c = b.replace(regss,'')
return c return c
}, },
getDistance:function(lat1,lng1,lat2,lng2){//计算距离
var EARTH_RADIUS = 6378137.0 //单位M
var PI = Math.PI
function getRad(d){
return d*PI/180.0
}
var f = getRad((lat1 + lat2)/2)
var g = getRad((lat1 - lat2)/2)
var l = getRad((lng1 - lng2)/2)
var sg = Math.sin(g)
var sl = Math.sin(l)
var sf = Math.sin(f)
var s,c,w,r,d,h1,h2
var a = EARTH_RADIUS
var fl = 1/298.257
sg = sg*sg
sl = sl*sl
sf = sf*sf
s = sg*(1-sl) + (1-sf)*sl
c = (1-sg)*(1-sl) + sf*sl
w = Math.atan(Math.sqrt(s/c))
r = Math.sqrt(s*c)/w
d = 2*w*a
h1 = (3*r -1)/2/c
h2 = (3*r +1)/2/s
return d*(1 + fl*(h1*sf*(1-sg) - h2*(1-sf)*sg))
},
phoneReg:function(){//手机正则 phoneReg:function(){//手机正则
return /^(13[0-9]|14[0-9]|15[0-9]|18[0-9]|17[0-9]|19[0-9]|16[0-9])\d{8}$/ return /^(13[0-9]|14[0-9]|15[0-9]|18[0-9]|17[0-9]|19[0-9]|16[0-9])\d{8}$/
}, },
idReg:function(){//身份证正则
return /^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X|x)$/
},
getUrlKey:function(name,url){//通过连接地址获取参数值 getUrlKey:function(name,url){//通过连接地址获取参数值
return(new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(decodeURIComponent(url)) || [, ''])[1].replace(/\+/g, '%20') || '' return(new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(decodeURIComponent(url)) || [, ''])[1].replace(/\+/g, '%20') || ''
}, },
......
...@@ -67,8 +67,9 @@ ...@@ -67,8 +67,9 @@
</view> </view>
<view class="bottom-btn"> <view class="bottom-btn">
<text class="button-empty" @click="goMyPhoto()">我的影集</text> <text class="button-empty" @click="goMyPhoto()">我的影集</text>
<text class="button" @click="download()">下载</text> <!-- 全部退货退款时不显示 -->
<text class="button" @click="showPop=true">打印</text> <text class="button" @click="download()" v-if="orderInfo.orderStatus!=8">下载</text>
<text class="button" @click="showPop=true" v-if="orderInfo.orderStatus!=8">打印</text>
</view> </view>
</view> </view>
......
...@@ -34,7 +34,7 @@ export default { ...@@ -34,7 +34,7 @@ export default {
maxDate:'',//最大日期 maxDate:'',//最大日期
} }
}, },
created() { //默认为第一天 mounted() { //默认为第一天
this.$refs.calendar2.setFormatter(this.formatter) this.$refs.calendar2.setFormatter(this.formatter)
}, },
methods: { methods: {
......
...@@ -52,7 +52,7 @@ ...@@ -52,7 +52,7 @@
</text> </text>
</view> </view>
<view> <view>
<image src="../static/images/scenicSingleOrder/chooseArea.jpg" mode="widthFix"></image> <image src="../static/scenic/chooseArea.jpg" mode="widthFix"></image>
</view> </view>
<view> <view>
...@@ -79,7 +79,7 @@ ...@@ -79,7 +79,7 @@
</view> </view>
<view class="bottom2"> <view class="bottom2">
<image src="../static/images/scenicSingleOrder/chooseArea.jpg" mode="widthFix"></image> <image src="../static/scenic/chooseArea.jpg" mode="widthFix"></image>
<view style="margin-top: 20rpx;">选错站点可导致排队号码无效。</view> <view style="margin-top: 20rpx;">选错站点可导致排队号码无效。</view>
<view>若无法确定站点,请向索道工作人员咨询。</view> <view>若无法确定站点,请向索道工作人员咨询。</view>
</view> </view>
......
<template>
<view>
<u-popup :show="show" :round="10" closeable @close="show=false">
<view class="detail">
<view class="detail-title">
费用明细
</view>
<view class="detail-content">
<view class="content-box">
<text>
{{merchantName}}({{name}})
</text>
<view class="content-right">
<view>¥{{sellingPrice}}x{{buyNum}}</view>
<view v-if="productDepositTotal">押金:{{productDepositTotal}}</view>
</view>
</view>
<!-- ---------------------------------------额外服务------------------------------------------- -->
<view class="content-box" v-for="(item,index) of choooseServiceData" :key="index">
<text>
{{item.name}}
</text>
<view class="content-right">
<view>¥{{item.sellingPrice}}x{{buyNum}}</view>
<view v-if="item.depositTotal">押金:{{item.depositTotal}}</view>
</view>
</view>
<view class="content-box" v-if="chooseCouponObj&&chooseCouponObj.savedMoney>0">
<text>
</text>
<text class="content-right">
{{parseFloat(chooseCouponObj.savedMoney.toFixed(2))}}
</text>
</view>
<view class="content-box content-total">
<text>
合计
</text>
<text class="content-right">
¥<text style="font-size:36rpx;">{{sellTotal}}</text>
</text>
</view>
</view>
</view>
</u-popup>
</view>
</template>
<script>
export default {
props: ["merchantName", "name", "buyNum", "sellingPrice", "productDepositTotal", "chooseCouponObj", "choooseService"],
watch: {
choooseService: {
handler(newValue, oldValue) {
if (newValue) {
this.choooseServiceData = this.choooseService
}
},
deep: false,
immediate: false
}
},
data() {
return {
show: false, //控制弹窗显示隐藏
extraPrice: 0, //额外服务价格
depositTotal: 0, //额外服务总押金
choooseServiceData: [], //选中的服务
}
},
computed: {
sellTotal() { //卖价总价
let savedMoney=0
if(this.chooseCouponObj){
savedMoney = this.chooseCouponObj.savedMoney
}
if (this.choooseServiceData.length > 0) { //额外服务价格
let singleMoney = 0 //单个产品总押金,用于算出总押金
this.extraPrice = 0
this.depositTotal = 0 //总押金
for (let i = 0; i < this.choooseServiceData.length; i++) {
this.extraPrice += parseFloat((this.choooseServiceData[i].sellingPrice * this.buyNum).toFixed(2))
if (this.choooseServiceData[i].depositType == 1) { //---------------------------------------------------------------------------等于1,押金金额跟数量没关系
singleMoney = this.choooseServiceData[i].deposit
this.choooseServiceData[i].depositTotal = this.choooseServiceData[i].deposit //单个产品总押金
} else if (this.choooseServiceData[i].depositType == 2) { //----------------------------------------------------------------------等于2,押金单价乘购买数量
singleMoney = parseFloat((this.choooseServiceData[i].deposit * this.buyNum).toFixed(2))
this.choooseServiceData[i].depositTotal = parseFloat((this.choooseServiceData[i].deposit * this.buyNum).toFixed(2)) //单个产品总押金
}
this.depositTotal += singleMoney
}
} else {
this.extraPrice = 0
this.depositTotal = 0
}
return parseFloat((this.sellingPrice * this.buyNum + this.extraPrice + this.depositTotal + this.productDepositTotal - savedMoney).toFixed(2))
}
},
methods: {
}
}
</script>
<style scoped="scoped">
.detail-title {
height:120rpx;
display: flex;
align-items: center;
justify-content: center;
font-size: 32rpx;
border-bottom:var(--border-bottom);
}
.content-box {
padding: 0 30rpx;
border-bottom: 1px solid #f0f0f0;
height: 120rpx;
display: flex;
justify-content: space-between;
align-items: center;
font-size:28rpx;
}
.content-right{
text-align: right;
flex-shrink: 0;
margin-left: 20rpx;
}
.content-total {
color: #f45803;
font-weight: bolder;
font-size:32rpx;
}
</style>
...@@ -271,14 +271,14 @@ ...@@ -271,14 +271,14 @@
<view class="btn" :style="{ background: payBackground }"> <view class="btn" :style="{ background: payBackground }">
<text v-if="productIfo.status == 1">已下架</text> <text v-if="productIfo.status == 1">已下架</text>
<text v-if="parseInt(maxBookNum) < 1" style="background: #c0c0c0">暂无库存</text> <text v-if="parseInt(maxBookNum) <1" style="background: #c0c0c0">暂无库存</text>
<text v-if="productIfo.status != 1 && parseInt(maxBookNum) >= 1" @click="jugeOrder()">去支付</text> <text v-if="productIfo.status != 1 && parseInt(maxBookNum) >= 1" @click="jugeOrder()">去支付</text>
<text class="btn-paying" v-show="showPaying">支付中...</text> <text class="btn-paying" v-show="showPaying">支付中...</text>
<text class="mask" v-show="showPaying"></text> <text class="mask" v-show="showPaying"></text>
</view> </view>
</view> </view>
</view> </view>
<calendar ref="calendar" @dateConfig="dateConfig" :dateList="dateList" v-if="dateList.length > 0"></calendar> <!-- <calendar ref="calendar" @dateConfig="dateConfig" :dateList="dateList" v-if="dateList.length > 0"></calendar> -->
<buyKnow ref="buyKnow" :buyKnowData="buyKnowData"></buyKnow> <buyKnow ref="buyKnow" :buyKnowData="buyKnowData"></buyKnow>
<detail <detail
ref="detail" ref="detail"
...@@ -340,7 +340,7 @@ ...@@ -340,7 +340,7 @@
<script> <script>
import calendar from '../scenicComponents/calendar' //日历组件 import calendar from '../scenicComponents/calendar' //日历组件
import buyKnow from '@/components/buyKnow.vue' //购票须知 import buyKnow from '@/components/buyKnow.vue' //购票须知
import detail from '@/components/merchantDetail.vue' //明细弹窗 import detail from '../scenicComponents/detail.vue' //明细弹窗
import chooseArea from '../scenicComponents/chooseArea' //选择站点 import chooseArea from '../scenicComponents/chooseArea' //选择站点
import contactList from '../scenicComponents/contactList' //联系人弹窗 import contactList from '../scenicComponents/contactList' //联系人弹窗
import editContacts from '../scenicComponents/editContacts' //编辑联系人弹窗 import editContacts from '../scenicComponents/editContacts' //编辑联系人弹窗
...@@ -478,6 +478,9 @@ export default { ...@@ -478,6 +478,9 @@ export default {
} }
}, },
methods: { methods: {
xxx(){
console.log(123)
},
//---获取排号信息 //---获取排号信息
getSortInfor() { getSortInfor() {
let data = { let data = {
...@@ -509,7 +512,7 @@ export default { ...@@ -509,7 +512,7 @@ export default {
title: '加载中' title: '加载中'
}) })
this.$request('distribution/distribution/findNewFetchInfoFromSceinc', data).then(res => { this.$request('distribution/distribution/findNewFetchInfoFromSceinc', data).then(res => {
if (res.data.code == '00') { if (res.code == '00') {
this.sortArr = res.data.data this.sortArr = res.data.data
let data = res.data let data = res.data
if (this.productIfo.productAreaList.length > 1) { if (this.productIfo.productAreaList.length > 1) {
...@@ -727,6 +730,7 @@ export default { ...@@ -727,6 +730,7 @@ export default {
}, },
//---展示购票须知 //---展示购票须知
showBuyKnow() { showBuyKnow() {
console.log(111)
this.$refs.buyKnow.buyKnowShow = true this.$refs.buyKnow.buyKnowShow = true
}, },
//---页面初始化数据,获取产品基本信息 //---页面初始化数据,获取产品基本信息
...@@ -835,9 +839,9 @@ export default { ...@@ -835,9 +839,9 @@ export default {
if (this.dateList.length == 1 && this.beforeBookDays == 0) { if (this.dateList.length == 1 && this.beforeBookDays == 0) {
//长度为1而且只能预订当天,默认选中第一个日期 //长度为1而且只能预订当天,默认选中第一个日期
//真机模拟的时候手机端不显示今天,明天后天,延迟执行 //真机模拟的时候手机端不显示今天,明天后天,延迟执行
setTimeout(item => { // setTimeout(item => {
this.$refs.calendar.defaultDate = this.dateList[0].startTime.substr(0, 10) // this.$refs.calendar.defaultDate = this.dateList[0].startTime.substr(0, 10)
}, 1000) // }, 1000)
this.maxBookNum = Math.min(this.dateList[0].surplus, this.productIfo.maxBookNum) //剩余量 this.maxBookNum = Math.min(this.dateList[0].surplus, this.productIfo.maxBookNum) //剩余量
this.startDate = this.dateList[0].startTime //开始日期 this.startDate = this.dateList[0].startTime //开始日期
this.endDate = this.dateList[0].endTime //结束日期 this.endDate = this.dateList[0].endTime //结束日期
......
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