<template>
  <!-- 河道巡查填报 -->
  <div class="taskFormRiver">
    <van-form @submit="onSubmitData">
      <div class="ContentView" id="ContentViewRiver">
        <van-field
          v-model="value"
          label="问题类型"
          placeholder="请输入问题类型"
          show-word-limit
          required
          :rules="[{ required: true, message: '请输入' }]"
        />
        <van-field
          v-model="value"
          label="检查项"
          placeholder="请输入检查项"
          show-word-limit
          required
          :rules="[{ required: true, message: '请输入' }]"
        />
        <van-field label="是否整改" name="caseLevel" required :rules="[{ required: true, message: '请选择' }]">
          <template #input>
            <van-radio-group v-model="AllData.formData.caseLevel" direction="horizontal">
              <van-radio
                :name="item.value"
                v-for="item in AllData.formOptions.case_level"
                :key="item.value"
                @click="getAnJianName2(item)"
              >
                {{ item.label }}
              </van-radio>
            </van-radio-group>
          </template>
        </van-field>
        <van-field
          v-model="AllData.formData.caseName"
          rows="2"
          autosize
          label="问题描述"
          type="textarea"
          maxlength="200"
          placeholder="请输入问题描述"
          show-word-limit
          required
          :rules="[{ required: true, message: '请输入' }]"
        />

        <div class="mediumList">
          <span class="Title">现场图片(最多3张)</span>
          <div class="picBox">
            <UploadImg
              :maxCount="3"
              :saveFileArr="AllData.PicListData"
              :acceptFormat="'image/*'"
              @update:saveFileArr="getImgList"
            />
          </div>
        </div>
        <!-- <div class="mediumList">
          <span class="Title">现场视频(最多3个)</span>
          <div class="picBox">
            <UploadImg
              :maxCount="3"
              :saveFileArr="AllData.PicListData2"
              :acceptFormat="'video/*'"
              @update:saveFileArr="getVideoList"
            ></UploadImg>
          </div>
        </div> -->
      </div>
      <div class="BottomView">
        <van-button @click="closeDaKa" class="BotBtn">返回</van-button>
        <van-button native-type="submit" class="BotBtn" type="primary">提交</van-button>
      </div>
    </van-form>
  </div>
</template>
<script setup>
import UploadImg from '@/views/components/uploadFile.vue';
// 获取父组件传过来的patrolLogId
const props = defineProps({
  patrolLogId: String,
  MarkForData: Object,
});
const emits = defineEmits(['closeFormTransition']);
const closeDaKa = () => {
  emits('closeFormTransition', 'AnJianUpdatas');
};
const AllData = reactive({
  formData: {
    reportFlag: 0,
    caseLevel: '',
    caseType: '',
    caseName: '',
    caseSource: 'patrol_report',
    caseContent: '',
    patrolLogId: props.patrolLogId,
    lonLat: '',
    caseAddress: '',
    fileSaveRequestList: [],
    caseDataSource: 'task',
  },
  formOptions: {
    case_level: [
      {
        value: '1',
        label: 'aa',
      },
      {
        value: '2',
        label: 'bb',
      },
    ],
    caseTypeData: [],
  },
  PicListData: [], //获取的图片数组
  PicListData2: [], //获取的视频数组
});

// 获取上传的图片
function getImgList(e) {
  AllData.PicListData = e;
}
// 获取上传的视频
function getVideoList(e) {
  AllData.PicListData2 = e;
}
</script>
<style lang="less">
.taskFormRiver {
  width: 100%;
  height: calc(100% - 80px);
  background: #fafafa;

  .ContentView {
    width: 100%;
    height: calc(100vh - 360px);
    background-color: #ececec;
    box-sizing: border-box;
    padding: 20px 20px;
    overflow: auto;
    .van-radio {
      margin-bottom: 10px;
    }
    .mediumList {
      width: 100%;
      height: auto;

      .Title {
        width: 100%;
        height: 60px;
        line-height: 60px;
        display: inline-block;
      }

      .picBox {
        width: 100%;
        height: auto;
      }
    }
  }
  .BottomView {
    width: 100%;
    height: 120px;
    display: flex;
    justify-content: space-around;
    margin-top: 20px;

    .BotBtn {
      width: 45%;
    }
  }
}
</style>