<template>
<div class="wrapper editwrap">
    <el-dialog :visible.sync="dialogVisible" title="企业审核" :show-close="false" :close-on-click-modal="false">
        <div class="enterDetail">
            <h3>*企业注册信息*</h3>
            <div class="enterDetail-item">
                <span class="itit">单位名称必填：</span>
                {{editForm.unitName}}
            </div>
            <div class="enterDetail-item">
                <span class="itit">统一社会信用代码：</span>
                {{editForm.orgCode}}
            </div>
            <div class="enterDetail-item">
                <span class="itit">法定代表人：</span>
                {{editForm.legalPerson}}
            </div>
            <div class="enterDetail-item">
                <span class="itit">法人邮箱：</span>
                {{editForm.legalPersonEmail}}
            </div>
            <div class="enterDetail-item">
                <span class="itit">所属区域：</span>
                <City :valueqv="cityval" :disabled="true"></City>
            </div>
            <div class="enterDetail-item">
                <span class="itit">所属街道：</span>
                {{editForm.streetName}}
            </div>
            <div class="enterDetail-item">
                <span class="itit">单位注册地址：</span>
                {{editForm.regAddress}}
            </div>
            <div class="enterDetail-item">
                <span class="itit">生产经营地址：</span>
                {{editForm.runAddress}}
            </div>
            <div class="enterDetail-item">
                <span class="itit">法人手机：</span>
                {{editForm.legalPersonPhone}}
            </div>
            <div class="enterDetail-item">
                <span class="itit">营业执照：</span>
                <span class="dbtn sd qiCr" v-if="editForm.viewOrgFilePath" @click="checkFile(editForm.viewOrgFilePath)">
                    <i class="el-icon el-icon-view"></i>查看
                </span>
            </div>
            <div class="enterDetail-item">
                <span class="itit">授权书：</span>
                <span class="dbtn sd qiCr" v-if="editForm.viewAuthorizeFile" @click="checkFile(editForm.viewAuthorizeFile)">
                    <i class="el-icon el-icon-view"></i>查看
                </span>
            </div>
            <div class="enterDetail-item">
                <span class="itit">管理员姓名：</span>
                {{editForm.userName}}
            </div>
            <div class="enterDetail-item">
                <span class="itit">管理员身份证：</span>
                {{editForm.idCard}}
            </div>
            <div class="enterDetail-item">
                <span class="itit">管理员Email：</span>
                {{editForm.email}}
            </div>
            <div class="enterDetail-item">
                <span class="itit">管理员手机：</span>
                {{editForm.mobliePhone}}
            </div>
            <div class="enterDetail-item">
                <span class="itit">管理员账号：</span>
                {{editForm.account}}
            </div>
        </div>
        <el-form ref="editForm" :model="editForm" :rules="rules" label-width="110px" v-if="editFormA.accountStatus != 1">
            <el-form-item style="padding-top: 10px;" label="企业账号状态" prop="accountStatus">
                <el-radio-group v-model="editForm.accountStatus" @change="radioChange">
                    <el-radio :label="'0'">审核通过</el-radio>
                    <el-radio :label="'4'">审核不通过</el-radio>
                </el-radio-group>
            </el-form-item>
            <el-form-item label="备注" prop="remarks">
                <el-input type="textarea" v-model.number="editForm.remarks"></el-input>
            </el-form-item>
            <el-form-item label="经度" prop="longitude">
                <el-row>
                    <el-col :span="16">
                        <el-input v-model.number="editForm.longitude"></el-input>
                    </el-col>
                    <el-col :span="8">
                        <el-button type="primary" plain @click="MapdialogFun">选择经纬度</el-button>
                    </el-col>
                </el-row>
            </el-form-item>
            <el-form-item label="纬度" prop="latitude">
                <el-input v-model="editForm.latitude"></el-input>
            </el-form-item>
            <el-form-item label="绘制厂区边界">
                <el-button type="primary" plain @click="MapdialogBFun">绘制</el-button> <span :class="editForm.boundary ? 'colorM' : 'colorR'">{{editForm.boundary ? '已绘制' : '未绘制'}}</span>
            </el-form-item>
        </el-form>
        <span slot="footer" class="dialog-footer">
            <el-button type="primary" size="small" @click="confirmFun('editForm')" v-if="editFormA.accountStatus != 1">确定</el-button>
            <el-button @click="$emit('dialogFun')" size="small">取消</el-button>
        </span>
    </el-dialog>
    <Mapdialog v-if="loadmap" :dialogTableVisible="dialogTableVisible" @dialogcancelFun="dialogcancelFun" :slat="editForm.latitude" :slng="editForm.longitude" @confirm="qrFun" />
    <DrawBounds v-if="loadmapB" :boundary="editForm.boundary" :dialogTableVisible="dialogTableVisibleB" @dialogcancelFunB="dialogcancelFunB" @drawconfirm="qrDrawFun" />
