newmyj/pages/modelData/index.vue

<template>
	<view>
		<model1 :shareNumber='shareNumber' @openImage='openImage' :isDefault='isDefault' v-if="modelId==3||modelId==1"
			:templateDetail='templateData' :isShare='isShare' :isLook='isLook'></model1>
		<model2 :shareNumber='shareNumber' @openImage='openImage' :isDefault='isDefault' v-else-if="modelId==4" :templateDetail='templateData'
			:isShare='isShare' :isLook='isLook'></model2>
		<model3 :shareNumber='shareNumber' @openImage='openImage' :isDefault='isDefault' v-else-if="modelId==5"  :templateDetail='templateData'
			:isShare='isShare' :isLook='isLook'></model3>
		<model4 :shareNumber='shareNumber' @openImage='openImage' :isDefault='isDefault' v-else-if="modelId==6"  :templateDetail='templateData'
			:isShare='isShare' :isLook='isLook'></model4>
		<model5 :shareNumber='shareNumber' @openImage='openImage' :isDefault='isDefault' v-else-if="modelId==7"  :templateDetail='templateData'
			:isShare='isShare' :isLook='isLook'></model5>
		<template v-if="imageList.length>0">
			<q-previewImage ref="previewImage" :urls="imageList" 
				@close="close" @open="open"  @onLongpress="onLongpress"></q-previewImage>
		</template>
	</view>
</template>

<script>
	import model1 from './modeltemplate/model_1.vue';
	import model2 from './modeltemplate/model_2.vue'
	import model3 from './modeltemplate/model_3.vue'
	import model4 from './modeltemplate/model_4.vue'
	import model5 from './modeltemplate/model_5.vue'
	export default {
		props: {
			// 浏览数量
			shareNumber: {
				type: Number,
				default: 0
			},
			// 是否显示默认数据
			isDefault: {
				type: Boolean,
				default: true
			},
			templateData: {
				type: Object,
				default: () => {
					return {}
				}
			},
			isShare: {
				type: Boolean,
				default: false
			},
			//1为模板2为用户
			isLook: {
				type: Number,
				default: 0
			},
			modelId: {
				type: Number,
				default: 0
			},
		},
		components: {
			model1,
			model2,
			model3,
			model4,
			model5
		},
		computed: {
			imageList() {
				try{
					let templateData = this.templateData;
					let arr = [];
					if(templateData.modelType==0){
						if(templateData.service_intro_imgs && templateData.service_intro_imgs.length > 0){
							arr = [...templateData.service_intro_imgs]
						}
						if (templateData.service_audit_imgs && templateData.service_audit_imgs.length > 0) {
							arr = arr.concat(templateData.service_audit_imgs)
						}
						if (templateData.service_imgs && templateData.service_imgs.length > 0) {
							arr = arr.concat(templateData.service_imgs)
						}
					}else if(templateData.modelType==1){
						arr = arr.concat(templateData.model_imgs)
					}
					
					
					return arr
				}catch(e){
					console.log(e,'eeee')
					return []
					//TODO handle the exception
				}
			}
		},
		methods: {
			openImage(item) {
				this.$nextTick(() => {
					this.$refs.previewImage.open(item);
				})
			},
			open() { //监听组件显示 （隐藏TabBar和NavigationBar，隐藏video原生组件）
				// uni.hideTabBar()
				// uni.setNavigationBarColor({
				//   frontColor: '#000000', // 设置前景色为黑色
				//   backgroundColor: '#000000', // 设置背景色为黑色
				// })
				// this.videoShow = false 
			},
			close() { //监听组件隐藏 （显示TabBar和NavigationBar，显示video原生组件）
				// uni.showTabBar()
				// uni.setNavigationBarColor({
				//   frontColor: '#ffffff', // 设置前景色为白色
				//   backgroundColor: '#000000', // 设置背景色为黑色
				// })
				// this.videoShow = true
			}
		},
		data() {
			return {
				model: 0
			}
		},
		onLoad() {
			uni.postMessage('打开页面')
		},
		onUnload() {
			uni.postMessage('关闭页面')
		}
	}
</script>