hly
/
recruitment-wechat-uniapp-241012
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
前端-胡立永 6 months ago
parent
8e9141e94f
commit
2e0cac7b8d
7 changed files with 266 additions and 745 deletions
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +4
    -6
      pages.json
  2. +3
    -3
      pages/index/center.vue
  3. +259
    -0
      pages_order/mine/promotion.vue
  4. +0
    -567
      pages_order/order/orderDetail.vue
  5. +0
    -169
      pages_order/product/productDetail.vue
  6. BIN
      pages_order/static/order/icon.png
  7. BIN
      pages_order/static/product/like.png

+ 4
- 6
pages.json View File

@ -32,9 +32,7 @@
},
"subPackages": [{
"root": "pages_order",
"pages": [{
"path": "order/orderDetail"
},
"pages": [
{
"path": "mine/purse"
},
@ -44,9 +42,6 @@
{
"path": "mine/address"
},
{
"path": "product/productDetail"
},
{
"path": "auth/wxLogin"
},
@ -76,6 +71,9 @@
},
{
"path": "mine/contract"
},
{
"path": "mine/promotion"
}
]
}],


+ 3
- 3
pages/index/center.vue View File

@ -135,7 +135,7 @@
<text class="grid-text">兑换码</text>
</uv-grid-item>
<uv-grid-item @click="$utils.redirectTo('/index/order')">
<uv-grid-item @click="$utils.redirectTo('/index/consult')">
<image class="image" src="/static/image/center/5.png" mode=""></image>
<text class="grid-text">考证咨询</text>
</uv-grid-item>
@ -145,7 +145,7 @@
<text class="grid-text">电子合同</text>
</uv-grid-item>
<uv-grid-item @click="$utils.navigateTo('/pages_order/order/refundsOrExchange?index='+1)">
<uv-grid-item @click="$utils.navigateTo('/pages_order/mine/promotion?index='+1)">
<image class="image" src="/static/image/center/5.png" mode=""></image>
<text class="grid-text">面对面分享</text>
</uv-grid-item>
@ -161,7 +161,7 @@
<text class="grid-text">系统设置</text>
</uv-grid-item>
<uv-grid-item @click="$utils.redirectTo('/index/order')">
<uv-grid-item @click="$utils.navigateTo('/pages_order/mine/help')">
<image class="image" src="/static/image/center/5.png" mode=""></image>
<text class="grid-text">帮助与反馈</text>
</uv-grid-item>


+ 259
- 0
pages_order/mine/promotion.vue View File

