<template>
  <view class="app-content" style="background: #fff;">
    <view class="header_logo">
      <image :src="`${constant.imgUrl}/ghs/home_page/logo.png`" mode="widthFix"></image>

					<view class="header_logo-more">
						<view @click="register()" class="free_register" v-if="getLoginInfo.openShop == 1">免费注册</view>
						<view v-if="getLoginInfo.openShop != 1" class="free_register">已申请</view>
					</view>


    </view>
    <view class="main">
      <view class="banner_box">
        <image class="banner" :src="`${constant.imgUrl}/ghs/home_page/banner.png`"></image>
        <view v-if="getLoginInfo.openShop == 1" @click="register()">立即申请</view>
        <div v-if="getLoginInfo.openShop != 1">已申请</div>
      </view>
      <image class="pic1" :src="`${constant.imgUrl}/ghs/home_page/pic01.png`"></image>
      <view class="intro">
        <view v-for="(item, index) in list1" :key="index">
          <view style="margin-bottom: 10upx">{{item.title}}</view>
          <view style="margin-bottom: 10upx">{{item.text}}</view>
          <image :src="item.imgUrl"></image>
        </view>
      </view>
      <view class="finance">花店进销存与财务</view>
      <view class="finance1">解决方案专家</view>
      <image v-for="(item, index) in list2" :key="index" :src="item.imgUrl"  class="imgIntro"></image>
      <view class="finance2">他们都在用</view>
      <app-swiper :height="{type: 'number',val: 400}" :list="swiper" :width="{type: 'string',val: '95%'}"/>
    </view>
    <view class="footer_bar">
      <view class="relation">联系我们</view>
      <view class="free" @click="register()" v-if="getLoginInfo.openShop == 1">免费试用</view>
      <div v-if="getLoginInfo.openShop != 1" class="free">已申请</div>
    </view>
  </view>
</template>

<script>
import store from '@/store'
import AppSwiper from "@/components/app-swiper";
import AppImg from "@/components/app-img";
import { applyStatus } from "@/api/official";
import { share } from "@/mixins";
import { postWxCode,getDictionaries } from '@/api/mini'
import { getUser } from '@/utils/auth'
import {mapActions, mapGetters} from "vuex";
import util from "../../utils/util";
export default {
  components: {
    AppSwiper,
  },
  mixins: [share],
  data() {
    return {
      constant: this.$constant,
      list1: [
        {
          title: '免费试用',
          text: '免年费',
          imgUrl: `${this.$constant.imgUrl}/ghs/home_page/icon1.png`
        },
        {
          title: '手机、电脑',
          text: '全面支持',
          imgUrl: `${this.$constant.imgUrl}/ghs/home_page/icon2.png`
        },
        {
          title: '不限员工数',
          text: '不限门店数',
          imgUrl: `${this.$constant.imgUrl}/ghs/home_page/icon3.png`
        }
      ],
      list2: [
        {
          imgUrl: `${this.$constant.imgUrl}/ghs/home_page/pic02.png`
        },
        {
          imgUrl: `${this.$constant.imgUrl}/ghs/home_page/pic03.png`
        },
        {
          imgUrl: `${this.$constant.imgUrl}/ghs/home_page/pic04.png`
        },
        {
          imgUrl: `${this.$constant.imgUrl}/ghs/home_page/pic05.png`
        },
        {
          imgUrl: `${this.$constant.imgUrl}/ghs/home_page/pic06.png`
        },
        {
          imgUrl: `${this.$constant.imgUrl}/ghs/home_page/pic07.png`
        },
        {
          imgUrl: `${this.$constant.imgUrl}/ghs/home_page/pic08.png`
        }
      ],
      swiper: [
        {
          img: `${this.$constant.imgUrl}/ghs/case/5.jpg`,
          name:'纯彩花艺'
        },
        {
          img: `${this.$constant.imgUrl}/ghs/case/6.jpg`,
          name:'旺鹭花行'
        },
        {
          img: `${this.$constant.imgUrl}/ghs/case/7.jpg`,
          name:'莱漫花行'
        },
        {
          img: `${this.$constant.imgUrl}/ghs/case/8.jpg`,
          name:'好多花'
        }
      ],
    }
  },
  computed: {
		...mapGetters(["getLoginInfo"])
	},
  onLoad() {
    this.jweixinFn({
      title: "更懂您的花卉宝",
      pagePath: "pagesClient/official/index",
      imageUrl: ""
    });
  },
  onShow() {
    // 隐藏返回首页按钮。
    // uni.hideHomeButton()
  },
  onShareAppMessage(res) {
    
    //查看分享的路径，不要删除 shish 20210517
    console.log("pagesClient/official/index?ghsShopAdminId="+this.getLoginInfo.shopAdminId+"&hdShopAdminId="+this.option.hdShopAdminId)

    return {
      title: "更懂您的销花宝",
      desc: "",
      imgUrl: "",
      path: "pagesClient/official/index?ghsShopAdminId="+this.getLoginInfo.shopAdminId+"&hdShopAdminId="+this.option.hdShopAdminId,
    }
	},
  methods: {
			...mapActions(['setUserShopAll']),
			register(){
					this.$util.pageTo({
						url: '/pagesClient/official/pay',
						query: {
							...this.option
						},
						type: 2
					})
    },
			experienceFun(){
				/**姜枫 2021.04.30  小程序审核体验账号**/
				postWxCode().then(subRes => {
					if (util.isEmpty(subRes)) {
						return false
					}
					uni.setStorageSync('token', subRes.data.token)
					uni.setStorageSync('shopId', subRes.data.admin.currentShopId)
					getDictionaries({ token: subRes.data.token }).then(res => {
						if (util.isEmpty(res)) {
							return false
						}
						store.commit('setDictionariesInfo', {
							...res.data.dict,
							...res.data
						})
						store.commit('setMyShopInfo', {
							...res.data.shop,
							...res.data
						})
					})
					store.commit('setLoginInfo', {
						...subRes.data.admin,
						...subRes.data
					})

					//启动更新逻辑 shish 2020.5.18
					if (subRes.data.update == 1) {
						const updateManager = wx.getUpdateManager()
						updateManager.onCheckForUpdate(function (res) {
							// 请求完新版本信息的回调
							console.log(res.hasUpdate)
						})
						updateManager.onUpdateReady(function () {
							wx.showModal({
								title: '更新提示',
								content: '新版本已经准备好，是否重启应用？',
								success(res) {
									if (res.confirm) {
										// 新的版本已经下载好，调用 applyUpdate 应用新版本并重启
										updateManager.applyUpdate()
									}
								}
							})
						})
						updateManager.onUpdateFailed(function () {})// 新版本下载失败
						return true;
					}
					getUser(true);
					this.setUserShopAll();
					uni.switchTab({url:'/admin/home/workbench'})
				})
			},
  },
  onLoad() {
    this.jweixinFn({
      title: "更懂您的花卉宝",
      pagePath: "pagesClient/official/index",
      imageUrl: ""
    });
    console.log(' this.getLoginInfo.shopId',this.getLoginInfo)
  },
  computed: {
    ...mapGetters(["getLoginInfo"])
  },
  onLoad() {
    console.log(this.getLoginInfo)
  }
}
</script>

