Skip to content

T
take_order
Commit 539511b9 authored by Facius's avatar Facius
Browse files
Options

Merge branch 'dev-photo-v2' of https://git.banshouhui.com/heyinchen/take_order into dev-photo-v2

parents 19990dc6 8a2015b3
Hide whitespace changes
Inline Side-by-side
Showing with 85 additions and 61 deletions
take-order/.gitignore
View file @ 539511b9
.DS_Store
node_modules/
dist/
.hbuilderx/
npm-debug.log*
yarn-debug.log*
yarn-error.log*
......
take-order/.hbuilderx/launch.json deleted 100644 → 0
View file @ 19990dc6
{ // launch.json 配置了启动调试时相关设置，configurations下节点名称可为 app-plus/h5/mp-weixin/mp-baidu/mp-alipay/mp-qq/mp-toutiao/mp-360/
// launchtype项可配置值为local或remote, local代表前端连本地云函数，remote代表前端连云端云函数
"version": "0.0",
"configurations": [{
"type": "uniCloud",
"default": {
"launchtype": "remote"
}
}
]
}
take-order/pages/photo/standard.vue
View file @ 539511b9
<template>
<view class="standard-box" >
<cover-view class="standard-box" >
<swiper class="swiper-box" :current="swiperCurrent" @transition="transition" @animationfinish="animationfinish">
<swiper-item class="swiper-item" key="swiper1">
<view class="title">
......@@ -14,41 +14,43 @@
</view>
</view>
</swiper-item>
<swiper-item class="swiper-item" v-for="(item, index) in tabs" :key="index">
{{item.title}}
<swiper-item class="swiper-item" v-for="(src, index) in swiperList" :key="index">
<cover-image bindtap="previewImage(item,index)" class="icon" mode="aspectFit" :src="src"></cover-image>
</swiper-item>
</swiper>
<view class="tab-box">
<u-tabs-swiper bg-color="transparent" inactive-color="#999"
ref="uTabs" :list="list" :current="current"
ref="uTabs" :list="tabList" :current="current"
@change="tabsChange" :is-scroll="false" swiperWidth="750"></u-tabs-swiper>
</view>
</view>
</cover-view>
</template>
<script>
export default {
name:'photo-standard'
name:"photo-standard",
props:{
item:{
type:'Object',
detault:()=>{
return null
currentItem:{
type: Object,
default () {
return {
images: [],
}
}
}
},
},
data() {
return {
list: [{
tabList: [{
name: '十年'
}, {
name: '青春'
}, {
name: '之约'
}],
tabs:[{
swiperList:[{
title:'记录的距离大家零点九零杰拉德杰拉德建立的连接就111111111111',
},{
title:'记录的距离大家零点九零杰拉德杰拉德建立的连接就222222',
......@@ -61,7 +63,18 @@
height:0,
}
},
onLoad(e) {
watch:{
"currentItem.images"(val){
if(val.length>0){
this.changeList()
// let swiperList = JSON.parse(JSON.stringify(val))
// let len = tabs.length
// let tabList = [{name:'拍照要求'}].concat(Array.from({name:'示意图'},len))
// console.log(tabList,'tabList')
}
},
},
created() {
// getApp().trackPage('照片预览页')
// console.log(e, 'e')
// if (e.img) {
......@@ -70,14 +83,19 @@
// console.log(this.images, 'this.images')
},
mounted(){
this.changeList(this.currentItem.images)
this.getSwiperHeight()
},
methods: {
changeList(){
let swiperList = JSON.parse(JSON.stringify(val))
let len = tabs.length
let tabList = [{name:'拍照要求'}].concat(Array.from({name:'示意图'},len))
console.log(tabList,'tabList')
},
getSwiperHeight(){
const globalData = getApp().globalData
this.height = globalData.screenHeight*2 - globalData.navHeight - 200
console.log(this.height,'height')
console.log(globalData.screenHeight,'globalData.screenHeight')
},
previewImage(index){
uni.previewImage({
......@@ -91,14 +109,14 @@
},
// swiper-item左右移动，通知tabs的滑块跟随移动
transition(e) {
console.log(e.detail,'e.detail-transition')
// console.log(e.detail,'e.detail-transition')
let dx = e.detail.dx;
this.$refs.uTabs.setDx(dx);
},
// 由于swiper的内部机制问题，快速切换swiper不会触发dx的连续变化，需要在结束时重置状态
// swiper滑动结束，分别设置tabs和swiper的状态
animationfinish(e) {
console.log(e.detail,'e.detail-animationfinish')
// console.log(e.detail,'e.detail-animationfinish')
let current = e.detail.current;
this.$refs.uTabs.setFinishCurrent(current);
this.swiperCurrent = current;
......@@ -118,7 +136,7 @@
position: absolute;
left:0;right:0;
/* height: calc(100vh - 240rpx); */
z-index: 100;
bottom:240rpx;
display: flex;
flex-direction: column;
......
take-order/pages/photo/take.vue
View file @ 539511b9
......@@ -3,12 +3,12 @@
<view class="camera-container">
<cover-view class="header-box" :style="{'height':navHeight + 'rpx'}">
<cover-view class="inner">
<cover-image bindtap="changeScale" class="icon" mode="aspectFit" src="/static/photo/icon-switch.png"></cover-image>
<cover-image bindtap="changeScale" class="icon" mode="aspectFit" src="/static/photo/icon-light.png"></cover-image>
<cover-image bindtap="changeScale" class="icon" mode="aspectFit" src="/static/photo/icon-setting.png"></cover-image>
<cover-image @click="setCameraInfo('devicePosition')" class="icon" mode="aspectFit" src="/static/photo/icon-switch.png"></cover-image>
<cover-image @click="setCameraInfo('flash')" class="icon" mode="aspectFit" src="/static/photo/icon-light.png"></cover-image>
<cover-image @click="goPage('/pages/photo/markSetting')" class="icon" mode="aspectFit" src="/static/photo/icon-setting.png"></cover-image>
</cover-view>
</cover-view>
<camera class="camera-box" v-if="cameraChange" device-position="front" flash="on" :style="{'height':cameraHeight + 'rpx'}"
<camera class="camera-box" v-if="cameraChange" :device-position="cameraInfo.devicePosition" :flash="cameraInfo.flash" :style="{'height':cameraHeight + 'rpx'}"
@error="cameraError">
<cover-view class="mark-box">
<cover-view class="txt u-m-l-20 u-m-t-30">经度：{{waterInfo.longitude || '正在获取中...'}}</cover-view>
......@@ -18,18 +18,18 @@
</cover-view>
<cover-image class="mark-water" mode="aspectFit" :src="waterInfo.markImage"></cover-image>
</camera>
<cover-view class="bottom-box">
<cover-view class="bottom-box" v-show="!standardShow">
<cover-image class="icon" src='/static/photo/icon-back.png' mode="" @click="goBack"></cover-image>
<cover-image class='icon-take icon' src='/static/photo/icon-take.png' @click="takePhoto"> </cover-image>
<cover-image class='icon' src='/static/photo/icon-standard.png' @click="showStandard"> </cover-image>
<cover-image class='icon' src='/static/photo/icon-standard.png' @click="standardShow = true"> </cover-image>
</cover-view>
<canvas canvas-id="canvas" class="canvas" :style="{'width':750 + 'rpx','height': cameraHeight + 'rpx'}"></canvas>
<page-container class="page-mask" v-show="standardShow">
<standard :item="currentItem"></standard>
<cover-view class="btn-close">
<canvas canvas-id="canvas" id="photoCanvas" class="canvas" :style="{'width':750 + 'rpx','height': cameraHeight + 'rpx'}"></canvas>
<cover-view class="page-mask" v-if="standardShow">
<photo-standard :currentItem="currentItem" />
<cover-view class="btn-close" @click="standardShow = false">
<cover-image class="icon icon-close" mode="aspectFit" src="/static/photo/icon-close.png"></cover-image>
</cover-view>
</page-container>
</cover-view>
</view>
</template>
......@@ -42,31 +42,19 @@
import standard from '@/components/photo/standard.vue'
export default {
components:{
standard:standard,
'photo-standard':standard,
},
data() {
return {
// title: '',
// ctx: null,
// path: "",
// image: "",
// showImage: false,
// canvas: null,
// longitude: '正在获取中...',
// latitude: '正在获取中...',
// address: '正在获取中...',
// date: '',
// width: '',
// height: '',
// markPath: '',
// canvasWidth: 0,
// canvasHeight: 0,
// restuleImage: '',
currentItem:{
images:['https://qn-static.banshouhui.com/live_mark.png','https://qn-static.banshouhui.com/live_mark.png']
name:'111',
images:['https://qn-static.banshouhui.com/live_mark.png','https://qn-static.banshouhui.com/live_mark.png','https://qn-static.banshouhui.com/live_mark.png'],
},
standardShow:false,
cameraInfo:{
devicePosition:'front',
flash:'off'
},
standardShow:true,
waterInfo: {
longitude: '', // 经度
latitude: '', // 维度
......@@ -96,6 +84,7 @@
this.waterInfo.date = this.getTime()
this.getLocation()
this.getMarkPath()
console.log(standard,'standard')
// this.getSystemInfo()
// uni.setNavigationBarColor({
// frontColor: '#FFFFFF',
......@@ -113,6 +102,7 @@
},
onShow() {
this.initData()
// this.standardShow = true
// this.cameraHeight = globalData.rpxScreenHeight
// uni.authorize({
......@@ -129,6 +119,31 @@
url:'/pages/photo/brand'
})
},
goPage(url){
url = url || '/pages/photo/index';
console.log(url,'url')
uni.navigateTo({
url:url
})
},
setCameraInfo(type){
// 设置相机前置后置、闪关灯等
const cameraInfo = this.cameraInfo
let val = cameraInfo[type]
switch(type){
case 'devicePosition':
val = val==='back' ? 'front' : 'back'
break;
case 'flash':
val = val==='auto' ? 'on' : 'auto'
break;
defalut:
break;
}
console.log(type,'type',val,'val')
this.cameraInfo[type] = val
},
initData() {
const globalData = getApp().globalData
this.navHeight = globalData.navHeight
......@@ -498,6 +513,7 @@
bottom:0;
left:0;right:0;
height:200rpx;
z-index:100;
display: flex;
justify-content: center;
align-items: center;
......
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