<template>
    <div class="pblm-detail-wrapper">
        <van-form @submit="onSubmit">
            <card01 style="margin-top: 0;" :title="pblm.name + ''" icon="label"
                :description="`工程地址：${pblm.location}<br/>问题类型：${listTypeConvert(pblm.listType)}`" />
            <div class="pblm-detail-label">
                <span>违规事项</span>
                <van-button size="mini" type="primary" @click="changeTacObjPblmstb()">选择违规事项</van-button>
            </div>
            <van-cell-group inset>
                <van-field v-model="tacObjPblmstb.pblmTypeDesc" label="问题类型" placeholder="问题类型" label-align="top"
                    rows="1" autosize type="textarea" readonly />
                <van-field v-model="tacObjPblmstb.pblmsDesc" label="违规事项" placeholder="违规事项" label-align="top" rows="2"
                    autosize type="textarea" readonly />
                <van-field v-model="tacObjPblmstb.relativeLaw" label="法规条款" placeholder="法规条款" label-align="top"
                    rows="2" autosize type="textarea" readonly />
                <van-field v-model="tacObjPblmstb.lawContent" label="法规内容" placeholder="法规内容" label-align="top" rows="2"
                    autosize type="textarea" readonly />
                <van-field v-model="pblm.note" label="备注" placeholder="备注" label-align="top" rows="2" autosize
                    type="textarea" />
            </van-cell-group>
            <div class="pblm-detail-label">问题描述</div>
            <van-cell-group inset>
                <van-field v-model="pblm.pblmNm" label="发现问题" placeholder="发现问题" label-align="top" rows="2" autosize
                    type="textarea" />
                <van-field v-model="pblm.pblmDesc" label="问题阐述" placeholder="问题阐述" label-align="top" rows="2" autosize
                    type="textarea" />
                <van-field v-model="pblm.pblmReason" label="主要原因分析" placeholder="主要原因分析" label-align="top" rows="2"
                    autosize type="textarea" />
                <van-field v-model="pblm.pblmSggtn" label="整改意见及建议" placeholder="整改意见及建议" label-align="top" rows="2"
                    autosize type="textarea" />
                <van-field v-model="pblm.spclRvwOptn" label="稽查组长复核意见" placeholder="稽查组长复核意见" label-align="top" rows="2"
                    autosize type="textarea" />
                <GwSelect02 label="问题严重性" :columns="cateObjList" v-model:value="pblm.pblmPasi"></GwSelect02>
                <van-field name="radio" label="是否典型问题">
                    <template #input>
                        <van-radio-group v-model="pblm.ifCasePblm" direction="horizontal">
                            <van-radio name="1">是</van-radio>
                            <van-radio name="0">否</van-radio>
                        </van-radio-group>
                    </template>
                </van-field>
                <van-field name="stepper" label="排序序号">
                    <template #input>
                        <van-stepper v-model="pblm.sn" />
                    </template>
                </van-field>
                <van-field name="uploader" label="文件上传">
                    <template #input>
                        <van-uploader v-model="gwComFileList" />
                    </template>
                </van-field>
            </van-cell-group>
            <div class="pblm-detail-label">责任主体</div>
            <van-cell-group inset>
                <div class="pblmSubjectList" v-for="item in pblm.pblmSubjectList" :key="item.id">
                    <GwSelect02 label="单位性质" :columns="objSubjectColumns" v-model:value="item.subId"></GwSelect02>
                    <van-field v-model="item.unitNm" label="单位名称" placeholder="单位名称" />
                </div>
                <van-button round plain hairline block>
                    <van-icon style="margin-right: 5px;" name="plus" color="#000" size="1rem" />
                    添加单位
                </van-button>
            </van-cell-group>
            <div style="margin: 16px;">
                <van-button round block type="primary" native-type="submit">
                    提交
                </van-button>
            </div>
        </van-form>

        <van-popup v-model:show="tacObjPblmstbShow" position="left" :style="{ width: '80%', height: '100%' }">

        </van-popup>
    </div>
</template>
<script setup>
import { onMounted, ref, computed, watch } from "vue";
import { useRoute } from "vue-router";
import card01 from '@/components/card01.vue';
import GwSelect02 from '@/components/GwSelect02.vue';
import { getTacQuestionById } from "@/api/inspect";
import { listTypeConvert } from "@/utils/convert"

const route = useRoute();
const pblm = ref({});
const tacObjPblmstb = computed(() => pblm.value.tacObjPblmstb || {});
const cateObjList = computed(() => tacObjPblmstb.value?.cateObjList?.map(i => { return { text: i.desc, value: i.cate } }) || []);
const objSubjectList = computed(() => pblm.value.tacObjPblmstb.objSubjectList || []);
const objSubjectColumns = computed(() => objSubjectList.value?.map(i => { return { text: i.subName, value: i.id } }) || []);
const gwComFileList = computed(() => pblm.value.gwComFileList?.map(i => process.env.VUE_APP_BASE_API + i.filePath) || []);

const tacObjPblmstbShow = ref(false);

function getQuestionData() {
    getTacQuestionById(route.params.id).then(res => {
        pblm.value = res.data
    })
}

/**
 * 选择违规事项
 */
function changeTacObjPblmstb() {
    console.log('changeTacObjPblmstb')
}


function onSubmit() {
    console.log(e)
}

onMounted(() => {
    getQuestionData();
})
</script>
<style lang="scss" scoped>
.pblm-detail-wrapper {
    height: 100%;
    padding: 10px 0;
    overflow: auto;

    .pblm-detail-label {
        padding: 10px 16px;
        color: #606266;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

}
</style>
<style lang="scss">
.van-cell-group--inset {
    margin: 0 10px;
}
</style>