<template>
  <div style="height: 100%; padding: 10px 0">
    <div class="xcdc">
      <!-- <div class="xcdcJC">纠错</div> -->
      <div class="title">
        <span class="titleLeft"></span> {{ formObj.nm }}
      </div>
      <!-- <div class="xcdcCity">行政区化：{{ data.adFullName }}</div> -->
      <van-field
        v-model="formObj.objType"
        is-link
        readonly
        label="对象类型"
        placeholder="选择对象"
        @click="showPicker = true"
      />
      <van-popup v-model:show="showPicker" destroy-on-close round position="bottom">
        <van-picker
          :columns="columns"
          @cancel="showPicker = false"
          @confirm="onConfirm"
        />
      </van-popup>
      <van-field v-model="formObj.code" readonly placeholder="请输入对象编码" label="对象编码" />
      <!-- <van-field v-model="formObj.adCode" readonly label="行政区划编码" placeholder="请输入行政区划编码"/>
      <van-field v-model="formObj.adName" readonly label="行政区划名称" placeholder="请输入行政区划名称"/> -->
      <van-field v-model="formObj.loc" readonly label="地址" placeholder="请输入地址"/>
      <!-- <van-field v-model="formObj.note" readonly label="备注" placeholder="请输入备注"/>
      <van-field v-model="formObj.centerX" readonly label="经度" placeholder="请输入经度"/>
      <van-field v-model="formObj.centerY" readonly label="纬度" placeholder="请输入纬度"/> -->
      <!-- <div class="xcdcLxr">
        <div class="lxrItem">联系人：-</div>
        <div class="lxrItem">联系人电话：-</div>
      </div>
      <div class="xcdcTJ">是否符合申请条件：符合</div> -->
    </div>
    <van-button
      plain
      size="small"
      @click="jumpPageToadd"
      style="margin: 5px 2% 0 2%; width: 96%"
    >
      <van-icon color="#000" name="plus" size="1rem" />
      新增问题
    </van-button>
    <card01 v-for="pblm in pblmList" :key="pblm.pblmId" :title="pblm.inspPblmDesc" icon="question"
            @click="jumpPage(`/problemDc/${pblm.objId}`, { object: JSON.stringify(pblm) })">
      <template #right>
        <van-icon color="#000" name="delete-o" size="1rem" @click.stop="deletePblm(pblm.pblmId)"/>
      </template>
    </card01>
    <div style="display: flex">
      <van-button
        style="margin: 15px auto; padding: 0 100px"
        size="small"
        type="primary"
        @click="save128"
        >提交</van-button
      >
    </div>
    <van-dialog v-model:show="showWhy" title="确认删除" show-cancel-button  @confirm="onConfirmDelete">
      <van-field v-model="reason" placeholder="请输入" label="删除原因" />
    </van-dialog>
  </div>
</template>
<script setup>
import card01 from '@/components/card01.vue';
import { onMounted, ref ,computed  } from "vue";
import { useRoute } from "vue-router";
import { jumpPage } from "@/utils/page";
import request from "@/utils/request";
import { showSuccessToast,showFailToast  } from 'vant';
const router = useRoute();
function xcglFn(val) {
  jumpPage(`/xcgl/${val}`);
}
const reason = ref('')
const showWhy = ref(false);
const showPicker = ref(false);
const data = ref({});
const pblmList = ref([]);
const pblmId1 = ref('');
const formObj = ref({
  objectType: '',
  code: '',
  adCode: '',
  adName: '',
  loc: '',
  note: '',
  centerX: '',
  centerY: ''
});
const columns = ref([
    {
      text: "小水库",
      value: "小水库"
    },
    {
      text: "大中型水库",
      value: "大中型水库"
    },
    {
      text: "在建水利工程",
      value: "在建水利工程"
    },
    {
      text: "水闸工程",
      value: "水闸工程"
    },
    {
      text: "堤防工程",
      value: "堤防工程"
    },
    {
      text: "小水电站",
      value: "小水电站"
    },
    {
      text: "水利工程设施水毁修复",
      value: "水利工程设施水毁修复"
    },
    {
      text: "山洪灾害监测预警",
      value: "山洪灾害监测预警"
    },
    {
      text: "水旱灾害防御",
      value: "水旱灾害防御"
    },
    {
      text: "在建涉河建设项目和“清四乱”",
      value: "在建涉河建设项目和“清四乱”"
    },
    {
      text: "水利风景区",
      value: "水利风景区"
    },

  ]);
