<template>
	<view class="whole" v-if="!loading">
		<view class="tit">{{title}}</view>
		<view class="txt"><text :user-select="true">{{desc}}</text></view>
	</view>
</template>

<script>
	import { ref, reactive, toRefs } from 'vue'
	import { get } from '@/api/request.js'
	
	export default {
		setup() {
			const data = reactive({
				loading: true,
				title: '',
				desc: '',
				Color: uni.getStorageSync('theme_color')
			})
			
			function getShopInfo() {
				get('/api/v1/shop').then((res) => {
					data.title = res.data.extendInfo.technical_support_title
					data.desc = res.data.extendInfo.technical_support_more
					data.loading = false
				})
			}
			
			return {
				...toRefs(data),
				getShopInfo
			}
		}, 
		onLoad() {
			this.getShopInfo()
		}
	}
</script>

<style lang="scss" scoped>
	.whole{
		width: 100%;
		height: 100vh;
		padding: 30rpx;
		box-sizing: border-box;
		.tit{
			font-size: 40rpx;
			text-align: center;
			color: v-bind('Color');
			font-weight: 600;
		}
		.txt{
			font-size: 28rpx;
			line-height: 50rpx;
			margin-top: 30rpx;
			color: #666;
		}
	}
</style>