Skip to content

X
xinrenli-app
Commit 51184dcc by honghong
Options

2023-3-8语音弹窗

parent 7d02e77f
Showing with 777 additions and 319 deletions
App.vue
...@@ -74,5 +74,9 @@ export default { ...@@ -74,5 +74,9 @@ export default {
</style> </style>
<style> <style>
/*每个页面公共css */ /*每个页面公共css */
@import '@/utils/both.css'; @import '@/utils/both.css';
page{
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
}
</style> </style>
components/form.vue 0 → 100644
<template>
<view>
<view class="d-flex a-center j-sb form-item-height paddding-x-three">
<view class="form-item-name">标题<span class="must-sign">*</span></view>
<view class="input-box">
<input type="text" placeholder="请输入标题">
</view>
</view>
<view class="d-flex a-center j-sb form-item-height">
<view class="form-item-name">联系人<span class="must-sign">*</span></view>
<view class="input-box">
<input type="text" placeholder="请输入联系人姓名">
</view>
</view>
<view class="d-flex a-center j-sb form-item-height">
<view class="form-item-name">联系电话<span class="must-sign">*</span></view>
<view class="input-box">
<input type="text" placeholder="请输入联系人手机号">
</view>
</view>
<view class="d-flex a-center j-sb form-item-height">
<view class="form-item-name">维修时间<span class="must-sign">*</span></view>
<view class="input-box d-flex a-center" @click="showTime = true">
<u-datetime-picker ref="datePicker" :formatter="formatter" v-model="time" :show="showTime" mode="date"
@confirm="handleConfirmDate" @cancel="handleClose"></u-datetime-picker>
<input type="text" v-model="time" placeholder="请选择时间">
<u-icon name="arrow-down-fill" color="#000000" size="28"></u-icon>
</view>
</view>
<view class="d-flex a-center j-sb form-item-height">
<view class="form-item-name">维修地址<span class="must-sign">*</span></view>
<view class="input-box">
<input type="text" placeholder="请填写维修地址">
</view>
</view>
<view class="d-flex a-center j-sb form-item-height">
<view class="form-item-name">预算金额<span class="must-sign">*</span></view>
<view class="input-box">
<input type="text" placeholder="请填写预算金额">
</view>
</view>
<view class="paddding-x-three">
<view class="form-item-name margin-y-two">备注</view>
<u--textarea v-model="remark" height="128" placeholder="备注说明"></u--textarea>
</view>
<view>
<view>
<view class="d-flex j-sb a-center form-item-height-only">
<view class="form-item-name">上传图片</view>
<view class="form-tips">一下内容三选一必填</view>
</view>
<view class="paddding-x-three">
<comUpload></comUpload>
</view>
</view>
<view>
<view class="d-flex j-sb a-center form-item-height-only">
<view class="form-item-name">上传视频</view>
</view>
<view class="paddding-x-three">
<comUpload :acceptType="acceptType"></comUpload>
</view>
</view>
<view>
<view class="d-flex j-sb a-center form-item-height-only">
<view class="form-item-name">语音描述</view>
</view>
<!-- <view class="paddding-x-three margin-y-two">
<free-audio startPic='../../static/play.png' endPic='../../static/stop.png' audioId='audio1'
:url='path' @delete="handleDelete"></free-audio>
</view> -->
<view class="paddding-x-three d-flex j-center " @click="showPopup = true">
<view class="voice-box d-flex a-center j-center">
<u-icon name="mic" color="#2979ff" size="32"></u-icon>
<view>添加语音描述</view>
</view>
</view>
<u-popup :show="showPopup" @close="handleClosePopup" @open="handleOpenPopup">
<view class="padding-y-two">
<recordCom></recordCom>
</view>
</u-popup>
</view>
</view>
</view>
</template>
<script>
import freeAudio from '@/components/chengpeng-audio/free-audio.vue'
export default {
name: "form",
components: {
freeAudio,
},
data() {
return {
showTime: false, //时间选择器是否显示
time: undefined, //时间选择器的值
remark: '',
acceptType: 'video',
path: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-hello-uniapp/2cc220e0-c27a-11ea-9dfb-6da8e309e0d8.mp3',
voicePath: '',
showPopup: false
};
},
//暂停所有音频（一般用于页面切换时停止正在播放的音频）
onUnload() { //普通页面在 onUnload 生命周期中执行
uni.$emit('stop')
},
onHide() { //tabBar页面在onHide生命周期中执行
uni.$emit('stop')
},
created() {
let that = this
// 时间格式化默认值
that.time = uni.$u.timeFormat(Number(new Date()), 'yyyy-mm-dd');
},
methods: {
// 时间选择器确认事件
async handleConfirmDate(e) {
// value:返回所选时间戳，mode:当前模式
let that = this
that.showTime = false
// 时间格式化
const timeFormat = uni.$u.timeFormat;
let timeValue = await timeFormat(e.value, 'yyyy-mm-dd');
that.time = timeValue
},
//时间选择器的关闭按钮事件
handleClose() {
this.showTime = false
},
//弹窗打开事件
handleOpenPopup() {
let that = this
// console.log('open');
},
//弹窗关闭事件
handleClosePopup() {
let that = this
that.showPopup = false
},
// 删除语音
handleDelete() {
console.log('删除')
// const recorderManager = uni.getRecorderManager()
// console.log(recorderManager,'大数据可能')
},
//时间选择器格式化
formatter(type, value) {
if (type === 'year') {
return `${value}年`
}
if (type === 'month') {
return `${value}月`
}
if (type === 'day') {
return `${value}日`
}
return value
},
}
}
</script>
<style>
@import url("@/css/form.css");
::v-deep .u-border {
border: 0 !important;
background: #F5F5F5 !important;
}
::v-deep .u-upload__wrap__preview {
margin: 0 6rpx 10rpx 0 !important;
}
</style>
demand/payment/index.vue
...@@ -36,6 +36,14 @@ ...@@ -36,6 +36,14 @@
{{times}}元 {{times}}元
<image src="@/static/icon/jt.png" mode=""></image> <image src="@/static/icon/jt.png" mode=""></image>
</view> </view>
</view>
<view class="content-discounts">
<view class="">
您当前可享1单9折优惠,是否使用
</view>
<view class="">
<u-switch v-model="isUse" activeColor="#D6E1FF" inactiveColor="#F1F1F1" @change="changeUse"></u-switch>
</view>
</view> </view>
<view class="content-accomplish"> <view class="content-accomplish">
<view class=""> <view class="">
...@@ -54,7 +62,8 @@ ...@@ -54,7 +62,8 @@
imgBgUrl: apiBaseConfig.imgBgUrl, imgBgUrl: apiBaseConfig.imgBgUrl,
globalData: getApp().globalData, globalData: getApp().globalData,
scrollTopHeader: 0, scrollTopHeader: 0,
times:'0' times:'0',
isUse:true
}; };
}, },
onLoad() {}, onLoad() {},
...@@ -69,6 +78,10 @@ ...@@ -69,6 +78,10 @@
url: `/demand/confirm/index` url: `/demand/confirm/index`
}); });
} }
},
changeUse(e){
let that = this
that.isUse = e
} }
} }
} }
...@@ -76,6 +89,12 @@ ...@@ -76,6 +89,12 @@
<style> <style>
page { page {
background: #F7F8F9; background: #F7F8F9;
}
.u-switch__node{
background: #888888 !important;
}
.u-switch__node--on{
background: #2C66FF !important;
} }
</style> </style>
<style lang="scss" scoped> <style lang="scss" scoped>
......
demand/updateForm/updateForm.vue 0 → 100644
<template>
<view>
<view class="paddding-x-two ">
<releaseForm></releaseForm>
<view class="submit-btn">确认修改</view>
</view>
</view>
</template>
<script>
import releaseForm from '@/components/form.vue'
export default {
components: {
releaseForm
},
data() {
return {
}
},
methods: {
}
}
</script>
<style>
@import url("@/css/form.css");
::v-deep .u-border {
border: 0 !important;
background: #F5F5F5 !important;
}
::v-deep .u-upload__wrap__preview {
margin: 0 6rpx 10rpx 0 !important;
}
</style>
my/login/login.vue 0 → 100644
<template>
<view>
<view :style="'height:' + height + 'px'" class="d-flex flex-column j-center a-center">
<image class="logo-img" src="../../static/logoLogin.png" >
</image>
<view class="distence-top">
<button class="button" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">微信手机号授权登录</button>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
height:0
}
},
onLoad() {
let that = this
// 获取系统的高度
uni.getSystemInfo({
success(res) {
that.height = res.windowHeight
}
})
// this.getUserInfo()
},
methods: {
// 1.调用微信自带登录方法获取code
getUserInfo(){
let that = this
uni.login({
success(res) {
that.loginParams.code = res.code
that.getSessionkeyAndOpenId()
}
})
uni.getUserInfo({
success(info) {
that.signature = info.signature
that.rawData = info.rawData
}
})
},
// 2.获取sessionKey,openId
async getSessionkeyAndOpenId() {
const res = await this.$myRequest({
url:`/xcxLogin?appid=${this.loginParams.appid}&code=${this.loginParams.code}`,
})
if(res.data.code == 200){
let dataObj = JSON.parse(res.data.data)
this.sessionKey = dataObj.sessionKey
this.openid = dataObj.openid
}
},
// 3.授权手机号登录拿到encryptedData和iv
getPhoneNumber(e) {
// 同意登录
if (e.detail.errMsg == "getPhoneNumber:ok") {
const iv = e.detail.iv
const encryptedData = e.detail.encryptedData
this.getNumberAndToken(iv,encryptedData)
} else {
// 取消授权 清空头像和昵称
uni.navigateBack({
delta: 1
})
}
},
// 4.获取token
async getNumberAndToken(iv, encryptedData) {
const res = await this.$myRequest({
url:'/phone',
method:'POST',
data:{
appid:this.loginParams.appid,
encryptedData:encryptedData,
iv:iv,
sessionKey:this.sessionKey,
openid:this.openid,
rawData:this.rawData,
signature:this.signature
}
})
if(res.data.code == 200){
console.log(res.data.data.token,'token')
uni.setStorageSync('token',res.data.data.token)
uni.setStorageSync('powerIds',res.data.data.powerIds)
uni.setStorageSync('userInfo',res.data.data.feederUserVo)
uni.showToast({
title:'登录成功',
icon:'none',
duration:2000,
success() {
setTimeout(()=>{
uni.reLaunch({
url:'../index/index'
})
},1000)
}
})
}
},
//使用账号密码
handleUse(){
uni.navigateTo({
url:'../chooseLogin/chooseLogin'
})
}
}
}
</script>
<style>
page{
padding:0;
}
.logo-img{
width: 200rpx;
height:200rpx;
border-radius: 50%;
}
.button {
color: #FFFFFF;
height: 90rpx;
font-size: 18px;
text-align: center;
line-height: 90rpx;
width: 550rpx;
border-radius: 8px;
background: #3476ff;
}
.use-text{
text-align: center;
font-size: 24rpx;
color: #3476ff;
margin: 20rpx auto;
}
.distence-top{
margin-top: 429rpx;
}
</style>
order/detail/detail.vue
<template> <template>
<view> <view>
<view class="padding-x-four d-flex flex-wrap"> <view style="padding-bottom: 100rpx;">
<view v-for="item in 6"> <view class="padding-x-four d-flex flex-wrap">
<image class="evaluateListImgItem" <view v-for="item in 6">
src="https://img2.baidu.com/it/u=955956276,3392954639&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500" <image class="evaluateListImgItem"
mode="scaleToFill"></image> src="https://img2.baidu.com/it/u=955956276,3392954639&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500"
mode="scaleToFill"></image>
</view>
</view> </view>
</view> <view class="paddding-x-two">
<view class="paddding-x-two"> <view class="eval-box">
<view class="eval-box"> <view class="evaluate-title">文章标题文章标题文章标题文章标题文章标题</view>
<view class="evaluate-title">文章标题文章标题文章标题文章标题文章标题</view> <view class="d-flex a-center j-sb margin-top-two">
<view class="d-flex a-center j-sb margin-top-two"> <view class="d-flex a-center">
<view class="d-flex a-center"> <image class="img"
<image class="img" src="https://img1.baidu.com/it/u=3486651663,3991438881&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500" mode="widthFix"></image> src="https://img1.baidu.com/it/u=3486651663,3991438881&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500"
<view class="evaluate-name">张三</view> mode="widthFix"></image>
<view class="evaluate-name">张三</view>
</view>
<view class="eval-time">发布于2022-11-16</view>
</view>
<view class="evaluateText text-indent">
评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容
</view> </view>
<view class="eval-time">发布于2022-11-16</view>
</view> </view>
<view class="evaluateText text-indent"> </view>
评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容 <view class="bgWhite">
<view class="padding-aval">
<comment-list :personEvalList="personEvalList"></comment-list>
</view> </view>
</view> </view>
</view> </view>
<view class="bgWhite"> <view class="comment-box">
<view class="padding-aval"> <view class="paddding-x-two comment-box-height d-flex a-center j-sb">
<comment-list :personEvalList="personEvalList"></comment-list> <input class="send-input" type="text" placeholder="评论一下吧">
<view class="send-btn-box">发送</view>
</view> </view>
</view> </view>
</view> </view>
</template> </template>
...@@ -48,6 +58,24 @@ ...@@ -48,6 +58,24 @@
date: '2022-05-11', date: '2022-05-11',
content: '评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容' content: '评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容'
}, },
{
avatar: 'https://img1.baidu.com/it/u=3486651663,3991438881&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500',
nickname: '李晓扎',
date: '2022-05-11',
content: '评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容'
},
{
avatar: 'https://img1.baidu.com/it/u=3486651663,3991438881&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500',
nickname: '李小乖',
date: '2022-05-11',
content: '评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容'
},
{
avatar: 'https://img1.baidu.com/it/u=3486651663,3991438881&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500',
nickname: '李晓扎',
date: '2022-05-11',
content: '评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容'
},
] ]
} }
}, },
...@@ -58,13 +86,15 @@ ...@@ -58,13 +86,15 @@
</script> </script>
<style> <style>
page{ page {
background: #F7F8F9; background: #F7F8F9;
} }
.padding-aval{
.padding-aval {
padding: 30rpx 40rpx; padding: 30rpx 40rpx;
} }
.eval-box{
.eval-box {
width: 710rpx; width: 710rpx;
background: #FFFFFF; background: #FFFFFF;
border-radius: 10rpx; border-radius: 10rpx;
...@@ -72,11 +102,13 @@ ...@@ -72,11 +102,13 @@
box-sizing: border-box; box-sizing: border-box;
margin: 20rpx auto; margin: 20rpx auto;
} }
.evaluate-title { .evaluate-title {
font-size: 28rpx; font-size: 28rpx;
font-weight: bold; font-weight: bold;
margin-top: 10rpx; margin-top: 10rpx;
} }
/* 头像 */ /* 头像 */
.img { .img {
width: 60rpx; width: 60rpx;
...@@ -84,17 +116,19 @@ ...@@ -84,17 +116,19 @@
display: table; display: table;
border-radius: 50%; border-radius: 50%;
} }
.evaluate-name { .evaluate-name {
font-size: 28rpx; font-size: 28rpx;
margin-left: 10rpx; margin-left: 10rpx;
} }
.evaluateListImgItem { .evaluateListImgItem {
width: 210rpx; width: 210rpx;
height: 210rpx; height: 210rpx;
margin-right: 10rpx; margin-right: 10rpx;
margin-top: 10rpx; margin-top: 10rpx;
} }
/* 内容样式 */ /* 内容样式 */
.evaluateText { .evaluateText {
margin-top: 10rpx; margin-top: 10rpx;
...@@ -102,11 +136,47 @@ ...@@ -102,11 +136,47 @@
letter-spacing: 0.5px; letter-spacing: 0.5px;
line-height: 40rpx; line-height: 40rpx;
} }
.text-indent{
.text-indent {
text-indent: 2rem; text-indent: 2rem;
} }
.eval-time{
.eval-time {
color: #666666; color: #666666;
font-size: 24rpx; font-size: 24rpx;
} }
.comment-box {
width: 100%;
height: 98rpx;
background: #F8F8F8;
position: fixed;
bottom: 0;
}
.comment-box-height {
height: 98rpx;
}
.send-input {
width: 550rpx;
height: 60rpx;
background: #FFFFFF;
border-radius: 6rpx;
color: #999999;
font-size: 22rpx;
padding-left: 26rpx;
box-sizing: border-box;
}
.send-btn-box {
width: 140rpx;
height: 60rpx;
background: #2C66FF;
border-radius: 6rpx;
text-align: center;
line-height: 60rpx;
color: #FFFFFF;
font-size: 22rpx;
}
</style> </style>
pages.json
{ {
"easycom": { "easycom": {
"^u-(.*)": "uview-ui/components/u-$1/u-$1.vue" "^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"
}, },
"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages "pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
{ {
"path": "pages/home/index", "path": "pages/home/index",
"style": { "style": {
"navigationBarTitleText": "uni-app", "navigationBarTitleText": "uni-app",
"mp-weixin": { "mp-weixin": {
"navigationStyle": "custom" "navigationStyle": "custom"
} }
} }
}, },
{ {
"path": "pages/demand/index", "path": "pages/demand/index",
"style": { "style": {
"navigationBarTitleText": "需求" "navigationBarTitleText": "需求"
} }
}, },
{ {
"path": "pages/release/index", "path": "pages/release/index",
"style": { "style": {
"navigationBarTitleText": "发布" "navigationBarTitleText": "发布",
} "mp-weixin": {
}, "navigationStyle": "custom"
{ }
"path": "pages/order/index", }
"style": { },
"navigationBarTitleText": "动态" {
} "path": "pages/order/index",
}, "style": {
{ "navigationBarTitleText": "动态",
"path": "pages/my/index", "mp-weixin": {
"style": { "navigationStyle": "custom"
"navigationBarTitleText": "个人", }
"mp-weixin": { }
"navigationStyle": "custom" },
} {
} "path": "pages/my/index",
} "style": {
], "navigationBarTitleText": "个人",
//分包加载配置，此配置为小程序的分包加载机制。 "mp-weixin": {
"subPackages": [{ "navigationStyle": "custom"
"root": "home", //子包的根目录 }
"pages": [{ //这里的配置路径和pages里的一样 }
"path": "index/index", //配置页面路径，这里要注意，因为root已经选中了文件夹，所以我们只要填写文件名就好 }
"style": { ],
"navigationBarTitleText": "订单详情", //分包加载配置，此配置为小程序的分包加载机制。
"enablePullDownRefresh": false "subPackages": [{
} "root": "home", //子包的根目录
}] "pages": [{ //这里的配置路径和pages里的一样
}, "path": "index/index", //配置页面路径，这里要注意，因为root已经选中了文件夹，所以我们只要填写文件名就好
{ "style": {
"root": "my", //子包的根目录 "navigationBarTitleText": "订单详情",
"pages": [{ //这里的配置路径和pages里的一样 "enablePullDownRefresh": false
"path": "feedback/index", //配置页面路径，这里要注意，因为root已经选中了文件夹，所以我们只要填写文件名就好 }
"style": { }]
"navigationBarTitleText": "意见反馈" },
} {
}, { //这里的配置路径和pages里的一样 "root": "my", //子包的根目录
"path": "invite/index", //配置页面路径，这里要注意，因为root已经选中了文件夹，所以我们只要填写文件名就好 "pages": [{ //这里的配置路径和pages里的一样
"style": { "path": "feedback/index", //配置页面路径，这里要注意，因为root已经选中了文件夹，所以我们只要填写文件名就好
"navigationBarTitleText": "我的邀请" "style": {
} "navigationBarTitleText": "意见反馈"
}, { //这里的配置路径和pages里的一样 }
"path": "agreeOn/index", //配置页面路径，这里要注意，因为root已经选中了文件夹，所以我们只要填写文件名就好 }, { //这里的配置路径和pages里的一样
"style": { "path": "invite/index", //配置页面路径，这里要注意，因为root已经选中了文件夹，所以我们只要填写文件名就好
"navigationBarTitleText": "用户协议" "style": {
} "navigationBarTitleText": "我的邀请"
}, { //这里的配置路径和pages里的一样 }
"path": "coupon/index", //配置页面路径，这里要注意，因为root已经选中了文件夹，所以我们只要填写文件名就好 }, { //这里的配置路径和pages里的一样
"style": { "path": "agreeOn/index", //配置页面路径，这里要注意，因为root已经选中了文件夹，所以我们只要填写文件名就好
"navigationBarTitleText": "优惠券", "style": {
"mp-weixin": { "navigationBarTitleText": "用户协议"
"navigationStyle": "custom" }
} }, { //这里的配置路径和pages里的一样
} "path": "coupon/index", //配置页面路径，这里要注意，因为root已经选中了文件夹，所以我们只要填写文件名就好
}] "style": {
}, "navigationBarTitleText": "优惠券",
{ "mp-weixin": {
"root": "demand", //子包的根目录 "navigationStyle": "custom"
"pages": [{ //这里的配置路径和pages里的一样 }
"path": "index/index", //配置页面路径，这里要注意，因为root已经选中了文件夹，所以我们只要填写文件名就好 }
"style": { }, {
"navigationBarTitleText": "订单详情", "path": "login/login",
"enablePullDownRefresh": false "style": {
} "navigationBarTitleText": "授权登录",
}, "enablePullDownRefresh": false
{ //这里的配置路径和pages里的一样 }
"path": "payment/index", //配置页面路径，这里要注意，因为root已经选中了文件夹，所以我们只要填写文件名就好
"style": { }]
"navigationBarTitleText": "确认支付", },
"enablePullDownRefresh": false {
} "root": "demand", //子包的根目录
}, "pages": [{ //这里的配置路径和pages里的一样
{ //这里的配置路径和pages里的一样 "path": "index/index", //配置页面路径，这里要注意，因为root已经选中了文件夹，所以我们只要填写文件名就好
"path": "confirm/index", //配置页面路径，这里要注意，因为root已经选中了文件夹，所以我们只要填写文件名就好 "style": {
"style": { "navigationBarTitleText": "订单详情",
"navigationBarTitleText": "确认支付", "enablePullDownRefresh": false
"enablePullDownRefresh": false }
} },
}, { //这里的配置路径和pages里的一样
{ //这里的配置路径和pages里的一样 "path": "payment/index", //配置页面路径，这里要注意，因为root已经选中了文件夹，所以我们只要填写文件名就好
"path": "prosperity/index", //配置页面路径，这里要注意，因为root已经选中了文件夹，所以我们只要填写文件名就好 "style": {
"style": { "navigationBarTitleText": "确认支付",
"navigationBarTitleText": "支付成功", "enablePullDownRefresh": false
"enablePullDownRefresh": false }
} },
} { //这里的配置路径和pages里的一样
] "path": "confirm/index", //配置页面路径，这里要注意，因为root已经选中了文件夹，所以我们只要填写文件名就好
}, "style": {
{ "navigationBarTitleText": "确认支付",
"root": "order", "enablePullDownRefresh": false
"pages": [ }
{ },
"path": "detail/detail", { //这里的配置路径和pages里的一样
"style": { "path": "prosperity/index", //配置页面路径，这里要注意，因为root已经选中了文件夹，所以我们只要填写文件名就好
"navigationBarTitleText": "动态", "style": {
"enablePullDownRefresh": false "navigationBarTitleText": "支付成功",
} "enablePullDownRefresh": false
} }
] }, {
} "path": "updateForm/updateForm",
], "style": {
"globalStyle": { "navigationBarTitleText": "订单修改",
"navigationBarTextStyle": "black", "enablePullDownRefresh": false
"navigationBarBackgroundColor": "#FFFFFF", }
"backgroundColor": "#f3f4f6",
"app-plus": { }
"background": "#efeff4" ]
}, },
"backgroundTextStyle": "light", {
"enablePullDownRefresh": false, "root": "order",
"onReachBottomDistance": 50 "pages": [{
} "path": "detail/detail",
"style": {
"navigationBarTitleText": "动态",
"enablePullDownRefresh": false
}
}]
}
],
"globalStyle": {
"navigationBarTextStyle": "black",
"navigationBarBackgroundColor": "#FFFFFF",
"backgroundColor": "#f3f4f6",
"app-plus": {
"background": "#efeff4"
},
"backgroundTextStyle": "light",
"enablePullDownRefresh": false,
"onReachBottomDistance": 50
}
} }
pages/demand/components/index.vue
...@@ -24,10 +24,14 @@ ...@@ -24,10 +24,14 @@
<button class="buttoncl">修改</button> <button class="buttoncl">修改</button>
<button class="buttonclde" @click.stop="abolish(1)">取消订单</button> <button class="buttonclde" @click.stop="abolish(1)">取消订单</button>
</view> </view>
<!-- // 已驳回 --> <!-- // 已驳回 -->
<view class="reject" v-if="subscript == '1'"> <view class="d-flex a-end j-sb" v-if="subscript == '1'">
驳回理由：没有明确问题描述 <view class="reject flex-1 hiddenMore" >
驳回理由：没有明确问题描述没有明确问题描述没有明确问题描述没有明确问题描述
</view>
<button @click.stop="handleAgainAdd" class="buttoncl" style="margin-left: 20rpx;">重新发布</button>
</view> </view>
<!-- // 待支付 --> <!-- // 待支付 -->
<view class="unpaid" v-if="subscript == '2'"> <view class="unpaid" v-if="subscript == '2'">
<view class="unpaid-paid"> <view class="unpaid-paid">
...@@ -104,6 +108,13 @@ ...@@ -104,6 +108,13 @@
this.titbut = '2' this.titbut = '2'
this.show = true this.show = true
} }
},
//重新发布按钮事件
handleAgainAdd(){
let that = this
that.$uniGo.navigateTo({
url:'/demand/updateForm/updateForm'
})
}, },
// 再看看 // 再看看
aindex(){ aindex(){
...@@ -223,10 +234,12 @@ ...@@ -223,10 +234,12 @@
} }
.reject { .reject {
margin-top: 40rpx; margin-top: 20rpx;
font-size: 24rpx; font-size: 24rpx;
font-weight: 400; font-weight: 400;
color: #FD0000; color: #FD0000;
line-height: 33rpx;
letter-spacing: 3rpx;
} }
.unpaid { .unpaid {
......
pages/my/index.vue
...@@ -25,7 +25,7 @@ ...@@ -25,7 +25,7 @@
</view> </view>
<image src="@/static/icon/my09.png" mode=""></image> <image src="@/static/icon/my09.png" mode=""></image>
</view> </view>
<view class="content-in-btn"> <view class="content-in-btn" @click="handleLogin">
<u-button <u-button
text="退出登录" text="退出登录"
color="#EA654E" color="#EA654E"
...@@ -162,6 +162,11 @@ export default { ...@@ -162,6 +162,11 @@ export default {
url: row.url url: row.url
}); });
} }
},
handleLogin(){
this.$uniGo.navigateTo({
url:'/my/login/login'
})
} }
} }
}; };
......
pages/order/index.vue
<template> <template>
<view class="content"> <view class="content">
<view :style="{ height: `calc(${globalData.statusBarHeight}rpx + 130rpx)` }"></view>
<view class="friends-list-box" @click="handleDetail"> <view class="friends-list-box" @click="handleDetail">
<evaluateList :list="evaluateList"></evaluateList> <evaluateList :list="evaluateList"></evaluateList>
<view class="margin-top-two"> <view class="margin-top-two">
<comment-list :personEvalList="personEvalList"></comment-list> <comment-list :personEvalList="personEvalList"></comment-list>
</view> </view>
</view> </view>
<com-navbar :leftIcon="false" :homeShow="false" bgColor="#fff" title="动态"
:titleStyle="{ color: '#000', fontSize: '32rpx',scrollTopHeader: scrollTopHeader }" />
<com-tabbar :list=" [{
name: '首页',
icon: '/static/tabbar/tb1.png',
selectIcon:'/static/tabbar/td1.png',
url: '/pages/home/index',
type: 'type'
}, {
name: '我的需求',
icon: '/static/tabbar/tb2.png',
selectIcon: '/static/tabbar/td2.png',
url: '/pages/demand/index',
type: 'type'
}, {
name: '发布',
icon: '/static/tabbar/fb.png',
selectIcon:'/static/tabbar/fb.png',
url: '/pages/release/index',
type: 'type'
}, {
name: '动态',
icon: '/static/tabbar/tb3.png',
selectIcon: '/static/tabbar/td3.png',
url: '/pages/order/index',
type: 'order'
}, {
name:'我的' ,
icon:'/static/tabbar/tb4.png' ,
selectIcon:'/static/tabbar/td4.png',
url: '/pages/my/index',
type: 'type'
}]"></com-tabbar>
</view> </view>
</template> </template>
...@@ -17,6 +52,7 @@ ...@@ -17,6 +52,7 @@
}, },
data() { data() {
return { return {
globalData: getApp().globalData,
evaluateList: [{ evaluateList: [{
name: '马保国', name: '马保国',
image: 'https://slzh-oss.oss-cn-beijing.aliyuncs.com/usercenter/template/2c94809a787cec070179e01ec0ba02a9.jpg', image: 'https://slzh-oss.oss-cn-beijing.aliyuncs.com/usercenter/template/2c94809a787cec070179e01ec0ba02a9.jpg',
...@@ -54,6 +90,30 @@ ...@@ -54,6 +90,30 @@
date: '2022-05-11', date: '2022-05-11',
content: '评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容' content: '评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容'
}, },
{
avatar: 'https://img2.baidu.com/it/u=955956276,3392954639&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500',
nickname: '李哈哈',
date: '2022-01-31',
content: '评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容'
},
{
avatar: 'https://img1.baidu.com/it/u=3486651663,3991438881&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500',
nickname: '李小乖',
date: '2022-05-11',
content: '评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容'
},
{
avatar: 'https://img2.baidu.com/it/u=955956276,3392954639&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500',
nickname: '李哈哈',
date: '2022-01-31',
content: '评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容'
},
{
avatar: 'https://img1.baidu.com/it/u=3486651663,3991438881&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500',
nickname: '李小乖',
date: '2022-05-11',
content: '评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容评论内容'
},
] ]
} }
}, },
...@@ -63,7 +123,9 @@ ...@@ -63,7 +123,9 @@
methods: { methods: {
handleDetail() { handleDetail() {
let that = this let that = this
that.$uniGo.navigateTo({url:'/order/detail/detail'}) that.$uniGo.navigateTo({
url: '/order/detail/detail'
})
} }
} }
......
pages/release/index.vue
<template> <template>
<view> <view>
<recordCom></recordCom> <view :style="{ height: `calc(${globalData.statusBarHeight}rpx + 130rpx)` }"></view>
<view class="paddding-x-two"> <view class="paddding-x-two ">
<view class="d-flex a-center j-sb form-item-height paddding-x-three"> <releaseForm></releaseForm>
<view class="form-item-name">标题<span class="must-sign">*</span></view>
<view class="input-box">
<input type="text" placeholder="请输入标题">
</view>
</view>
<view class="d-flex a-center j-sb form-item-height">
<view class="form-item-name">联系人<span class="must-sign">*</span></view>
<view class="input-box">
<input type="text" placeholder="请输入联系人姓名">
</view>
</view>
<view class="d-flex a-center j-sb form-item-height">
<view class="form-item-name">联系电话<span class="must-sign">*</span></view>
<view class="input-box">
<input type="text" placeholder="请输入联系人手机号">
</view>
</view>
<view class="d-flex a-center j-sb form-item-height">
<view class="form-item-name">维修时间<span class="must-sign">*</span></view>
<view class="input-box d-flex a-center" @click="showTime = true">
<u-datetime-picker ref="datePicker" :formatter="formatter" v-model="time" :show="showTime"
mode="date" @confirm="handleConfirmDate" @cancel="handleClose"></u-datetime-picker>
<input type="text" v-model="time" placeholder="请选择时间">
<u-icon name="arrow-down-fill" color="#000000" size="28"></u-icon>
</view>
</view>
<view class="d-flex a-center j-sb form-item-height">
<view class="form-item-name">维修地址<span class="must-sign">*</span></view>
<view class="input-box">
<input type="text" placeholder="请填写维修地址">
</view>
</view>
<view class="d-flex a-center j-sb form-item-height">
<view class="form-item-name">预算金额<span class="must-sign">*</span></view>
<view class="input-box">
<input type="text" placeholder="请填写预算金额">
</view>
</view>
<view class="paddding-x-three">
<view class="form-item-name margin-y-two">备注</view>
<u--textarea v-model="remark" height="128" placeholder="备注说明"></u--textarea>
</view>
<view>
<view>
<view class="d-flex j-sb a-center form-item-height-only">
<view class="form-item-name">上传图片</view>
<view class="form-tips">一下内容三选一必填</view>
</view>
<view class="paddding-x-three">
<comUpload></comUpload>
</view>
</view>
<view>
<view class="d-flex j-sb a-center form-item-height-only">
<view class="form-item-name">上传视频</view>
</view>
<view class="paddding-x-three">
<comUpload :acceptType="acceptType"></comUpload>
</view>
</view>
<view>
<view class="d-flex j-sb a-center form-item-height-only">
<view class="form-item-name">语音描述</view>
</view>
<!-- <view class="paddding-x-three margin-y-two">
<free-audio startPic='../../static/play.png' endPic='../../static/stop.png' audioId='audio1'
:url='path' @delete="handleDelete"></free-audio>
</view> -->
<view class="paddding-x-three d-flex j-center " @click="handleAddVoice">
<view class="voice-box d-flex a-center j-center">
<u-icon name="mic" color="#2979ff" size="32"></u-icon>
<view>添加语音描述</view>
</view>
</view>
</view>
</view>
<view class="submit-btn">发布需求</view> <view class="submit-btn">发布需求</view>
</view> </view>
<com-navbar :leftIcon="false" :homeShow="false" bgColor="#fff" title="发布"
:titleStyle="{ color: '#000', fontSize: '32rpx',scrollTopHeader: scrollTopHeader }" />
<com-tabbar :list=" [{
name: '首页',
icon: '/static/tabbar/tb1.png',
selectIcon:'/static/tabbar/td1.png',
url: '/pages/home/index',
type: 'type'
}, {
name: '我的需求',
icon: '/static/tabbar/tb2.png',
selectIcon: '/static/tabbar/td2.png',
url: '/pages/demand/index',
type: 'type'
}, {
name: '发布',
icon: '/static/tabbar/fb.png',
selectIcon:'/static/tabbar/fb.png',
url: '/pages/release/index',
type: 'release'
}, {
name: '动态',
icon: '/static/tabbar/tb3.png',
selectIcon: '/static/tabbar/td3.png',
url: '/pages/order/index',
type: 'type'
}, {
name:'我的' ,
icon:'/static/tabbar/tb4.png' ,
selectIcon:'/static/tabbar/td4.png',
url: '/pages/my/index',
type: 'type'
}]"></com-tabbar>
</view> </view>
</template> </template>
<script> <script>
import freeAudio from '@/components/chengpeng-audio/free-audio.vue' import releaseForm from '@/components/form.vue'
import recordCom from '@/components/record/record.vue' import recordCom from '@/components/record/record.vue'
export default { export default {
components: { components: {
freeAudio,recordCom releaseForm,
recordCom,
}, },
data() { data() {
return { return {
showTime: false, //时间选择器是否显示 globalData: getApp().globalData,
time: undefined, //时间选择器的值
remark: '',
acceptType: 'video',
path: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-hello-uniapp/2cc220e0-c27a-11ea-9dfb-6da8e309e0d8.mp3',
voicePath:''
} }
}, },
onShow() { onShow() {
let that = this let that = this
}, },
onLoad() {
let that = this
// 时间格式化默认值
that.time = uni.$u.timeFormat(Number(new Date()), 'yyyy-mm-dd');
},
//暂停所有音频（一般用于页面切换时停止正在播放的音频）
onUnload() { //普通页面在 onUnload 生命周期中执行
uni.$emit('stop')
},
onHide() { //tabBar页面在onHide生命周期中执行
uni.$emit('stop')
},
methods: { methods: {
// 时间选择器确认事件
async handleConfirmDate(e) {
// value:返回所选时间戳，mode:当前模式
let that = this
that.showTime = false
// 时间格式化
const timeFormat = uni.$u.timeFormat;
let timeValue = await timeFormat(e.value, 'yyyy-mm-dd');
that.time = timeValue
},
//时间选择器的关闭按钮事件
handleClose() {
this.showTime = false
},
//添加语音
handleAddVoice() {
let that = this
},
// 删除语音
handleDelete() {
console.log('删除')
// const recorderManager = uni.getRecorderManager()
// console.log(recorderManager,'大数据可能')
},
//时间选择器格式化
formatter(type, value) {
if (type === 'year') {
return `${value}年`
}
if (type === 'month') {
return `${value}月`
}
if (type === 'day') {
return `${value}日`
}
return value
},
} }
} }
</script> </script>
<style scoped> <style scoped>
@import url("@/css/form.css");
::v-deep .u-border {
border: 0 !important;
background: #F5F5F5 !important;
}
::v-deep .u-upload__wrap__preview {
margin: 0 6rpx 10rpx 0 !important;
}
</style> </style>
utils/common.css
...@@ -98,6 +98,12 @@ ...@@ -98,6 +98,12 @@
.padding-x-four{ .padding-x-four{
padding: 0 40rpx; padding: 0 40rpx;
} }
.padding-y-two{
padding: 20rpx 0;
}
.padding-bottom-diatence{
padding-bottom: 150rpx !important;
}
.margin-left-one{ .margin-left-one{
margin-left: 10rpx; margin-left: 10rpx;
......
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