<template>
    <view>
        <view class="flex align-center justify-between bottom-box">

            <view class="tab-box flex justify-center">
                <view class="flex flex-direction align-center justify-between tab-item" @tap="toBar('/pages/index/index')">
                    <image src="../../static/tabbar/tab_home_unselected.png" class="icon-img" v-if="bar!='index'"></image>
                    <image src="../../static/tabbar/tab_home_selected.png" class="icon-img" v-if="bar=='index'"></image>
                    <view :class="bar=='index'?'text-main':'color-33'">首页</view>
                </view>
            </view>

            <view class="tab-box flex justify-center">
                <view class="flex flex-direction align-center justify-between tab-item" @tap="toBar('/pages/application/application')">
                    <image src="../../static/tabbar/tab_server_unselected.png" class="icon-img" v-if="bar!='application'"></image>
                    <image src="../../static/tabbar/tab_server_selected.png" class="icon-img" v-if="bar=='application'"></image>
                    <view :class="bar=='application'?'text-main':'color-33'">全部服务</view>
                </view>
            </view>

            <view class="tab-box flex justify-center" >
                <view class="flex flex-direction align-center tab-item scan-box" @tap="sys()">
                    <image src="../../static/tab/scan.png" class="scan-img"></image>
                    <view class="scan-text color-33">扫一扫</view>
                </view>
            </view>

            <view class="tab-box flex justify-center">
                <view class="flex flex-direction align-center justify-between tab-item" @tap="toBar('/pages/data/dataMessage')">
                    <image src="../../static/tabbar/tab_order_unselected.png" class="icon-img" v-if="bar!='data'"></image>
                    <image src="../../static/tabbar/tab_order_selected.png" class="icon-img" v-if="bar=='data'"></image>
                    <view :class="bar=='data'?'text-main':'color-33'">订单</view>
                </view>
            </view>

            <view class="tab-box flex justify-center">
                <view class="flex flex-direction align-center justify-between tab-item" @tap="toBar('/pages/main/main')">
                    <image src="../../static/tabbar/tab_mine_unselected.png" class="icon-img" v-if="bar!='main'"></image>
                    <image src="../../static/tabbar/tab_mine_selected.png" class="icon-img" v-if="bar=='main'"></image>
                    <view :class="bar=='main'?'text-main':'color-33'">我的</view>
                </view>
            </view>
        </view>

        <u-modal v-model="showS" :show-title="false" :show-cancel-button="true" confirm-color='#fc6035' confirm-text="设置" cancel-text="取消" :content="contentS" @confirm="seting"></u-modal>

    </view>
</template>
<script>
    import permision from "@/js_sdk/wa-permission/permission.js";
    // #ifdef H5
    var jweixin = require("../../node_modules/jweixin-module/lib/index.js");
    // #endif



