<template>
    <view>
        <cu-custom bgColor="bg-gradual-blueness" :isBack="true">
            <block slot="backText">返回</block>
            <block slot="content">安全环保检查指派确认人</block>
        </cu-custom>
        <view class="form">
            <view class="wui-form-list">
                <view class="cu-form-group">
                    <text class="title">隐患描述</text>
                    <text class="text-semi">{{ form.HIDDENDESCR }}</text>
                </view>
                <view class="cu-form-group">
                    <text class="title">隐患部位</text>
                    <text class="text-semi">{{ form.hregionName?form.hregionName:form.HIDDENPART }}</text>
                </view>
                <view class="cu-form-group">
                    <text class="title">隐患级别</text>
                    <text class="text-semi">{{ form.HIDDENLEVELNAME }}</text>
                </view>
                <view class="cu-form-group">
                    <text class="title">隐患类型</text>
                    <text class="text-semi">{{form.HIDDENTYPENAME}}</text>
                </view>
                <view class="cu-form-group">
                    <text class="title">隐患照片</text>
                    <view class="de-sub-content">
                        <scroll-view scroll-x class="bg-white nav" scroll-with-animation>
                            <view class="cu-item" v-for="(item,index) in files" v-bind:key="index">
                                <view class="imgs" style="width: 80upx;height: 80upx;">
                                    <image :src="baseImgPath+'/'+item.FILEPATH" :data-index="index"
                                           @click="ViewShowImage" mode=""></image>
                                </view>
                            </view>
                        </scroll-view>
                    </view>
                </view>
                <view class="cu-form-group" v-if="hiddenVideo.length>0">
                    <text class="title">隐患视频</text>
                    <view class="de-sub-content" style="background-color: #000;width: 120upx;">
                        <image src="/static/icon-apps/video.png" mode="aspectFill" @click="playVideo"
                               :data-src="baseImgPath + hiddenVideo[0].FILEPATH"
                               style="width: 120upx;height: 120upx;"></image>
                    </view>
                </view>
                <view class="cu-form-group">
                    <text class="title">隐患发现人</text>
                    <text class="text-semi">{{form.CREATORNAME}}</text>
                </view>
                <view class="cu-form-group">
                    <text class="title">发现时间</text>
                    <text class="text-semi">{{form.CREATTIME}}</text>
                </view>
                <view class="cu-form-group">
                    <text class="title">是否相关方</text>
                    <text class="text-semi">{{form.ISRELEVANT =="1"?"是":"否"}}</text>
                </view>
                <view class="cu-form-group">
                    <text class="title">隐患上报位置</text>
                    <text class="text-semi">
                      经度:{{form.LATITUDE&&form.LATITUDE}}
                      纬度:{{form.LATITUDE&&form.LONGITUDE}}
                    </text>
                </view>
                <view class="cu-form-group">
                    <text class="title">隐患位置描述</text>
                    <text class="text-semi">{{ form.POSITIONDESC }}</text>
                </view>

                <view class="cu-form-group"  @click="seeHiddenConfirm=='2'?seeHiddenConfirm='1':seeHiddenConfirm='2'">
                    <text class="title">隐患确认信息</text>
                    <text class="text-semi">       <a>查看</a></text>
                </view>
            </view>
        </view>



        <div v-for="(item,index) in hiddenExamineList" :key="index" v-if="seeHiddenConfirm=='1'">
            <view class="de-card-list de-list" v-if="item.TYPE === 4 ||item.TYPE === 2||item.TYPE === 1  ">
                <div v-if="item.TYPE === 4">
                    <view class="de-title">
                        <text class="text-semi">隐患确认</text>
                    </view>
                    <view class="cu-form-group margin-top">
                        <view class="title">隐患级别</view>
                        <view class="picker-tree-box">
                            <view class="uni-flex-item text-right">
                                <text class="text-semi">{{item.editLevelName}}</text>
                            </view>
                        </view>
                    </view>
                    <view class="cu-form-group margin-top">
                        <view class="title">整改负责人</view>
                        <view class="picker-tree-box">
                            <view class="uni-flex-item text-right">
                                <text class="text-semi">{{item.editUserName}}</text>
                            </view>
                        </view>
                    </view>
                    <view class="cu-form-group margin-top">
                        <view class="title">整改完成期限</view>
                        <view class="picker-tree-box">
                            <view class="uni-flex-item text-right">
                                <text class="text-semi">{{item.spare3}}</text>
                            </view>
                        </view>
                    </view>
                    <view class="cu-form-group margin-top">
                        <view class="title">隐患确认人</view>
                        <view class="picker-tree-box">
                            <view class="uni-flex-item text-right">
                                <text class="text-semi">{{form.conUserName}}</text>
                            </view>
                        </view>
                    </view>
                    <view class="cu-form-group margin-top">
                        <view class="title">隐患确认时间</view>
                        <view class="picker-tree-box">
                            <view class="uni-flex-item text-right">
                                <text class="text-semi">{{form.CONFIRM_TIME}}</text>
                            </view>
                        </view>
                    </view>
                </div>
                <div v-if="item.TYPE === 2">
                    <view class="de-title">
                        <text class="text-semi">延期信息</text>
                    </view>
                    <view class="cu-form-group margin-top">
                        <view class="title">申请延期日期</view>
                        <view class="picker-tree-box">
                            <view class="uni-flex-item text-right">
                                <text class="text-semi">{{item.CREATTIME}}</text>
                            </view>
                        </view>
                    </view>
                    <view class="cu-form-group margin-top">
                        <view class="title">审核人</view>
                        <view class="picker-tree-box">
                            <view class="uni-flex-item text-right">
                                <text class="text-semi">{{pd.conUserName}}</text>
                            </view>
                        </view>
                    </view>
                    <view class="cu-form-group margin-top">
                        <view class="title">延期日期</view>
                        <view class="picker-tree-box">
                            <view class="uni-flex-item text-right">
                                <text class="text-semi">{{item.DELAY_TIME}}</text>
                            </view>
                        </view>
                    </view>
                    <view class="cu-form-group margin-top"  v-if="item.DISPOSAL_PLAN">
                        <view class="title">处置方案</view>
                        <view class="picker-tree-box">
                            <view class="uni-flex-item text-right">
                                <text class="text-semi">{{item.DISPOSAL_PLAN}}</text>
                            </view>
                        </view>
                    </view>
                    <view v-if="item.DISPOSAL_FILE" class="cu-form-group margin-top">
                        <view class="title">方案附件</view>
                        <view class="picker-tree-box">
                            <button class="cu-btn bg-blue" style="width: 160px" @click="downloadAppendix(item.DISPOSAL_FILE)">
                                下载
                            </button>
                        </view>
                    </view>
                    <view class="cu-form-group margin-top">
                        <view class="title">延期审核状态</view>
                        <view class="picker-tree-box">
                            <view class="uni-flex-item text-right">
                                <text class="text-semi" v-if="item.STATE===-1">待审核</text>
                                <text class="text-semi" v-if="item.STATE===1">通过</text>
                                <text class="text-semi" v-if="item.STATE===2">未通过</text>

                            </view>
                        </view>
                    </view>
                    <view class="cu-form-group margin-top" v-if="item.STATE!==-1">
                        <view class="title">审核时间</view>
                        <view class="picker-tree-box">
                            <view class="uni-flex-item text-right">
                                <text class="text-semi">{{item.OPERATTIME}}</text>
                            </view>
                        </view>
                    </view>
                </div>
                <div v-if="item.TYPE === 1 " >
                    <view class="de-title">
                        <text class="text-semi">特殊处理审核信息</text>
                    </view>
                    <view class="cu-form-group margin-top">
                        <view class="title">无法整改原因</view>
                        <view class="picker-tree-box">
                            <view class="uni-flex-item text-right">
                                <text class="text-semi">{{item.EXAMINE}}</text>
                            </view>
                        </view>
                    </view>
                    <view class="cu-form-group margin-top">
                        <view class="title">特殊处置审核状态</view>
                        <view class="picker-tree-box">
                            <view class="uni-flex-item text-right">
                                <text class="text-semi" v-if="item.STATE===-1">待审核</text>
                                <text class="text-semi" v-if="item.STATE===2">通过</text>
                                <text class="text-semi" v-if="item.STATE===1">未通过</text>

                            </view>
                        </view>
                    </view>
                    <view class="cu-form-group margin-top"  v-if="item.DISPOSAL_PLAN">
                        <view class="title">处置方案</view>
                        <view class="picker-tree-box">
                            <view class="uni-flex-item text-right">
                                <text class="text-semi">{{item.DISPOSAL_PLAN}}</text>
                            </view>
                        </view>
                    </view>
                    <view class="cu-form-group margin-top" v-if="item.DISPOSAL_FILE">
                        <view class="title">处置方案附件</view>
                        <view class="picker-tree-box">
                            <view class="uni-flex-item text-right">
                                <button class="cu-btn bg-blue" style="width: 160px" @click="downloadAppendix(item.DISPOSAL_FILE)">
                                    下载
                                </button>
                            </view>

                        </view>
                    </view>
                    <view class="cu-form-group margin-top" v-if="item.STATE!==-1">
                        <view class="title">审核时间</view>
                        <view class="picker-tree-box">
                            <view class="uni-flex-item text-right">
                                <text class="text-semi">{{item.OPERATTIME}}</text>
                            </view>
                        </view>
                    </view>
                    <view class="cu-form-group margin-top" v-if="item.STATE!==-1">
                        <view class="title">审核人</view>
                        <view class="picker-tree-box">
                            <view class="uni-flex-item text-right">
                                <text class="text-semi">{{pd.conUserName}}</text>
                            </view>
                        </view>
                    </view>
                    <view class="cu-form-group margin-top" v-if="item.STATE==2">
                        <view class="title">是否更换整改负责人</view>
                        <view class="picker-tree-box">
                            <view class="uni-flex-item text-right">
                                <text class="text-semi" v-if="item.spare1==='1'">是</text>
                                <text class="text-semi" v-else>否</text>
                            </view>
                        </view>
                    </view>
                    <view class="cu-form-group margin-top" v-if="item.spare1=='1'">
                        <view class="title">整改负责人</view>
                        <view class="picker-tree-box">
                            <view class="uni-flex-item text-right">
                                <text class="text-semi">{{item.NEWRECTIFICATIONOR}}</text>
                            </view>
                        </view>
                    </view>
                </div>
            </view>
        </div>

        <view class="form">
            <view class="wui-form-list" style="padding: 30upx 20upx;">
                <view v-if="HIDDEN_STATUS === '-2' || HIDDEN_STATUS === '0'" class="title1">
                    安全环保检查隐患指派确认人
                </view>
                <view class="cu-form-group margin-top">
                    <view class="title">隐患确认人</view>
                    <picker v-if="HIDDEN_STATUS === '-2'" @change="setConUser" :value="form.conUserIndex"
                            :range="confirmUserAllList" range-key="NAME">
                        <view class="picker">
                            {{form.conUserName?form.conUserName:'请选择'}}
                        </view>
                    </picker>
                    <text v-else class="text-semi">{{form.conUserName}}</text>
                </view>
            </view>
        </view>
        <view class="cu-bar btn-group" style="margin-top: 30upx;">
            <button v-if="HIDDEN_STATUS === '-2'" class="cu-btn bg-blue margin-tb-sm lg"
                    @click="$noMultipleClicks(submit)">保 存
            </button>
            <button v-else class="cu-btn bg-green margin-tb-sm lg" @click="$noMultipleClicks(goback)">返 回</button>
        </view>
        <view class="padding flex flex-direction"></view>
        <view :class="['cu-modal',{'show':modalShow}]" v-if="modalShow">
            <view class="cu-dialog">
                <view class="cu-bar bg-white justify-end">
                    <view class="content">播放视频</view>
                    <view class="action" @tap="modalShow = false">
                        <text class="cuIcon-close text-red"></text>
                    </view>
                </view>
                <video :src="videoSrc" :autoplay="true"></video>
                <view class="cu-bar bg-white justify-end">
                    <view class="action">
                        <button class="cu-btn line-green text-green" @click="modalShow = false">关闭</button>
                    </view>
                </view>
            </view>
        </view>
    </view>
