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

take-order/.gitignore

 .DS_Store
 node_modules/
 dist/
+.hbuilderx/
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*

take-order/.hbuilderx/launch.json

-{ // 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

 <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

@@ -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;