<script setup>
import { ElMessage } from 'element-plus';

const props = defineProps({
  id: String
})

const queryForm = reactive({
  limit: 10,
  page: 1
})

let data = $ref([])

let options = $ref([])
let options_loading = $ref(true)

let form = reactive({})
request({
  url: '/yzy/zy_ssys_dtjl_star/index',
  data: {
    yzsd_id: props.id
  }
}).then(res => {
  if (res.code === '1') {
    console.log('res :>> ', res);
    options = res.data.table_structure.field.yzsds_type.option
    options_loading = false

    data = res.data.page_data
    data.forEach(({ yzsds_type_option_k, yzsds_star }) => {
      form[yzsds_type_option_k] = yzsds_star * 1
    })
  }
})


function handleRateChange(row, val) {
  request({
    url: '/yzy/zy_ssys_dtjl_star/add',
    data: {
      yzy_zy_ssys_dtjl_star: {
        yzsds_type: row.v,
        yzsds_star: val,
        yzsd_id: props.id
      }
    }
  })
}


function handleSetGood(val) {
  request({
    url: '/yzy/zy_ssys_dtjl/edit',
    data: {
      yzsd_id: props.id,
      yzy_zy_ssys_dtjl: {
        yzsd_sfyxzp: val,
      }
    }
  })
}

let isYx = $ref('1')
let loading = $ref(true)
let detail = $ref({})

request({
  url: '/yzy/zy_ssys_dtjl/detail',
  data: {
    yzsd_id: props.id
  }
}).then(res => {
  if (res.code === '1') {
    loading = false
    detail = res.data.one_info
    isYx = detail.yzsd_sfyxzp_option_k
  }
})

const router = useRouter()
function handleSubmit() {
  ElMessage.success('提交成功')
  router.back()
}

</script>

<template>
  <div class="w-full shadow bg-white rounded-md flex items-center px-36 py-4 mb-4">
    <div class="text-lg text-hex-050026">查看</div>
    <el-divider direction="vertical" />
    <div class="text-sm">
      <span class="text-hex-949494">作业</span>
      <span class="text-hex-949494"> - 全景课堂</span>
      <span class="text-hex-949494"> - 学生作业</span>
      <span> - 学生作业</span>
    </div>
  </div>
  <div class="w-full p-4 shadow bg-white flex divide-x divide-x-8 divide-dashed " v-loading="loading">
    <div class=" p-8 ">
      <div class="text-black text-sm font-bold">{{ detail.yzsd_xsxm }}</div>
      <div class="text-xs text-hex-8083A3">{{ detail.create_dateline }} 上传</div>
      <div class="flex_center w-945px h-500px rounded-lg overflow-hidden flex-auto">
        <!-- <img :src="getFullUrl(detail.yzsd_file)" alt="" class="w-full object-contain"> -->
        <el-image class="w-full h-full" :src="getFullUrl(detail.yzsd_file)"
          :preview-src-list="[getFullUrl(detail.yzsd_file)]" fit="contain" />
      </div>
    </div>
    <div class=" p-8 flex-auto" v-show="options.length">
      <div class="text-md font-bold text-hex-171721 mb-4">批阅</div>
      <template v-if="!options_loading">
        <div class="my-2" v-for="(option) in options">
          <div class="text-hex-171721">{{ option.n }}</div>
          <el-rate v-model="form[option.v]" @change="handleRateChange(option, $event)"></el-rate>
        </div>
        <!-- <div
        class="w-112px h-32px flex_center rounded-full bg-gradient-to-r from-hex-dadada to-hex-5d5d5d text-white text-xs cursor-pointer"
        @click="handleSetGood">设为优秀作品</div> -->
        <el-checkbox v-model="isYx" label="设为优秀作品" size="large" true-label="1" false-label="2" @change="handleSetGood" />
        <div class="w-full flex justify-around mt-4">
          <!-- <div
          class="w-136px h-40px flex_center rounded-md bg-gradient-to-r from-hex-dadada to-hex-5d5d5d text-white text-xs cursor-pointer"
          @click="handleSetGood">设为优秀作品</div> -->
          <div class="w-136px h-40px flex_center rounded-md bg-hex-00A3FF text-white text-xs cursor-pointer"
            @click="handleSubmit">提交
          </div>
        </div>
      </template>
    </div>
  </div>
</template>