export default {
    components: {},
    props: {
        bar: {
            type: String,
            default: "index",
        },
    },
    data() {
        return {
            showS: false,
            contentS: "",
			appId: "",
			timestamp: 0,
			nonceStr: "",
			signature: "",
			jsApiList: []
        };
    },
    watch: {},
    beforeCreate() {
        if(this.$isH5) {
            let pageUrl = (window.location.href).split('#')[0] 
            this.$u.api.getticket({url:pageUrl}).then(res => {
                if (res.code == 200) {
                    this.appId = res.result.appid
                    this.timestamp = res.result.timestamp
                    this.nonceStr = res.result.nonceStr
                    this.signature = res.result.signature
                    this.jsApiList = [
                        'checkJsApi',
                        'scanQRCode'
                    ]
                    jweixin.config({
                        debug: false, // 是否开启调试模式
                        appId: this.appId, // 必填，公众号的唯一标识
                        timestamp: this.timestamp, // 必填，生成签名的时间戳
                        nonceStr: this.nonceStr, // 必填，生成签名的随机串
                        signature: this.signature, // 必填，签名，见附录1
                        jsApiList: this.jsApiList, // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
                    });
                    jweixin.error(function (err) {
                        console.log("错误信息:" + JSON.stringify(err))
                    });
                } else {
                    this.$api.msg("获取信息失败")
                }
            })
        }
		
    },
    mounted() {},
    methods: {
        sys() {
            // #ifdef H5
            this.wxsys();
            // #endif

            // #ifdef APP-PLUS
            this.getPermissionsState();
            // #endif
        },

        getPermissionsState() {
            const checkPermission = uni.requireNativePlugin("CL-Permission");
            let that = this;
            let cameraState = false;
            checkPermission.checkCamera((result) => {
                // console.log(result)
                if (result.code == 1) {
                    cameraState = true;
                } else {
                    cameraState = false;
                }
                if (cameraState) {
                    that.scanIt();
                } else {
                    that.contentS = "需要访问相机，请到设置里开启。";
                    that.showS = true;
                }
            });
        },
        seting() {
            permision.gotoAppPermissionSetting();
        },

        scanIt() {
            let that = this;
            uni.scanCode({
                onlyFromCamera: true,
                scanType: ["qrCode"],
                success: function (data) {
                    let code = that.$getQueryVariable(data.result, "code");
                    let assetsId = that.$getQueryVariable(
                        data.result,
                        "assetsId"
                    );
                    if (!that.$isNull(code)) {
                        uni.navigateTo({
                            url: "/pages/elevator/eleDetail?code=" + code,
                        });
                    } else if (!that.$isNull(assetsId)) {
                        that.$u.api
                            .getAssetsInfo({ id: assetsId })
                            .then((res) => {
                                if (res.code == 200 && res.result != null) {
                                    uni.setStorageSync(
                                        "assetsInfo",
                                        res.result
                                    );
                                    uni.navigateTo({
                                        url: "/pages/equipmentDetail/equipmentDetail",
                                    });
                                } else {
                                    that.$api.msg(
                                        "资产编号" +
                                            assetsId +
                                            "未获取到资产信息"
                                    );
                                }
                            })
                            .catch((err) => {
                                that.$api.msg("获取信息失败");
                            });
                    }
                },
            });
        },
        wxsys() {
            //公众号扫一扫
            let that = this;
            jweixin.scanQRCode({
                needResult: 1, // 默认为0，扫描结果由微信处理，1则直接返回扫描结果，
                desc: "scanQRCode desc",
                success: function (data) {
					var result = data.resultStr;
					let code = that.$getQueryVariable(result, "code");
					let assetsId = that.$getQueryVariable(
					    result,
					    "assetsId"
					);
					if (!that.$isNull(code)) {
					    uni.navigateTo({
					        url: "/pages/elevator/eleDetail?code=" + code,
					    });
					} else if (!that.$isNull(assetsId)) {
					    that.$u.api
					        .getAssetsInfo({ id: assetsId })
					        .then((res) => {
					            if (res.code == 200 && res.result != null) {
					                uni.setStorageSync(
					                    "assetsInfo",
					                    res.result
					                );
					                uni.navigateTo({
					                    url: "/pages/equipmentDetail/equipmentDetail",
					                });
					            } else {
					                that.$api.msg(
					                    "资产编号" +
					                        assetsId +
					                        "未获取到资产信息"
					                );
					            }
					        })
					        .catch((err) => {
					            that.$api.msg("获取信息失败");
					        });
					}
                },
                fail(err) {
					that.$api.msg("err");
                    console.log("点击扫描按钮err...", JSON.stringify(err));
                },
            });
        },

        toBar(url) {
            uni.reLaunch({
                url: url,
            });
        },
    },
};
</script>
<style lang='scss' scoped>
.icon-img {
    width: 40rpx;
    height: 40rpx;
}
.scan-box {
    z-index: 999;
    margin-top: -54rpx;
}
.scan-img {
    width: 86rpx;
    height: 86rpx;
}
.scan-text {
    margin-top: 8rpx;
    width: 100%;
    font-size: 22rpx;
    text-align: center;
}
.tab-box {
    height: 100rpx;
    padding: 10rpx 0;
    width: 33.33%;
}
.tab-item {
    width: 130rpx;
}

.bottom-box {
    font-size: 22rpx;
    height: 100rpx;
    background: #fff;
    z-index: 998;
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100vw;
    border-top: 2rpx solid #eee;
}
</style>