@ -0,0 +1,259 @@
<template>
<view class="promotion">
<navbar title="面对面分享" leftClick @leftClick="$utils.navigateBack" />
<view class="promotion-card">
<image style="width: 100%;" :src="imagePath" mode="widthFix"></image>
<canvas id="myCanvas" type="2d" canvas-id="firstCanvas1"></canvas>
</view>
</view>
</template>
<script>
import {
mapState
} from 'vuex'
export default {
name: 'Promotion',
computed: {
...mapState(['userInfo']),
},
data() {
return {
url: '',
title: '123123',
baseUrl: 'https://dianpin-img.xzaiyp.top/',
canvas: {},
imagePath: '',
}
},
onShow() {
this.getQrCode()
this.$store.commit('getUserInfo')
},
methods: {
getQrCode() {
this.$api('getQrCode', res => {
if (res.code == 200) {
this.url = res.result.url
this.title = res.result.name
this.draw()
}
})
},
draw() {
uni.showLoading({
title: "拼命绘画中..."
})
wx.createSelectorQuery()
.select('#myCanvas') // 绘制的canvas的id
.fields({
node: true,
size: true
})
.exec((res) => {
const canvas = res[0].node
// 渲染上下文
const ctx = canvas.getContext('2d')
// Canvas 画布的实际绘制宽高
const width = res[0].width
const height = res[0].height
// 初始化画布大小
const dpr = wx.getWindowInfo().pixelRatio
//根据dpr调整
// dpr 2 4
// 3 6
let Ratio = dpr * 2
console.log("bug", dpr)
canvas.width = width * dpr
canvas.height = height * dpr
this.canvas = canvas
ctx.scale(dpr, dpr)
ctx.clearRect(0, 0, width, height)
ctx.fillStyle = '#fff'
ctx.fillRect(0, 0, canvas.width, canvas.height)
//用户图片
// const image = canvas.createImage()
// image.onload = () => {
// ctx.drawImage(image, 30, 18, 40, 40)
// }
// image.src = '/public/img/wechar_1.png'
// image.src = this.userInfo.headImage
ctx.fillStyle = 'black'
ctx.font = '22px PingFangSC-regular';
let s = this.title || '加油站'
ctx.fillText(s, canvas.width / Ratio - s.length * 11, 50);
//二维码图片
const coderImage = canvas.createImage()
coderImage.src = this.baseUrl + this.url
coderImage.onload = () => {
ctx.drawImage(coderImage,
canvas.width / Ratio - 240 / 2, 100, 240, 240)
}
// 绘制完成后存储路径
setTimeout(() => {
wx.canvasToTempFilePath({
x: 0,
y: 0,
width: this.canvas.width,
height: this.canvas.height,
canvas,
success: (res) => {
var tempFilePath = res.tempFilePath;
this.imagePath = tempFilePath
uni.hideLoading()
}
});
}, 600);
})
},
back() {
uni.navigateBack(-1)
},
preservationImg(img) {
let that = this
uni.authorize({
/* scope.writePhotosAlbum 类型是保存到相册 */
scope: 'scope.writePhotosAlbum',
success() {
/* 已授权进入 */
/* 保存图片到相册方法方法 */
that.imgApi(img);
},
complete(res) {
/* 判断如果没有授权就打开设置选项让用户重新授权 */
uni.getSetting({
success(res) {
if (!res.authSetting['scope.writePhotosAlbum']) {
/* 打开设置的方法 */
that.openInstall();
}
}
});
}
});
},
imgApi(image) {
/* 获取图片的信息 */
uni.getImageInfo({
src: image,
success: function(image) {
/* 保存图片到手机相册 */
uni.saveImageToPhotosAlbum({
filePath: image.path,
success: function() {
uni.showModal({
title: '保存成功',
content: '图片已成功保存到相册',
showCancel: false
});
},
complete(res) {
console.log(res);
}
});
}
});
},
}
}
</script>
<style lang="scss" scoped>
.promotion {
.promotion-card {
width: 90%;
margin: 100rpx auto 0rpx auto;
box-shadow: 0rpx 0rpx 15rpx rgba(0, 0, 0, .2);
border-radius: 15rpx;
padding: 40rpx 30rpx;
box-sizing: border-box;
.user-info {
display: flex;
align-items: center;
.image {
width: 80rpx;
height: 80rpx;
border-radius: 50%;
margin-right: 10rpx;
}
.user-name {
font-size: 30rpx;
}
}
.invitation-code-img {
display: flex;
align-items: center;
justify-content: center;
margin: 100rpx 0rpx;
.image {
width: 30%;
border-radius: 50%;
}
}
.invitation-code {
text-align: center;
color: #818181;
font-size: 28rpx;
}
}
.btns {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
height: 120rpx;
display: flex;
background: #00aaff;
color: white;
font-size: 28rpx;
.btn {
flex: 1;
display: flex;
align-items: center;
justify-content: center;
&:nth-child(2) {
background: orange;
}
}
}
}
#myCanvas {
position: fixed;
left: 100%;
/* visibility: hidden */
/* visibility: hidden; */
/* margin-top: 100rpx; */
margin: 68rpx auto;
width: 750rpx;
height: 750rpx;
/* line-height: 20px; */
background-color: rgba(255, 255, 255, 1);
text-align: center;
}
</style>

+ 0
- 567
pages_order/order/orderDetail.vue View File

