页面切图

This commit is contained in:
仲么了
2023-03-09 13:50:45 +08:00
parent 43419da4c7
commit b5892b275f
16 changed files with 282 additions and 29 deletions

110
pages/home/feedback.vue Normal file
View File

@@ -0,0 +1,110 @@
<template>
<Cn-page :loading='loading'>
<view slot='body'>
<view class='index'>
<view class="content" :key="index">
<uni-forms>
<!-- <uni-forms-item label="类型">
<uni-data-select v-model="item.type" :localdata="range"></uni-data-select>
</uni-forms-item> -->
<uni-forms-item label="标题">
<uni-easyinput type="text" v-model="formData.title" placeholder="请输入问题简要" />
</uni-forms-item>
<uni-forms-item label="描述">
<uni-easyinput type="textarea" v-model="formData.des" placeholder="请输入详细描述" />
</uni-forms-item>
<uni-forms-item label="图片">
<uni-file-picker :auto-upload="false" :fileList="formData.fileList" @change="fileChange" />
</uni-forms-item>
</uni-forms>
</view>
<view class="btn-wrap">
<view class="btn-wrap-item " @click="submit"> 提交 </view>
</view>
<navigator url="/pages/home/service" hover-class="none" class="fixed-btn">
<image src="/static/service.png" style="height:66rpx;width:66rpx" />
</navigator>
</view>
</view>
</Cn-page>
</template>
<script>
export default {
data () {
return {
loading: false,
formData: {
title: '',
des: '',
fileList: []
},
range: [
{ value: 0, text: "DVR" },
{ value: 1, text: "APF" },
],
}
},
methods: {
add () {
this.formData.push({
type: '',
address: '',
})
},
submit () {
console.log(this.formData)
uni.navigateBack({ delta: 1 })
},
}
}
</script>
<style lang='scss'>
.index {
padding: 20rpx;
.content {
margin-bottom: 20rpx;
padding: 34rpx;
background: $uni-theme-white;
border-radius: 12rpx;
}
.btn-wrap {
margin-top: 40rpx;
display: flex;
align-items: center;
justify-content: space-between;
.btn-wrap-item {
display: flex;
align-items: center;
justify-content: center;
flex: 1;
background: $uni-theme-blue;
color: #fff;
height: 80rpx;
border-radius: 12rpx;
}
}
}
.fixed-btn {
position: fixed;
right: 80rpx;
bottom: 200rpx;
width: 126rpx;
height: 126rpx;
background: #fff;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 0 10rpx rgba(0, 0, 0, 0.2);
image {
height: 66rpx;
width: 66rpx;
}
}
</style>

105
pages/home/service.vue Normal file
View File

@@ -0,0 +1,105 @@
<template>
<Cn-page :loading='loading'>
<view slot='body'>
<view class='index'>
<!-- 客服页面 显示微信和电话 -->
<view class="content">
<view class="content-item">
<view class="content-item-left">
<image src="/static/phone.png" style="height: 40rpx;width: 40rpx" />
</view>
<view class="content-item-right">
<view class="content-item-right-title">电话</view>
<view class="content-item-right-des">10086</view>
</view>
<view class="content-item-operation" @click="call">拨打</view>
</view>
<view class="content-item mt60">
<view class="content-item-left">
<image src="/static/wechat.png" style="height: 40rpx;width: 40rpx" />
</view>
<view class="content-item-right">
<view class="content-item-right-title">微信</view>
<view class="content-item-right-des">10086</view>
</view>
<view class="content-item-operation" @click="copy">复制</view>
</view>
</view>
</view>
</view>
</Cn-page>
</template>
<script>
export default {
data () {
return {
loading: false
}
},
methods: {
call () {
uni.makePhoneCall({
phoneNumber: '10086'
})
},
copy () {
uni.setClipboardData({
data: '10086',
success: () => {
this.$util.toast('复制成功')
}
})
}
}
}
</script>
<style lang='scss'>
.index {
padding: 34rpx;
.content {
margin-bottom: 20rpx;
padding: 34rpx;
background: $uni-theme-white;
border-radius: 12rpx;
.content-item {
display: flex;
align-items: center;
justify-content: space-between;
.content-item-left {
display: flex;
align-items: center;
justify-content: center;
width: 80rpx;
height: 80rpx;
border-radius: 12rpx;
}
.content-item-right {
flex: 1;
margin-left: 20rpx;
.content-item-right-title {
font-size: 32rpx;
margin-bottom: 10rpx;
}
.content-item-right-des {
font-size: 28rpx;
}
}
.content-item-operation {
padding: 8rpx 20rpx;
margin-left: 20rpx;
font-size: 24rpx;
color: #fff;
background: $uni-theme-blue;
border-radius: 4rpx;
}
}
}
}
</style>