</template>

<script>
    import {
        basePath, corpinfoId, deptId, loginUser, formatDate, loginSession, baseImgPath
    } from '@/common/tool.js';
    import tkiTree from "@/components/select-tree/select-tree.vue"
    import gcoord from '@/common/gcoord.js'
    import ruiDatePicker from '@/components/rattenking-dtpicker/rattenking-dtpicker.vue'
    import moreSelect from '@/components/more-select/more-select.vue';
    import uniPopup from '@/components/more-select/uni-popup/uni-popup.vue';
    import sign from '@/components/sign/sign.vue';

    export default {
        components: {
            tkiTree, ruiDatePicker, moreSelect, uniPopup, sign
        },
        data() {
            return {
                baseImgPath: baseImgPath,
                isUps: false,
                noClick: true,
                treeNode: [],//部门下拉数据
                INSPECTION_ID: '', // 检查ID
                HIDDEN_ID: '', // 检查ID
                HIDDEN_STATUS: '', // 检查ID
                form: {
                    HIDDENDESCR: '', // 隐患描述
                    CREATORNAME: '', // 隐患责任人
                    HIDDENLEVELNAME: '', // 隐患级别
                    DISCOVERYTIME: '', // 隐患发现时间
                    hregionName: '', // 隐患部位
                    HIDDENPART: '', // 隐患部位
                    HIDDENTYPENAME: '', // 隐患类型1
                    HIDDENTYPENAME2: '', // 隐患类型2
                    LONGITUDE: '', // 隐患坐标经度
                    LATITUDE: '', // 隐患坐标纬度
                    hiddenImgs: [], // 隐患图片
                    hiddenVideos: [], // 隐患视频

                    RECTIFICATIONTYPE: '2', // 隐患处置
                    conUserIndex: '',
                    CONFIRM_USER: '', // 隐患确认人
                    conUserName: '',
                    HIDDEN_ID: '',
                    POSITIONDESC: '',
                },// 数据
                files: [],
                hiddenVideo: [],
                confirmUserAllList: [], // 隐患确认人下拉数据
                videoSrc: '',
                todayDate: '',
                modalShow: false,
                seeHiddenConfirm: '2',
                hiddenExamineList:[]

            }
        },
        onLoad(event) {
            let now = new Date();
            var tomorrow = now.setDate(now.getDate() + 1);
            tomorrow = new Date(tomorrow);
            this.todayDate = formatDate(new Date(), 'yyyy-MM-dd hh:mm');
            this.INSPECTION_ID = event.INSPECTION_ID;
            this.HIDDEN_ID = event.HIDDEN_ID;
            this.HIDDEN_STATUS = event.HIDDEN_STATUS;
            this.getData();

            // 初始化现场作业负责人
            this.getDept()
            this.getDict()
            loginSession();

        },
        methods: {
            getData() {
                var _this = this;
                uni.showLoading({
                    title: '请稍候'
                })
                uni.request({
                    url: basePath + '/app/hidden/goEdit',
                    method: 'POST',
                    header: {
                        'Content-type': 'application/x-www-form-urlencoded'
                    },
                    data: {
                        HIDDEN_ID: _this.HIDDEN_ID,
                    },
                    success: (res) => {
                        if ("success" == res.data.result) {
                            uni.hideLoading();
                            _this.form = Object.assign(this.form, res.data.pd) //参数map
                            _this.files = res.data.hImgs;
                            _this.hiddenVideo = res.data.hiddenVideo
                            _this.hiddenExamineList = res.data.hiddenExa
                        } else if ("exception" == data.result) {
                            uni.showToast({
                                title: '错误',
                                duration: 2000
                            });
                        }
                    }
                });
            },
            ViewShowImage(e) {
                let files = [];
                for (var i = 0; i < this.files.length; i++) {
                    files.push(baseImgPath + '/' + this.files[i].FILEPATH)
                }
                uni.previewImage({
                    urls: files,
                    current: e.currentTarget.dataset.index
                });
            },
            playVideo(e) {
                this.videoSrc = e.currentTarget.dataset.src
                this.modalShow = true
            },
            setConUser(e) {
                this.form.conUserIndex = e.detail.value;
                this.form.CONFIRM_USER = this.confirmUserAllList[e.detail.value].USER_ID;
                this.form.conUserName = this.confirmUserAllList[e.detail.value].NAME;
                this.$forceUpdate();//强制刷新
            },
            submit() {
                var _this = this;
                let required = true
                uni.showLoading({
                    title: '数据保存中'
                })
                if(_this.form.CONFIRM_USER == ""){
                    uni.showToast({
                        icon: 'none',
                        title: '请选择确认人',
                        duration: 1500
                    });
                    required = false
                }
                if (!required) {
                    return
                }
                uni.request({
                    url: basePath + '/app/hidden/assign',
                    method: 'POST',
                    dataType: 'json',
                    header: {
                        'Content-type': 'application/x-www-form-urlencoded'
                    },
                    data: {
                        ..._this.form,
                        OPERATOR: loginUser.USER_ID,
                        NAME: loginUser.NAME,
                        CORPINFO_ID: corpinfoId,
                        HIDDEN_STATUS: this.HIDDEN_STATUS,
                        INSPECTION_ID: this.INSPECTION_ID,
                        HIDDENDESCR: this.form.HIDDENDESCR
                    },
                    success: (res) => {
                        if ("success" == res.data.result) {
                            uni.hideLoading();
                            _this.goback()
                        } else {
                            uni.showToast({
                                title: res.data.msaesge,
                                duration: 2000
                            });
                        }
                    }
                });
            },

            getDept() {
                var _this = this;
                uni.request({
                    url: basePath + '/app/sys/listTree',//部门下拉接口
                    method: 'POST',
                    dataType: 'json',
                    header: {
                        'Content-type': 'application/x-www-form-urlencoded'
                    },
                    data: {
                        CORPINFO_ID: corpinfoId,
                    },
                    success: (res) => {
                        if ("success" == res.data.result) {
                            _this.treeNode = eval(res.data.zTreeNodes);
                        } else {
                            uni.showToast({
                                title: res.data.message,
                                duration: 2000
                            });
                        }
                    }
                });
            },

            //获取人员列表
            getUserList(list, dept, i) {
                //发送 post 请求
                var _this = this
                uni.request({
                    method: 'POST',
                    dataType: 'json',
                    header: {
                        'Content-type': 'application/x-www-form-urlencoded'
                    },
                    url: basePath + '/app/sys/listUser',
                    data: {DEPARTMENT_ID: dept, NOMAIN: '1', tm: new Date().getTime()},
                    success: function (res) {
                        if ("success" == res.data.result) {
                            if (i > -1) {
                                _this[list][i] = [];
                                _this[list][i] = res.data.userList;
                                _this.$forceUpdate();//强制刷新
                            } else {
                                _this[list] = res.data.userList;
                            }
                        } else {
                            uni.showToast({
                                title: res.data.message,
                                duration: 2000
                            });
                        }
                    }
                })
            },
            //获取数据字典数据
            getDict() {
                var _this = this;

                uni.request({
                    method: 'POST',
                    dataType: 'json',
                    header: {
                        'Content-type': 'application/x-www-form-urlencoded'
                    },
                    url: basePath + '/app/user/getHiddenConfirm',
                    data: {
                        corpinfoId: corpinfoId,
                        IS_HAZARDCONFIRMER: '1',
                        tm: new Date().getTime()
                    },
                    success: function (res) {
                        if ("success" == res.data.result) {
                            _this.confirmUserAllList = res.data.userList;
                            _this.$forceUpdate();//强制刷新
                        } else {
                            uni.showToast({
                                title: res.data.message,
                                duration: 2000
                            });
                        }
                    }
                })
            },

            goback() {
                var pages = getCurrentPages();	// 获取当前页面栈
                var prePage = pages[pages.length - 2];	// 上二级页面
                prePage.$vm.initflag = true;    // A 页面 init方法 为true
                uni.navigateBack({delta: 1});
                uni.hideLoading();
            },

            resetHd() {
                this.hiddenForm = {
                    HIDDEN_ID: '', // 隐患ID
                    HIDDENDESCR: '', // 隐患描述
                    HIDDENPART: '', // 隐患部位
                    HIDDENPART_NAME: '',
                    HIDDENLEVEL: '', // 隐患级别
                    HIDDENLEVEL_NAME: '',
                    HIDDENTYPE: '', // 隐患类型1
                    HIDDENTYPE_NAME: '',
                    HIDDENTYPE2: '', // 隐患类型2
                    HIDDENTYPE2_NAME: '',
                    LONGITUDE: '', // 隐患位置经度
                    LATITUDE: '', // 隐患位置纬度
                    DISCOVERYTIME: '', // 隐患发现时间
                    HIDDENFINDDEPT: '', // 隐患发现部门(隐患责任人部门)
                    HIDDENFINDDEPT_NAME: '',
                    CREATOR: '', // 发现人(隐患责任人)
                    CREATOR_INDEX: '',
                    CREATOR_NAME: '',
                    SOURCE: '5', // 隐患描述
                    hiddenImgs: [],
                    hiddenVideos: []
                }
            },
          downloadAppendix(DISPOSAL_FILE) {
            plus.runtime.openURL(this.baseImgPath + DISPOSAL_FILE, function (res) {
              console.log(res);
            });
          },
        }
    }
</script>

<style>
    .title1 {
        font-weight: bold;
        padding-left: 10 upx;
        border-left: 4px solid #0081FF;
    }

    .imgs {
        width: 80 upx !important;
        height: 80 upx !important;
    }
</style>