function jumpPageToadd() {
  var par = JSON.parse(router.query.object);
  formObj.value.objId = par.objId
  console.log(formObj.value);
  jumpPage(`/addProblem/${formObj.value.objId}`, { object: JSON.stringify(formObj.value) });
}
async function onConfirmDelete() {
  if(reason.value === ''){
    showFailToast('请输入删除原因!');
    showWhy.value = true;
    reason.value = '';
  }
  else{
    // 刷新问题列表
    var problemForm = {
      pblmDelPersnm: localStorage.getItem('account'),
      pblmDelPers: localStorage.getItem('userid'),
      date1: new Date(),
      pblmDelNote: reason.value,
      pblmId: pblmId1.value,
    }
    console.log(problemForm);
    await request.post(`/dc/insp/pblm/insertPblmLog`, problemForm).then(res => {
        if (res.success) {
          request.get(`/dc/insp/pblm/delete/${problemForm.pblmId}/${problemForm.pblmDelPers}`).then(res=>{
            if(res.success){
              showWhy.value = false;
              showSuccessToast('删除成功!');
            }
          })

        }
    })
    getData();
  }
}
function onConfirm(selectedValues, selectedOptions) {
  formObj.value.objectType = selectedValues.selectedValues[0]
  showPicker.value = false;
}
function save128(){
  let data = {
    rgstrId: formObj.value.rgstrId,
    state: '2',
  }
  request.post('/bis/insp/genrl/update', data).then((res) => {
    if (res.success) {
      showSuccessToast('保存成功!');
    }
  });
}

function deletePblm(pblmId) {
  pblmId1.value = pblmId;
  showWhy.value = true;
}
function getData() {
  var par = JSON.parse(router.query.object);
  formObj.value = JSON.parse(router.query.object)
  request.get(`/bis/insp/baseNew/getByRgstr/${formObj.value.rgstrId}`).then(res=>{
    if(res.success){
      formObj.value = res.data;
      var par = JSON.parse(router.query.object);
      formObj.value.rgstrId = par.rgstrId
    }
  })
  var problemForm = {
    objType:128,
    objId: par.objId,
    presId: localStorage.getItem("userid"),
  }
  request.post(`/dc/insp/pblm/list/${problemForm.presId}`, problemForm).then(res => {
      if (res.success) {
        pblmList.value = res.data.list;
      }
  })
  formObj.value.rgstrId = par.rgstrId;
  console.log(formObj.value);
}
onMounted(() => {
  getData();
});
</script>
<style lang="scss">
.xcdc {
  position: relative;
  width: calc(100% - 16px);
  margin: 8px;
  padding: 10px;
  font-size: 14px;
  background: #fff;
  border-radius: 3px;
  color: #808080;
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
  .xcdcJC {
    width: 40px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    background: #daa520;
    color: #000;
    border-radius: 3px;
    position: absolute;
    right: 15px;
    top: 10px;
  }
  .title {
    display: flex;
    font-size: 16px;
    margin-bottom: 10px;
    color: #000;
    .titleLeft {
      margin: auto 0;
      width: 5px;
      height: 16px;
      background: #007bff;
      margin-right: 5px;
    }
  }
  .xcdcLxr {
    display: flex;
    margin-bottom: 5px;
    .lxrItem {
      width: 40%;
    }
  }
  .xcdcCity {
    margin-bottom: 5px;
  }
  .xcdcDZ {
    margin-bottom: 5px;
  }
  .xcdcTJ {
    margin-bottom: 5px;
  }
}
.xcdcFS {
  display: flex;
  background: #007bff;
  margin: 0 8px;
  padding: 10px 0;
  color: #fff;
  border-radius: 3px;
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
  .fsItem {
    margin-left: 5px;
    width: 49%;
    line-height: 24px;
  }
}
.xcdcXC {
  display: flex;
  margin: 5px 8px;
  padding: 10px 0;
  background: #fff;
  border-radius: 3px;
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
  .XCfsItem {
    display: flex;
    width: 49%;
    font-size: 16px;
    .titleLeft {
      margin: auto 0;
      width: 5px;
      height: 16px;
      background: #007bff;
      margin-right: 5px;
    }
  }
  .XCqfItem {
    color: #808080;
    width: 49%;
    display: flex;
    justify-content: space-around;
    font-size: 14px;
    line-height: 24px;
  }
}
</style>