<style lang="scss" scoped>
.experience{
	//height: 60rpx;
	padding: 0 30rpx;
	color: #3385FF;
}
.header_logo{
  position: fixed;
  top: 0;
  left: 0;
  height: 100upx;
  width: 100vw;
  background-color: #fff;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 30upx;
  box-sizing: border-box;
  &>image{
    width: 190upx;
    height: 49upx;
    // background-color: #eee;
  }
	.header_logo-more{
		display: flex;
		align-items: center;
		.free_register{
			width: 200upx;
			height: 60pux;
			line-height: 60upx;
			background: linear-gradient(90deg, #3385FF, #33B0FF);
			border-radius: 30upx;
			text-align: center;
			font-size: 32px;
			color: #FFFFFF;
		}
	}

}
.main{
  padding: 100upx 0 130upx;
  // padding-bottom: 30upx;
  &>.banner_box{
    width: 100vw;
    height: 750upx;
    position: relative;
    &>image{
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: #eee;
      z-index: 1;
    }
    &>view{
      position: absolute;
      bottom: 170upx;
      left: 50%;
      z-index: 2;
      transform: translateX(-50%);
      width: 376px;
      height: 90px;
      line-height: 90upx;
      text-align: center;
      font-size: 38upx;
      color: #FFFFFF;
      background: linear-gradient(90deg, #3385FF, #33B0FF);
      border-radius: 45px;
    }
  }
  &>.pic1{
    width: 100vw;
    height: 400upx;
    background-color: #eee;
    margin-top: 50upx;
  }
  &>.intro{
    height: 258upx;
    width: 100vw;
    background-color: #eaf7ff;
    margin-top: 50upx;
    margin-bottom: 50upx;
    display: flex;
    justify-content: space-between;
    padding: 30upx 60upx 20upx;
    &>view{
      width: 124upx;
      height: 100%;
      // background-color: green;
      text-align: center;
      text-align: center;
      color: #3385FF;
      &>image{
        width: 100%;
        height: 141upx;
      }
    }
  }
  &>.finance{
    text-align: center;
    margin: 70upx 0 20upx;
    font-size: 56px;
    font-weight: 600;
    color: #333333;
  }
  &>.finance1{
    text-align: center;
    margin-bottom: 60upx;
    font-size: 56px;
    font-weight: 600;
    color: #333333;
  }
  &>.finance2{
    text-align: center;
    margin: 30upx 0 40upx;
    font-size: 56px;
    font-weight: 600;
    color: #333333;
  }
  &>.imgIntro{
    width: 100vw;
    height: 560upx;
    background-color: #eee;
    margin-bottom: 30upx;
  }
}
.footer_bar{
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100vw;
  height: 100upx;
  line-height: 100upx;
  display: flex;
  justify-content: space-between;
  &>view{
    width: 50%;
    height: 100%;
    text-align: center;
    font-size: 36px;
    font-weight: 600;
    color: #FFFFFF;
  }
  &>.free{
    background: linear-gradient(90deg, #FFB73A, #FF8533);
  }
  &>.relation{
    background: linear-gradient(90deg, #3AB7FF, #3385FF);
  }
}
</style>