@ -1,567 +0,0 @@
<template>
<view>
<navbar
title="订单详情"
leftClick
@leftClick="$utils.navigateBack"
/>
<!-- 水洗店 -->
<view class=""
v-if="userShop">
<view class="controls">
<view class="title">
<image src="../static/order/icon.png" mode=""></image>
服务完成
</view>
<view class="tips">
待送回
</view>
<view class="btns">
<view class="btn1">
快递寄回
</view>
<view class="btn2">
线下配送
</view>
</view>
</view>
<view class="steps">
<uv-steps
activeColor="#FD5100"
:current="stepsCurrent" dot>
<uv-steps-item :title="item"
:key="index"
v-for="(item, index) in steps"></uv-steps-item>
</uv-steps>
</view>
</view>
<!-- 酒店和水洗店 -->
<view class="info">
<view class="flex"
style="display: flex;">
<view style="width: 8rpx;height: 30rpx;
background: #FD5100;border-radius: 6rpx;" />
<view class="head-title">服务项目</view>
</view>
<view class="flex">
<view class="server-item">
<view class="img-box">
<image :src="msgShop.image" mode="aspectFill"></image>
</view>
<view class="server-info">
<view class="server-title">
{{msgOrder.projectName}}
<!-- <view class="coupon">领券立减</view> -->
</view>
<view class="current-price">
<text class="unit">￥</text>{{msgOrder.money}}
</view>
<view class="sales-volume" style="margin-top: 5px;">
<view class="desc">规格：{{msgOrder.unit}}</view>
</view>
<view class="time-coupon">
<!-- <view class="flex">
<image src="@/static/home/time-icon.png"></image>
<view class="time">{{msgOrder.useTime}}分钟</view>
</view> -->
<!-- <view class="sales-volume">
<image src="@/static/icons/icon1.png"></image>
<view class="desc">已售出{{msgShop.payNum}}+单</view>
</view> -->
</view>
</view>
</view>
</view>
<!-- <view class="line min_tips">
<view class="head-div flex">
<view style="width: 118rpx;height: 118rpx;border-radius: 50%;overflow: hidden;">
<image style="width: 118rpx;" :src="msgTechnician.image" mode="widthFix"></image>
</view>
<view style="padding: 10rpx 34rpx;display: flex;flex-direction: column;justify-content: space-around;">
<view class="nickname">
{{msgTechnician.title}}
<view v-if="msgTechnician.isVip" class="tag">
<image src="@/static/order/s.png" mode="aspectFit"></image>
<view class="auth">官方认证</view>
</view>
</view>
<view class="days">
<van-rate v-model="msgTechnician.score" :size="10" readonly color="#ffb54c" void-icon="star"
void-color="#eee" />
<view class="">
好评{{msgTechnician.pinNum}}
</view>
</view>
</view>
</view>
<view @click="gototechnicianDetail(msgTechnician)" class="btn-x">
服务技师
</view>
</view> -->
<view class="line address">
<view class="address-top">
<!-- <view class="">
服务地址
</view> -->
<view class="copy">
<image @click="copy(msgOrder.name + ' ' + msgOrder.phone + ' ' + msgOrder.address)" src="/static/order/copy.png"></image>
</view>
</view>
<view class="addressDetail">
<view class="">{{msgOrder.name}} {{msgOrder.phone}}</view>
<view class="">{{msgOrder.address}}</view>
</view>
</view>
<view class="line">
<view class="t min_tips">
<view class="">
实付款
</view>
<view class="current-price">
￥{{ msgOrder.money }}
</view>
</view>
<view class="min_tips">
<view class="">
租赁费用
</view>
<view class="">
￥{{ msgOrder.price }}
</view>
</view>
<view class="min_tips">
<view class="">
水洗费用
</view>
<view class="">
￥{{ msgOrder.price}}
</view>
</view>
<view class="min_tips">
<view class="">
押金
</view>
<view class="">
￥{{ msgOrder.price }}
</view>
</view>
</view>
<!-- 订单信息 -->
<view class="line">
<view class="t min_tips">
<view class="">
订单信息
</view>
</view>
<view class="min_tips">
<view class="">
订单编号
</view>
<view class="">
{{msgOrder.id}}
</view>
</view>
<view class="min_tips">
<view class="">
下单时间
</view>
<view class="">
{{msgOrder.createTime}}
</view>
</view>
</view>
<!-- 下单须知 -->
<view class="line">
<view class="t min_tips">
<view class="">
下单须知
</view>
</view>
<view class="min_tips" style="line-height: 40rpx;">
{{msgShop.projectExplain}}
</view>
<view class="btns">
<view @click="clickService" class="btn">
联系客服
</view>
</view>
</view>
</view>
</view>
</template>
<script>
import { mapGetters } from 'vuex'
export default {
computed : {
...mapGetters(['userShop']),
},
data() {
return {
stepsCurrent : 0,
steps : [
'接单',
'检查',
'开始清洗',
'服务完成',
],
msgShop : {
money : 99.99,
image : 'https://img95.699pic.com/photo/50058/1378.jpg_wh860.jpg',
projectExplain : '1.xxxxxxxxxx xxxxxxxxxx。2.xxxxxx xxxxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxxxxxxx xxxxxxxxxxxxx xxxxxxxxxxxxxxxx。3.。',
},
msgOrder : {
money : 99.99,
address : '广东省广州市越秀区城南故事C3栋2802',
name : '李**',
phone : '150*****091',
unit : '120*40*75【桌子尺寸】',
state_dictText : '已完成',
price : 199.99,
id : '020644568964457',
createTime : '2024-01-18 15:39',
projectName : '桌布租赁'
},
}
},
methods: {
}
}
</script>
<style scoped lang="scss">
.order {
background: linear-gradient(#4899a6, #6fc6ad, #6fc6ad);
padding-bottom: 10px;
}
.controls{
margin: 20rpx;
background-color: #fff;
height: 400rpx;
display: flex;
flex-direction: column;
width: 710rpx;
border-radius: 20rpx;
justify-content: center;
align-items: center;
.title{
display: flex;
justify-content: center;
align-items: center;
font-size: 40rpx;
image{
width: 100rpx;
height: 100rpx;
margin-right: 20rpx;
}
}
.tips{
font-size: 26rpx;
color: #FD5100;
margin-top: 10rpx;
}
.btns{
margin-top: 50rpx;
display: flex;
view{
margin: 0 20rpx;
display: flex;
justify-content: center;
align-items: center;
color: #fff;
background-color: $uni-color;
padding: 15rpx 40rpx;
border-radius: 40rpx;
}
.btn2{
background-color: #FFFFFF;
border: 1px solid #A7A7A7;
color: #A7A7A7;
}
}
}
.steps{
margin: 20rpx;
background-color: #fff;
display: flex;
flex-direction: column;
width: 710rpx;
border-radius: 20rpx;
padding: 70rpx 0;
/deep/ .uv-text__value{
font-size: 22rpx !important;
}
}
.box {
padding: 20px;
.btns {
display: flex;
justify-content: center;
align-items: center;
margin-top: 10px;
.btn {
color: #fff;
padding: 10rpx 50rpx;
background-color: #ffb300;
border-radius: 30rpx;
font-size: 25rpx;
margin-right: 10rpx;
}
.btc{
background: #ccc;
}
}
}
.info {
margin: 10px;
padding: 20rpx;
background-color: #fff;
width: calc(100% - 40px);
border-radius: 10px;
.head-title {
font-family: PingFang SC, PingFang SC-Bold;
color: #2f2e2e;
line-height: 30rpx;
margin-left: 10rpx;
}
.server-item {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
background: white;
border-radius: 15rpx;
box-sizing: border-box;
margin: 20rpx 0rpx;
width: 100%;
.img-box {
width: 150rpx;
height: 150rpx;
border-radius: 10rpx;
overflow: hidden;
image {
width: 100%;
height: 100%;
}
}
.server-info {
display: flex;
flex-direction: column;
justify-content: space-around;
width: calc(100% - 180rpx);
box-sizing: border-box;
padding: 10rpx 15rpx;
.server-title {
display: flex;
margin-bottom: 10rpx;
}
.coupon {
display: flex;
justify-content: center;
align-items: center;
background: #F29E45;
color: white;
width: 120rpx;
height: 40rpx;
border-radius: 10rpx;
margin-left: 10rpx;
font-size: 22rpx;
}
.time-coupon,
.price {
display: flex;
flex-wrap: wrap;
align-items: center;
}
.time-coupon {
margin: 10rpx 0rpx;
font-size: 26rpx;
justify-content: space-between;
width: 100%;
.flex {
justify-content: center;
align-items: center;
}
image {
width: 25rpx;
height: 25rpx;
}
.time {
color: #B8B8B8;
margin-left: 6rpx;
}
}
.sales-volume {
display: flex;
align-items: center;
color: #B8B8B8;
font-size: 24rpx;
image {
width: 25rpx;
height: 25rpx;
}
}
}
}
.address {
.address-top{
display: flex;
justify-content: space-between;
align-items: center;
image{
width: 30rpx;
height: 30rpx;
}
}
.addressDetail {
color: #777;
font-size: 22rpx;
padding: 5px 0;
}
text {
background-color: #F29E45;
padding: 8rpx 10rpx;
color: #fff;
font-size: 20rpx;
margin-left: 10px;
border-radius: 5px;
}
}
.min_tips {
font-size: 22rpx;
color: #777;
display: flex;
justify-content: space-between;
padding: 5px 0;
align-items: center;
}
.current-price {
font-size: 30rpx;
color: #FD5100;
}
.line {
border-top: 2px dotted #00000011;
padding: 20rpx 0;
.t {
padding: 5px 0;
color: #000;
font-size: 26rpx;
}
}
.head-div {
.nickname {
font-size: 30rpx;
font-weight: 600;
text-align: left;
line-height: 42rpx;
display: flex;
align-items: center;
.tag {
position: relative;
display: flex;
align-items: center;
image {
height: 45rpx;
width: 90rpx;
vertical-align: middle;
}
.auth {
position: absolute;
white-space: nowrap;
color: #FF6200;
left: 23rpx;
font-size: 17rpx;
}
}
}
.days {
font-size: 20rpx;
font-weight: 400;
text-align: left;
line-height: 56rpx;
display: flex;
align-items: center;
view {
padding-left: 5px;
}
}
}
.btn-x {
color: #6fc6ad;
border: 1px solid #6fc6ad;
padding: 10rpx 20rpx;
border-radius: 30rpx;
}
.btns {
display: flex;
justify-content: center;
.btn {
color: #6fc6ad;
border: 1px solid #6fc6ad;
padding: 10rpx 20rpx;
border-radius: 30rpx;
}
}
}
</style>

+ 0
- 169
pages_order/product/productDetail.vue View File

@ -1,169 +0,0 @@
<template>
<view class="page">
<navbar title="商品详情" leftClick @leftClick="$utils.navigateBack" />
<view class="swipe">
<uv-swiper
:list="productDetail.image.split(',')"
indicator
height="350rpx"></uv-swiper>
</view>
<view class="info">
<view class="title">
桌布租赁
</view>
<view class="info-line">
<view class="price">
￥<text>45.9</text>起
</view>
<view class="num">
已售1000+
<image src="../static/product/like.png" mode=""></image>
</view>
</view>
<view class="tips">
<view class="tip">
专业设备
</view>
<view class="tip">
科学流程
</view>
<view class="tip">
质量保证
</view>
</view>
</view>
<view class="info-unit">
<uv-cell title="是否有桌布" isLink>
<template #icon>
<text class="text">桌布</text>
</template>
</uv-cell>
<uv-cell title="请选择规格" isLink>
<template #icon>
<text class="text">规格</text>
</template>
</uv-cell>
<uv-cell>
<template #icon>
<text>上门取件·送货上门</text>
</template>
</uv-cell>
</view>
<view class="content">
<view class="title">
商品详情
</view>
<uv-parse :content="productDetail.content"></uv-parse>
</view>
<!-- 分享和租赁按钮 -->
<submit
@submit="$refs.submitUnitSelect.open()"
@share="share"/>
<!-- 选择规格 -->
<submitUnitSelect ref="submitUnitSelect"/>
</view>
</template>
<script>
import submit from '../components/product/submit.vue'
import submitUnitSelect from '../components/product/submitUnitSelect.vue'
export default {
components : {
submit,
submitUnitSelect
},
data() {
return {
productDetail : {
image : 'https://cdn.uviewui.com/uview/swiper/swiper3.png,https://cdn.uviewui.com/uview/swiper/swiper2.png',
content : '',
}
}
},
onLoad(args) {
console.log(args);
},
methods: {
// 分享商品
share(){
},
// 选择完成规格立即租赁下单
submit(){
}
}
}
</script>
<style scoped lang="scss">
.page{
.swipe{
}
.info{
padding: 30rpx;
background-color: #fff;
.title{
font-size: 34rpx;
font-weight: 900;
}
.info-line{
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 30rpx;
.price{
font-size: 28rpx;
color: $uni-color;
text{
font-size: 34rpx;
}
}
.num{
font-size: 24rpx;
image{
width: 24rpx;
height: 24rpx;
}
}
}
.tips{
display: flex;
font-size: 20rpx;
margin-top: 30rpx;
.tip{
margin-right: 40rpx;
}
}
}
.info-unit{
margin-top: 20rpx;
padding: 30rpx;
background-color: #fff;
/deep/ text{
font-size: 26rpx;
}
/deep/ .text{
color: #7C7C7C;
margin-right: 20rpx;
font-size: 26rpx;
}
}
.content{
background-color: #fff;
margin-top: 20rpx;
.title{
padding: 30rpx;
}
}
}
</style>

BIN
pages_order/static/order/icon.png View File

Before After
Width: 82  |  Height: 82  |  Size: 3.0 KiB

BIN
pages_order/static/product/like.png View File

Before After
Width: 25  |  Height: 22  |  Size: 1.1 KiB

Write Preview
Loading…
Cancel
Save