<template>
  <!-- 站点状态- 运维派单 -->
  <div class="equipRepair">
    <el-form size="small" label-width="90px">
      <el-form-item label="站点名称" prop="station">
        <el-input v-model="queryParams.station" placeholder="请输入" clearable />
      </el-form-item>
      <el-form-item label="站点编号" prop="code">
        <el-input v-model="queryParams.code" placeholder="请输入" clearable />
      </el-form-item>
      <el-form-item label="运维公司" prop="name">
        <el-input v-model="queryParams.name" placeholder="请输入" clearable />
      </el-form-item>
      <el-form-item label="运维责任人" prop="user">
        <el-select v-model="queryParams.user" filterable placeholder="选择运维责任人">
          <el-option v-for="item in userList" :key="item.value" :label="item.label" :value="item.value" />
        </el-select>
      </el-form-item>
      <el-form-item label="期望完成时间" prop="date">
        <el-date-picker
          clearable
          v-model="queryParams.date"
          type="date"
          value-format="YYYY-MM-DD"
          placeholder="请选择期望完成时间"
        >
        </el-date-picker>
      </el-form-item>
      <el-form-item label="运维要求" prop="remark">
        <el-input type="textarea" v-model="queryParams.remark" placeholder="请输入" />
      </el-form-item>
      <el-form-item label="上传现场照片" prop="fileList" style="width: 100%; max-height: 130px">
        <el-upload
          action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
          :on-remove="handleRemove"
          list-type="picture"
        >
          <el-button type="warning">上传图片</el-button>
        </el-upload>
        <!-- <ImageUpload v-model="queryParams.fileList" :fileSize="3" :fileType="fileTypes"></ImageUpload> -->
      </el-form-item>
    </el-form>
    <div class="flex flex-justcontent-center">
      <el-button type="primary" @click="submitData">提交</el-button>
    </div>
  </div>
</template>
<script setup>
import {} from '@/api/dataAnalysis/syntherticData';

const { proxy } = getCurrentInstance();
const emit = defineEmits(['closeRightLayer']); //调用父组件方法
const queryParams = ref({
  station: '汤逊湖监测点',
  code: 'XF000323',
  name: '武汉新烽光电',
  user: '1',
  fileList: [],
  remark: '',
  date: proxy.moment().format('YYYY-MM-DD'),
});
const userList = ref([
  { value: '1', label: '朱方仁' },
  { value: '2', label: '彭玉涛' },
]);

function handleRemove(uploadFile, uploadFiles) {
  console.log(uploadFile, uploadFiles);
}
// 提交数据
function submitData() {
  proxy.$modal.msgSuccess('提交成功');
  emit('closeRightLayer');
}
</script>
<style lang="scss">
.equipRepair {
  width: 100%;

  .el-form {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    .el-form-item {
      width: 31%;
      margin-right: 2%;
      margin-bottom: 5px;
      .el-select,
      .el-input {
        width: 100%;
      }
    }
  }
}
</style>