</div>
</template>

<script lang="ts">
import {
    Component,
    Vue,
    Provide,
    Prop,
    Watch
} from "vue-property-decorator";
import {
    State,
    Getter,
    Mutation,
    Action
} from "vuex-class";
import Mapdialog from "@/components/maplnglat.vue";
import DrawBounds from "@/components/drawbounds.vue";
import METHOD from "@/utils/methods";
import City from "@/components/city.vue";

@Component({
    components: {
        Mapdialog,
        City,
        DrawBounds
    }
})
export default class EnterprisesMgEdit extends Vue {
    //属性或参数中使用!:表示强制解析（告诉typescript编译器，这里一定有值），常用于vue-decorator中的@Prop
    @Prop(Boolean) dialogVisible!: Boolean;
    @Prop(Object) editFormA!: {
        enterpriseId: String;
    };

    @Provide() editForm: any = {};
    @Provide() qvvalue: any = []; //区域值
    @Provide() signsArr: any = []; //图例list
    @Provide() dialogTableVisible: Boolean = false;
    @Provide() rules: any = {
        accountStatus: [{
            required: true,
            trigger: "blur",
            message: "该项为必填项！"
        }],
        remarks: [{
            required: true,
            trigger: "blur",
            message: "该项为必填项！"
        }]
    };
    @Provide() loadmap: Boolean = false;
    @Provide() cityval: any = [];

    @Provide() loadmapB: Boolean = false;
    @Provide() dialogTableVisibleB: Boolean = false;
    MapdialogBFun() {
        this.loadmapB = true;
        this.dialogTableVisibleB = true;
    }
    dialogcancelFunB() {
        this.dialogTableVisibleB = false;
        this.loadmapB = false;
    }
    //确认边界绘制
    qrDrawFun(mapview: any) {
        this.editForm.boundary = mapview;
    }

    qrFun(v: any) {
        //确认选择经纬度
        this.editForm.longitude = v.lng;
        this.editForm.latitude = v.lat;
    }
    MapdialogFun() {
        this.loadmap = true;
        this.dialogTableVisible = true;
    }
    dialogcancelFun() {
        this.loadmap = false;
        this.dialogTableVisible = false;
    }
    //取消事件要在父级取消是所以用到 $emit
    confirmFun(formName: string) {
        let that = this,
            params = that.editForm;
        (that as any).$refs[formName].validate((valid: boolean) => {
            if (valid) {
                METHOD.axiosPost(
                    that,
                    `/enterpriseInfo/updateEnterpriseCheckStatusById/${that.editForm.enterpriseId}`, {
                        accountStatus: that.editForm.accountStatus,
                        latitude: that.editForm.latitude,
                        longitude: that.editForm.longitude,
                        remarks: that.editForm.remarks,
                        boundary: that.editForm.boundary
                    },
                    function (res: any) {
                        if (res.code == 0) {
                            (that as any).$emit("dialogFun");
                            (that as any).$message({
                                message: "操作成功！",
                                type: "success"
                            });
                            that.$emit("refreshTableData"); //刷新表格
                        }
                    }
                );
            } else {
                return false;
            }
        });
    }
    getDetail() {
        let that = this;
        METHOD.axiosGet(
            that,
            `/enterpriseInfo/queryEnterpriseInfoById/${that.editFormA.enterpriseId}`,
            function (res: any) {
                if (res.code == 0) {
                    that.editForm = res.data;
                    if (that.editForm.provinceId) {
                        that.cityval = [
                            that.editForm.provinceId,
                            that.editForm.cityId,
                            that.editForm.countyId
                        ];
                    }
                }
            }
        );
    }
    checkFile(url: any) {
        window.open(METHOD.URL + url, "_blank");
    }
    radioChange(v: any) {
        if (v == 0) {
            this.rules = {
                accountStatus: [{
                    required: true,
                    trigger: "blur",
                    message: "该项为必填项！"
                }],
                longitude: [{
                    required: true,
                    trigger: "blur,change",
                    message: "该项为必填项！"
                }],
                latitude: [{
                    required: true,
                    trigger: "blur,change",
                    message: "该项为必填项！"
                }],
            }
        }
        if (v == 4) {
            this.rules = {
                accountStatus: [{
                    required: true,
                    trigger: "blur",
                    message: "该项为必填项！"
                }],
                remarks: [{
                    required: true,
                    trigger: "blur",
                    message: "该项为必填项！"
                }]
            }
        }
    }
    created() {
        this.getDetail();
    }
}
</script>

<style lang="scss">
@import "@/utils/public.scss";
</style>
