Commit eb807255 authored by 郭晓清's avatar 郭晓清
parents 1fba4923 09e50ec4
<!-- 预约时间 -->
<template>
<view :class="{'con-box':titleShow}">
<view class="title" v-if="titleShow">{{'预约时间'}}</view>
<view class="u-m-t-40">
<view class="appoint-box">
<view class="select-date">
<view class="u-flex u-row-between ">
<view class="txt">选择日期</view>
<view class="txt active">2021.04.21</view>
</view>
<view class="u-m-t-30 u-flex u-row-between date-list">
<view :class="{'date-item':true,'active':index===currentDay}"
@click="dateChange(item,index,dateList)" v-for="(item,index) in dateList" :key="index">
<text class="day">{{item.weekDay}}</text>
<text class="day day1">{{item.day}}</text>
</view>
<view class="next" @click="weekChange">
<u-icon name="arrow-right" color="#2979ff" size="28"></u-icon>
</view>
</view>
</view>
<!-- weekChange -->
<view class="select-time u-p-t-50">
<view class="u-flex u-row-between">
<view class="txt">选择时间</view>
<view class="txt active">14:00-16:00</view>
</view>
<view class="u-p-t-30 u-flex u-flex-wrap time-list">
<view @click="timeChange(item,index,timeList)"
:class="{'time-item':true,'active':index===currentTime}" v-for="(item,index) in timeList"
:key="index">
<text class="time">{{item}}</text>
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
props: {
titleShow: {
type: Boolean,
default: true
},
},
data() {
return {
currentDay: 0,
currentTime: 0,
dateList: [{
weekDay: '周三',
day: '21'
}, {
weekDay: '周三',
day: '21'
}, {
weekDay: '周三',
day: '21'
}, {
weekDay: '周三',
day: '21'
}, {
weekDay: '周三',
day: '21'
}, {
weekDay: '周三',
day: '21'
}, ],
timeList: ['06:00-08:00', '06:00-08:00', '06:00-08:00', '06:00-08:00', '06:00-08:00', '06:00-08:00',
'06:00-08:00', '06:00-08:00', '06:00-08:00'
]
}
},
methods: {
getDateList() {
// 获取日期
},
dateChange(item, index, list) {
let data = {
item,
index,
list,
}
this.currentDay = index
this.$emit('date-change', data)
},
timeChange(item, index, list) {
let data = {
item,
index,
list,
}
this.currentTime = index
this.$emit('time-change', data)
},
weekChange(item, index, list) {
let data = {
item,
index,
list,
}
this.$emit('week-change', data)
},
}
}
</script>
<style lang="scss" scoped>
.con-box {
margin-top: 30rpx;
padding: 30rpx 30rpx 20rpx;
border-radius: 12rpx;
background-color: #FFFFFF;
.title {
font-weight: bold;
font-size: 32rpx;
line-height: 32rpx;
color: #333;
}
}
.txt {
font-size: 26rpx;
line-height: 26rpx;
color: #333;
&.active {
color: #2272FF
}
}
.date-list {
background-color: #F4F5F7;
.next{
width: 60rpx;
height: 120rpx;
line-height: 120rpx;
text-align: center;
border-left: 2rpx solid #fff;
}
.date-item {
padding: 20rpx 20rpx 16rpx;
border-radius: 12rpx;
.day {
display: block;
font-size: 24rpx;
line-height: 26rpx;
color: #999;
&.day1 {
width: 48rpx;
height: 48rpx;
margin-top: 10rpx;
border-radius: 50%;
font-size: 28rpx;
text-align: center;
line-height: 48rpx;
}
}
&.active {
// background-color: #2272FF;
.day {
color: #2272FF;
&.day1 {
background-color: #2272FF;
color: #fff !important;
}
}
}
}
}
.time-list {
margin-bottom: -30rpx;
.time-item {
min-width: 196rpx;
margin-right: 21rpx;
margin-bottom: 24rpx;
border-radius: 12rpx;
padding: 26rpx 20rpx 24rpx;
background-color: #F4F5F7;
&:nth-child(3n) {
margin-right: 0;
}
&.active{
background-color: #2272FF;
.time{
color:#fff;
}
}
.time {
font-size: 26rpx;
line-height: 26rpx;
color: #999;
}
}
}
</style>
This diff is collapsed.
...@@ -23,6 +23,9 @@ Vue.use(router) ...@@ -23,6 +23,9 @@ Vue.use(router)
import httpApi from '@/common/http.api.js' import httpApi from '@/common/http.api.js'
Vue.use(httpApi, app) Vue.use(httpApi, app)
// 分享
let mpShare = require('@/uview-ui/libs/mixin/mpShare.js')
Vue.mixin(mpShare)
//v1.3.5起 H5端 你应该去除原有的app.$mount();使用路由自带的渲染方式 //v1.3.5起 H5端 你应该去除原有的app.$mount();使用路由自带的渲染方式
// #ifdef H5 // #ifdef H5
RouterMount(app,router,'#app') RouterMount(app,router,'#app')
......
...@@ -21,6 +21,22 @@ ...@@ -21,6 +21,22 @@
"style": { "style": {
"navigationBarTitleText": "订单-完工配置" "navigationBarTitleText": "订单-完工配置"
} }
},{
"path": "pages/order/feedback",
"style": {
"navigationBarTitleText": "订单-过程反馈",
"enablePullDownRefresh": false,
"navigationStyle": "custom", // 隐藏系统导航栏
"disableScroll": true
}
},{
"path": "pages/order/refuse",
"style": {
"navigationBarTitleText": "订单-拒单",
"enablePullDownRefresh": false,
"navigationStyle": "custom", // 隐藏系统导航栏
"disableScroll": true
}
}, },
{ {
"path": "pages/mine/index", "path": "pages/mine/index",
...@@ -167,6 +183,15 @@ ...@@ -167,6 +183,15 @@
"enablePullDownRefresh": false "enablePullDownRefresh": false
} }
} }
,{
// 订单详情页
"path" : "pages/order/detail",
"style" :
{
"navigationStyle": "custom"// 隐藏系统导航栏
}
}
], ],
"globalStyle": { "globalStyle": {
"navigationBarTextStyle": "black", "navigationBarTextStyle": "black",
...@@ -220,8 +245,8 @@ ...@@ -220,8 +245,8 @@
"query": "" "query": ""
}, },
{ {
"name": "基本信息", //模式名称 "name": "订单详情", //模式名称
"path": "pages/settle/base", //启动页面,必选 "path": "pages/order/detail", //启动页面,必选
"query": "" //启动参数,在页面的onLoad函数里面得到 "query": "" //启动参数,在页面的onLoad函数里面得到
}, },
{ {
...@@ -255,8 +280,8 @@ ...@@ -255,8 +280,8 @@
"query": "" //启动参数,在页面的onLoad函数里面得到 "query": "" //启动参数,在页面的onLoad函数里面得到
}, },
{ {
"name": "订单 - 完工配置", //模式名称 "name": "订单 - 过程反馈", //模式名称
"path": "pages/order/complete", //启动页面,必选 "path": "pages/order/feedback", //启动页面,必选
"query": "" //启动参数,在页面的onLoad函数里面得到 "query": "" //启动参数,在页面的onLoad函数里面得到
} }
] ]
......
<template> <template>
<view class="content"> <view class="content">
<!-- <scroll-view class="scroll-view" scroll-y style="height: 100%; width: 100%" @scrolltolower="reachBottom"
@scroll="handleScroll" refresher-enabled :refresher-triggered="triggered" @refresherrefresh="onRefresh"
scroll-anchoring @refresherrestore="onRestore" @refresherpulling="triggered = true" :show-scrollbar="false"
enable-back-to-top> -->
<view style="width: 700rpx; height: 800rpx"> <view style="width: 700rpx; height: 800rpx">
<!-- <view class="title-view">充电桩自营平台</view> --> <!-- <view class="title-view">充电桩自营平台</view> -->
<u-navbar <u-navbar
:is-back="false" :is-back="false"
background="{background: transparent}"
:border-bottom="false"
:is-fixed="false" :is-fixed="false"
:background="{ background: 'transparent' }"
:border-bottom="false"
> >
<text class="title-view">充电桩自营平台</text> <text class="title-view">充电桩自营平台</text>
</u-navbar> </u-navbar>
...@@ -76,7 +72,7 @@ ...@@ -76,7 +72,7 @@
class="order-item-view" class="order-item-view"
> >
<view v-for="(item, index) in orderList" :key="index"> <view v-for="(item, index) in orderList" :key="index">
<OrderCell :orderData="item"> </OrderCell> <OrderCell :orderData="item" :orderType="0" :location="location" @click="handleClick" @action="handleAction"> </OrderCell>
</view> </view>
<u-loadmore <u-loadmore
:status="currentLoadStatus" :status="currentLoadStatus"
...@@ -111,6 +107,7 @@ export default { ...@@ -111,6 +107,7 @@ export default {
return { return {
status: 0, // 入驻状态:0=>'待提交',1=>'待审核',2=>'已通过',3=>'备选',4=>'已驳回',5=>'已签约',6=>'未支付保证金',7=>'已支付保证金',8=>'已通过考试',9=>'待提交' status: 0, // 入驻状态:0=>'待提交',1=>'待审核',2=>'已通过',3=>'备选',4=>'已驳回',5=>'已签约',6=>'未支付保证金',7=>'已支付保证金',8=>'已通过考试',9=>'待提交'
triggered: false, triggered: false,
location: [116.3896, 39.91917], // 经纬度
// list: [ // list: [
// { // {
// image: "https://cdn.uviewui.com/uview/swiper/1.jpg", // image: "https://cdn.uviewui.com/uview/swiper/1.jpg",
...@@ -184,6 +181,13 @@ export default { ...@@ -184,6 +181,13 @@ export default {
} }
}, },
methods: { methods: {
handleClick() { // 点击了cell
console.log('点击了cell')
},
handleAction() { // 点击了按钮
console.log('点击了按钮')
},
async initSettleInfo() { async initSettleInfo() {
let self = this; let self = this;
if (self.status == 7) return; if (self.status == 7) return;
......
...@@ -199,6 +199,7 @@ export default { ...@@ -199,6 +199,7 @@ export default {
}, },
onLoad() { onLoad() {
this.getList(); this.getList();
this.$u.mpShare.path = ''
}, },
methods: { methods: {
......
...@@ -23,7 +23,10 @@ ...@@ -23,7 +23,10 @@
}, },
methods: { methods: {
} },
onLoad() {
this.$u.mpShare.path = ''
},
} }
</script> </script>
......
<template>
<view class="order-wrap">
<u-navbar back-icon-color="#FFFFFF" :background="background" :border-bottom="false"></u-navbar>
<view class="header">
<view class="title">订单信息</view>
<view v-show="allowRejection" class="button" @click="rejectOrder">拒单</view>
</view>
<view class="content">
<view class="card base-item">
<view class="top-item">
<view class="left">
<view class="tag">{{ order.orderServiceType }}</view>
<text class="title">{{ order.categoryName }}</text>
</view>
<view class="right">分配单</view>
</view>
<view class="order-cell">
<text>工单编号:</text>
<text>{{ order.orderNumber }}</text>
</view>
<view class="order-cell between-cell">
<view class="left">
<text>客户信息:</text>
<text>{{ order.contactName }}</text>
</view>
<u-image width="60rpx" height="60rpx" :src="phoneIcon"></u-image>
</view>
<view class="order-cell">
<text>联系方式:</text>
<text>{{ order.contactPhone }}</text>
</view>
<view class="between-cell address-cell">
<view class="left">
<u-icon name="map" size="28"></u-icon>
<text class="address-txt">{{ order.contactAddress }}</text>
</view>
<u-image width="60rpx" height="60rpx" :src="navigationIcon"></u-image>
</view>
</view>
<view class="card order-item">
<view class="top-item">
<text class="title">订单内容</text>
</view>
<view class="order-cell between-cell">
<text>品牌:</text>
<text>{{ order.brandName }}</text>
</view>
<view class="order-cell between-cell">
<text>数量:</text>
<text>x{{ order.orderProductCount }}</text>
</view>
<view class="order-cell between-cell">
<text>信息:</text>
<text>{{ order.serviceContent }}</text>
</view>
<view class="order-cell between-cell">
<text>备注:</text>
<text>{{ order.serviceContent }}</text>
</view>
</view>
<view class="card order-item record-item">
<view class="top-item">
<text class="title">履约记录</text>
</view>
<view class="order-cell between-cell">
<text>接单时间:2021.04.21 16:40:35</text>
</view>
</view>
<view class="card appoint-item">
<appoint-time @dateChange="dateChange" @timeChange="timeChange" @weekChange="weekChange"></appoint-time>
</view>
</view>
<view class="toolbar">
<!-- view用于占位 -->
<view class="left">
<view v-show="allowFeedback" @click="clickFeedback" class="button"></view>
</view>
<view class="center">
<view v-if="centerButton=='appoint'" @click="clickCenterButton" class="button" :class="centerButtonClass">
{{ centerButtonText }}
</view>
</view>
<view class="right">
<view v-show="allowFeedback" @click="clickFeedback" class="button"></view>
</view>
</view>
</view>
</template>
<script>
import appointTime from '@/components/appoint/appoint-time.vue'
export default {
components:{
appointTime
},
data() {
return {
background: {
backgroundColor: 'none',
// 导航栏背景图
// background: 'url(https://cdn.uviewui.com/uview/swiper/1.jpg) no-repeat',
// 还可以设置背景图size属性
// backgroundSize: 'cover',
// 渐变色
},
orderId: null,
order: {},
allowRejection: false, // 允许拒单
allowFeedback: true, // 允许过程反馈
needPhotograph: true, // 需要现场拍摄
centerButton: 'appoint', // 是否显示按钮
centerButtonText: '预约',
};
},
onLoad(e) {
if(e && e.id) {
this.orderId = e.id
} else {
// 异常处理
}
this.loadOrderDetail()
},
computed: {
phoneIcon() {
return process.uniEnv.qn_base_url + 'icon/dianhua-1@2x.png'
},
navigationIcon() {
return process.uniEnv.qn_base_url + 'icon/daohang-1@2x.png'
},
centerButtonClass() {
let btnClass = "appoint-btn"
return btnClass
},
},
methods: {
loadOrderDetail() {
let self = this
let timestamp = new Date().getTime();
let order = {
brandName: '沃尔沃',
categoryId: 1,
categoryName: '充电桩',
contactAddress: '湾街道荔枝花园D座125号',
contactAddressLatitud: '116.3896',
contactAddressLongitud: '39.91917',
contactCity: 4403,
contactCityText: '深圳市',
contactCommunity: 440306,
contactCommunityText: '宝安区',
contactId: 1,
contactName: '郭小清',
contactPhone: '13631612077',
contactProvince: 44,
contactProvinceText: '广东省',
contactStreet: 44030601,
contactStreetText: '新安街道',
lianbaoBrandId: 1,
orderBusinessType: 'R',
orderId: 1,
orderNumber: 'OR2021041809827',
orderProductCount: 1,
orderServiceType: '安装',
orderStatus: '30',
serviceContent: '沃尔沃全球标充电桩(国标32A,4G联网)',
orderBusinessTypeText: '订单池',
auditResults: [],
currentWillOverTime: timestamp,
currentOverTime: timestamp,
appointmentDatetime: timestamp,
auditDatetime: timestamp,
}
self.order = order
},
/**
* 拒单
*/
rejectOrder() {
console.log("点击拒单")
},
/**
* 点击下一周
* @param {Object} data
*/
weekChange(data){
console.log(data,'week-data')
},
/**
* 点击日期选择
* @param {Object} data
*/
dateChange(data){
console.log(data,'week-data')
},
/**
* 时间段选择变化
* @param {Object} data
*/
timeChange(data){
console.log(data,'week-data')
},
clickCenterButton() {
},
}
}
</script>
<style lang="scss">
.order-wrap {
width: 750rpx;
height: 100vh;
overflow: auto;
background-color: #F4F5F7;
background-image: linear-gradient(to top, #F4F5F7 , #2272FF);
background-size: 750rpx 600rpx;
background-repeat: no-repeat;
.header {
padding: 12rpx 30rpx 40rpx 30rpx;
display: flex;
justify-content: space-between;
align-items: center;
.title {
font-size: 40rpx;
font-weight: bold;
color: #FFFFFF;
}
.button {
text-align: center;
width: 106rpx;
height: 52rpx;
background: #FFFFFF;
border-radius: 40rpx;
font-size: 24rpx;
font-weight: 400;
color: #2272FF;
line-height: 52rpx;
}
}
.content{
height: 2000rpx;
.card {
background-color: #FFFFFF;
margin: 0 30rpx 20rpx 30rpx;
padding: 30rpx 30rpx 0 30rpx;
border-radius: 6px;
}
.base-item {
padding-bottom: 36rpx;
.top-item {
display: flex;
justify-content: space-between;
margin-bottom: 20rpx;
.left {
display: flex;
align-items: center;
.tag {
text-align: center;
width: 84rpx;
height: 40rpx;
background-image: linear-gradient(270deg, #47ABFF 0%, #2272FF 100%);
border-radius: 8rpx;
font-size: 22rpx;
font-weight: 500;
color: #FFFFFF;
line-height: 40rpx;
}
.title {
margin-left: 30rpx;
height: 36rpx;
font-size: 36rpx;
font-weight: bold;
color: #333333;
line-height: 36rpx;
}
}
.right {
text-align: center;
width: 100rpx;
height: 40rpx;
background: #F4F5F7;
border-radius: 22rpx;
font-size: 22rpx;
font-weight: 400;
color: #333333;
line-height: 40rpx;
}
}
.address-cell {
height: 24rpx;
font-size: 24rpx;
font-weight: 400;
color: #333333;
line-height: 24rpx;
.left {
.address-txt {
margin-left: 8rpx;
}
}
}
}
.order-item {
padding-bottom: 34rpx;
.top-item {
display: flex;
justify-content: space-between;
margin-bottom: 20rpx;
.title {
height: 36rpx;
font-size: 36rpx;
font-weight: bold;
color: #333333;
line-height: 36rpx;
}
}
.address-cell {
height: 24rpx;
font-size: 24rpx;
font-weight: 400;
color: #333333;
line-height: 24rpx;
.left {
.address-txt {
margin-left: 8rpx;
}
}
}
}
.record-item {
}
.appoint-item {
padding: 0;
}
}
.toolbar {
margin-bottom: 104rpx;
display: flex;
justify-content: center;
align-items: center;
.left {
width: 100rpx;
height: 100rpx;
.button {
width: 100rpx;
height: 100rpx;
background: #929CB8;
border-radius: 100rpx;
}
}
.center {
width: 140rpx;
height: 140rpx;
margin-left: 74rpx;
margin-right: 74rpx;
.button {
width: 140rpx;
height: 140rpx;
border-radius: 100rpx;
display: flex;
justify-content: center;
align-items: center;
color: #FFFFFF;
font-size: 32rpx;
font-weight: bold;
}
.appoint-btn {
background: #2272FF;
box-shadow: 2px 2px 20px 0px rgba(34, 114, 255, 0.3);
}
.sign-timeout-btn {
background: #FA5A49;
box-shadow: 2px 2px 20px 0px rgba(34, 114, 255, 0.3);
}
.appoint-btn {
background: #2272FF;
box-shadow: 2px 2px 20px 0px rgba(34, 114, 255, 0.3);
}
}
.right {
width: 100rpx;
height: 100rpx;
.button {
width: 100rpx;
height: 100rpx;
background: #12CF84;
border-radius: 100rpx;
}
}
}
}
// 页面公用css
.order-cell {
height: 48rpx;
font-size: 26rpx;
font-weight: 400;
color: #333333;
line-height: 48rpx;
margin-bottom: 30rpx;
}
.between-cell {
display: flex;
justify-content: space-between;
align-items: center;
}
</style>
<!-- 过程反馈 -->
<template>
<view class="feedback-box bg">
<u-navbar back-icon-color="#FFFFFF" :background="background" title="过程反馈" title-color="#fff" :border-bottom="false"></u-navbar>
<view class="content u-p-l-30 u-p-r-30">
<view class="width-320 u-m-t-20">
<u-subsection
:bold="false"
:current="curNow"
:list="list"
active-color="white"
bg-color="white"
height="72"
inactive-color="#666"
button-color="#2272FF"
border-radius="36"
></u-subsection>
</view>
<view class="con-box">
<view class="title">{{feedback.own.title}}</view>
<view class="u-flex u-flex-wrap">
<view :class="{'txt-item':true,'active':true}" v-for="(txt,index) in feedback.own.list" :key="index">
<text class="txt">{{txt}}</text>
</view>
</view>
</view>
<view class="con-box">
<view class="title">{{feedback.type.title}}</view>
<view class="u-flex u-flex-wrap">
<view :class="{'txt-item':true,'active':false}" v-for="(txt,index) in feedback.type.list" :key="index">
<text class="txt">{{txt}}</text>
</view>
</view>
<u-input class="textarea" height="156" type="textarea" placeholder="请补充详细说明,以便于记录您的接单信用分"></u-input>
</view>
<appoint-time @dateChange="dateChange" @timeChange="timeChange" @weekChange="weekChange"></appoint-time>
</view>
<view class="u-m-60">
<button class="btn">确定</button>
</view>
</view>
</template>
<script>
import appointTime from '@/components/appoint/appoint-time.vue'
export default {
data() {
return {
background: {
backgroundColor: 'none',
},
// questionList: ['个人', '客户', '现场/客户'],
feedback: {
own:{
title:'问题归属',
list:['个人', '客户', '现场/客户'],
},
type:{
title:'问题类型',
list:['有事耽搁', '未带齐工具', '个人改约','其他']
},
appoint:{
title:'预约时间',
}
},
list:['报备','预约'],
curNow: 1
};
},
components:{
appointTime
},
methods: {
/**
* 拒单
*/
rejectOrder() {
console.log("点击拒单")
},
sectionChange(index) {
this.curNow = index;
},
weekChange(data){
// 点击下一周
console.log(data,'week-data')
},
dateChange(data){
// 点击日期选择
console.log(data,'week-data')
},
timeChange(data){
// 时间段选择变化
console.log(data,'week-data')
},
}
}
</script>
<style lang="scss">
.bg {
width: 750rpx;
height: 100vh;
overflow: auto;
background-color: #F4F5F7;
background-image: linear-gradient(to top, #F4F5F7 0%, #2272FF 100%);
background-size: 750rpx 600rpx;
background-repeat: no-repeat;
}
/deep/ .u-subsection{
padding:4rpx!important;
}
.con-box{
margin-top:30rpx;
padding:30rpx 30rpx 30rpx 20rpx;
border-radius: 12rpx;
background-color: #FFFFFF;
.title{
font-weight: bold;
font-size: 32rpx;
line-height: 32rpx;
color: #333;
}
&>.u-flex{
margin-top:40rpx;
margin-right:-20rpx;
.txt-item{
border-radius: 12rpx;
padding:24rpx 38rpx;
min-width: 196rpx;
text-align: center;
margin-right: 20rpx;
margin-bottom: 20rpx;
background-color: #F4F5F7;
&.active{
background-color: #2272FF;
.txt{
color: #fff;
}
}
}
}
.txt{
display:block;
font-size: 26rpx;
line-height: 26rpx;
color: #333;
}
.textarea{
/deep/ .u-input{
textarea{
margin-top:20rpx;
border: 2rpx solid #ECECEC;
padding:18rpx 30rpx;
}
}
}
}
.btn{
padding:30rpx;
border-radius: 52rpx;
line-height: 44rpx;
font-size:32rpx;
text-align: center;
background-color: #2272FF;
color:#fff;
&::after{
content:'';
height:0;
}
}
.width-320{
width:320rpx;
}
</style>
<!-- 过程反馈 -->
<template>
<view class="refuse-box bg">
<u-navbar back-icon-color="#FFFFFF" :background="background" title="拒单" title-color="#fff" :border-bottom="false"></u-navbar>
<view class="title">拒单说明</view>
<view class="content">
<view class="con-box">
<view class="tit u-m-b-40 u-flex"><text class="txt label">※</text>{{refuse.title}}</view>
<view class="u-flex u-flex-wrap">
<view :class="{'txt-item':true,'active':true}" v-for="(txt,index) in refuse.list" :key="index">
<text class="txt">{{txt}}</text>
</view>
</view>
</view>
<view class="con-box">
<view class="tit u-m-b-40">补充说明</view>
<u-input class="textarea" height="156" type="textarea" placeholder="请补充详细说明,以便于记录您的接单信用分"></u-input>
</view>
</view>
<view class="u-m-60">
<button class="btn">确定</button>
</view>
</view>
</template>
<script>
export default {
data() {
return {
background: {
backgroundColor: 'none',
},
refuse:{
title:'问题归属',
list:['时间不匹配', '技术不匹配', '价格过低', '距离太远', '其他'],
},
};
},
components:{},
methods: {
}
}
</script>
<style lang="scss">
.bg {
width: 750rpx;
height: 100vh;
overflow: auto;
background-color: #F4F5F7;
background-image: linear-gradient(to top, #F4F5F7 0%, #2272FF 100%);
background-size: 750rpx 600rpx;
background-repeat: no-repeat;
}
/deep/ .u-subsection{
padding:4rpx!important;
}
.content{
margin:0 30rpx;
overflow: hidden;
border-radius: 12rpx;
padding-bottom: 60rpx;
background-color: #fff;
}
.con-box{
padding:30rpx 30rpx 30rpx 20rpx;
// border-radius: 12rpx;
background-color: #FFFFFF;
.tit{
font-weight: bold;
font-size: 32rpx;
line-height: 32rpx;
color: #333;
}
&>.u-flex{
// margin-top:40rpx;
margin-right:-20rpx;
.txt-item{
border-radius: 12rpx;
padding:24rpx 38rpx;
min-width: 196rpx;
text-align: center;
margin-right: 20rpx;
margin-bottom: 20rpx;
background-color: #F4F5F7;
&.active{
background-color: #2272FF;
.txt{
color: #fff;
}
}
}
}
.txt{
display:block;
font-size: 26rpx;
line-height: 26rpx;
color: #333;
}
.textarea{
/deep/ .u-input{
textarea{
margin-top:20rpx;
border: 2rpx solid #ECECEC;
padding:18rpx 30rpx;
}
}
}
}
.btn{
padding:30rpx;
border-radius: 52rpx;
line-height: 44rpx;
font-size:32rpx;
text-align: center;
background-color: #2272FF;
color:#fff;
&::after{
content:'';
height:0;
}
}
.width-320{
width:320rpx;
}
.title{
padding:30rpx 30rpx 46rpx;
line-height: 40rpx;
font-size:40rpx;
color:#fff;
}
.label{
display: inline-block;
line-height: 40rpx;
font-size:24rpx;
margin-right: 10rpx;
color:#FA5A49
}
</style>
...@@ -2,8 +2,8 @@ module.exports = { ...@@ -2,8 +2,8 @@ module.exports = {
onLoad() { onLoad() {
// 设置默认的转发参数 // 设置默认的转发参数
this.$u.mpShare = { this.$u.mpShare = {
title: '', // 默认为小程序名称 title: '充电桩安装火爆进行中...就等你', // 默认为小程序名称
path: '', // 默认为当前页面路径 path: '/pages/index/index', // 默认为当前页面路径
imageUrl: '' // 默认为当前页面的截图 imageUrl: '' // 默认为当前页面的截图
} }
}, },
......
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