<template>
	<Dialog :title="dialogTitle" width="80%" v-model="dialogVisible" center :close-on-click-modal="false"   :show-close="false">
		<el-card>
					<div style="text-align: center;">
						<span class="spanWeight">提示</span>
					</div>
					<div style="text-align: center;">
						<span>{{props.typeNames}}：
							<span class="spanWeight">  
							<!-- <el-form-item :prop="formData.name" class="mb-0px!">
							  
							   
							</el-form-item> -->
							<UserSelect v-model="formData.name"  @update:newValue="handleSelectedUser5" class="!w-180px"/> 
							</span>  
							<span>设计时间（{{props.dateOne}}至{{props.dateTwo}}）冲突！是否将本单插活，优先进行？</span>
						</span>
					</div>
					<div style="text-align: center;">
						<span>插活后将影响以下项目设计</span>
					</div>
				</el-card>
				<el-card class="hl-incard">
				  <el-form ref="subFormRef" :model="formData.projectPlanSubs" 
				    v-loading="subFormLoading" label-width="0">
				    <el-table :show-overflow-tooltip="true" :data="formData.projectPlanSubs" class="hl-table">
				      <el-table-column label="序号" align="center" type="index" width="80" fixed />
					  
					  <el-table-column min-width="180" align="center">
					    <template #header>要求设计结束日期</template>
					    <template #default="{ row, $index }">
					  	<el-form-item :prop="`${$index}.changeEndTime`" class="mb-0px!">
					  	  <el-date-picker class="!w-265px" v-model="row.changeEndTime" type="date" value-format="x"
					  		placeholder="要求设计结束日期"/>
					  	</el-form-item>
					    </template>
					  </el-table-column>
				      <el-table-column prop="projectSubName" label="子项目名称" min-width="120" align="center" fixed />
					  <el-table-column prop="projectSubShortName" label="子项目简称" min-width="120" align="center" fixed />
				      <el-table-column prop="projectSubCode" label="子项目编号" min-width="350" align="center" />
					  <el-table-column prop="mouldName" label="模具类型" min-width="350" align="center" />
					  <el-table-column prop="equipName" label="设备型号" min-width="350" align="center" />
				      <el-table-column prop="amount" label="数量" min-width="100" align="center" />
				      <el-table-column prop="unit" label="单位" min-width="100" align="center">
				        <template #default="scope">
				          <dict-tag :type="DICT_TYPE.HELI_MATERIAL_UNIT" :value="scope.row.unit" />
				        </template>
				      </el-table-column>
					  <el-table-column prop="compositionName" label="主要材质" min-width="180" align="center" />
					  <el-table-column min-width="180" align="center">
					    <template #header>毛坯开始日期</template>
					    <template #default="{ row, $index }">
					  	<el-form-item :prop="`${$index}.startBlankDate`" class="mb-0px!">
					  	  <el-date-picker class="!w-265px" v-model="row.startBlankDate" type="date" value-format="x"
					  		placeholder="毛坯开始日期"/>
					  	</el-form-item>
					    </template>
					  </el-table-column>
					  <el-table-column min-width="180" align="center">
					    <template #header>毛坯结束日期</template>
					    <template #default="{ row, $index }">
					      <el-form-item :prop="`${$index}.blankDate`" class="mb-0px!">
					        <el-date-picker class="!w-265px" v-model="row.blankDate" type="date" value-format="x"
					          placeholder="毛坯结束日期"  />
					      </el-form-item>
					    </template>
					  </el-table-column>
					  <el-table-column prop="blankNum" label="毛坯设计天数" min-width="180" align="center" />
					  <!-- <el-table-column prop="blankOwner" label="毛坯负责人" min-width="100" align="center" /> -->
		                   <el-table-column min-width="150" align="center">
		                    <template #header>毛坯负责人</template>
		                    <template #default="{ row, $index }">
		                      <el-form-item :prop="`${$index}.blankOwner`" class="mb-0px!">
		                         <UserSelect v-model="row.blankOwner"  @update:newValue="handleSelectedUser6($index,$event)" class="!w-265px"/>
		                      </el-form-item>
		                    </template>
		                  </el-table-column> 
					  <el-table-column min-width="180" align="center">
					    <template #header>2D开始日期</template>
					    <template #default="{ row, $index }">
					      <el-form-item :prop="`${$index}.startTwoDimDate`" class="mb-0px!">
					        <el-date-picker class="!w-265px" v-model="row.startTwoDimDate" type="date" value-format="x"
					          placeholder="2D开始日期"  />
					      </el-form-item>
					    </template>
					  </el-table-column>
					    <el-table-column min-width="180" align="center">
					      <template #header>2D结束日期</template>
					      <template #default="{ row, $index }">
					        <el-form-item :prop="`${$index}.twoDimDate`" class="mb-0px!">
					          <el-date-picker class="!w-265px" v-model="row.twoDimDate" type="date" value-format="x"
					            placeholder="2D结束日期" />
					        </el-form-item>
					      </template>
					    </el-table-column>
					    <el-table-column prop="twoDimNum" label="2D设计天数" min-width="180" align="center" />
					    <el-table-column min-width="150" align="center">
					      <template #header>2D负责人</template>
					      <template #default="{ row, $index }">
					        <el-form-item :prop="`${$index}.twoDimOwner`" class="mb-0px!">
					          <!-- <el-select class="!w-265px" v-model="row.twoDimOwner" filterable >
					            <el-option v-for="dict in userInit" :key="dict.id"
					              :label="dict.username+' '+dict.nickname" :value="dict.id" />
					          </el-select> -->
					           <UserSelect v-model="row.twoDimOwner"  @update:newValue="handleSelectedUser7($index,$event)" class="!w-265px"/>
					        </el-form-item>
					      </template>
					    </el-table-column>
						<el-table-column min-width="180" align="center">
						  <template #header>3D开始日期</template>
						  <template #default="{ row, $index }">
						    <el-form-item :prop="`${$index}.startThreeDimDate`" class="mb-0px!">
						      <el-date-picker class="!w-265px" v-model="row.startThreeDimDate" type="date" value-format="x"
						        placeholder="3D开始日期" />
						    </el-form-item>
						  </template>
						</el-table-column>
						  <el-table-column min-width="180" align="center">
						    <template #header>3D结束日期</template>
						    <template #default="{ row, $index }">
						      <el-form-item :prop="`${$index}.threeDimDate`" class="mb-0px!">
						        <el-date-picker class="!w-265px" v-model="row.threeDimDate" type="date" value-format="x"
						          placeholder="3D结束日期" />
						      </el-form-item>
						    </template>
						  </el-table-column>
						  <el-table-column prop="threeDimNum" label="3D设计天数" min-width="180" align="center" />
						  <el-table-column min-width="150" align="center">
						    <template #header>3D负责人</template>
						    <template #default="{ row, $index }">
						      <el-form-item :prop="`${$index}.threeDimOwner`" class="mb-0px!">
						        
						         <UserSelect v-model="row.threeDimOwner"  @update:newValue="handleSelectedUser8($index,$event)" class="!w-265px"/>
						      </el-form-item>
						    </template>
						  </el-table-column>
					  
					  
					  
				
				    </el-table>
				  </el-form>
				  <div class="text-center hl-footer">
				  		    <el-button  @click="clouse" size="large">取 消</el-button><!-- @click="() => router.back()" -->
				  		    <el-button  @click="submitForm" type="success" size="large">保 存</el-button><!-- @click="submitForm" -->
				  		  </div>

			</el-card>
	</Dialog>
</template>

<script setup lang="ts">
import { getIntDictOptions, getStrDictOptions, DICT_TYPE } from '@/utils/dict'
import { dateFormatter, dateFormatter2, formatDate } from '@/utils/formatTime'
import { ref,defineProps ,onMounted ,watch } from "vue";
import { ElTable } from 'element-plus'
import * as UserApi from '@/api/system/user'
import UserSelect from '@/views/heli/hlvuestyle/userSelect.vue'
import * as PlanSubApi from '@/api/heli/plansub'
const message = useMessage() // 消息弹窗
const { t } = useI18n() // 国际化
const router = useRouter()
const dialogVisible = ref(false) // 弹窗的是否展示
const dialogTitle = ref('') // 弹窗的标题

const loading = ref(true) // 列表的加载中
const list = ref([]) // 列表的数据
const total = ref(0) // 列表的总页数
const userInit = ref()
const formData = ref({
	
	projectPlanSubs: [],
	ownerId: undefined,
	dateOne: undefined,
	dateTwo: undefined,
	diffDays:undefined,
	typeNames:undefined,
	name:undefined,
})



const props = defineProps({
  projectOrderSubs: Array,
	ownerId:String,
	dateOne:String,
	dateTwo:String,
	id:Number,
	diffDays:Number,
	typeNames:String,
	parentMethod: Function,
	parentMethods:Function,
	showCloseProp:Boolean
});
// 计划批准人
const handleSelectedUser5 = (newValue: any) => {
  
  formData.value.name = newValue?.id
}

onMounted(async () => {
	//用户列表数据  
	userInit.value = await UserApi.getSimpleUserList()
  // 将父组件传递的数据赋值给 formData.projectPlanSubs
  formData.value.projectPlanSubs = props.projectOrderSubs;
  formData.value.name = props.ownerId
  console.log("formData.name 赋值后的数据");
  console.log(formData.value.name);
});

const submitForm = async () => {
	
	
	dialogVisible.value = false
	props.parentMethod(); 
	
}
const clouse = async () => {
	
	
	dialogVisible.value = false
	props.parentMethods(); 
	
}


/* // 毛坯负责人
const handleSelectedUser6 = (currentIndex,newValue: any) => {
   formData.value.projectPlanSubs[currentIndex].blankOwner = newValue?.id
}
// 毛坯负责人
const handleSelectedUser7 = (currentIndex,newValue: any) => {
   formData.value.projectPlanSubs[currentIndex].blankOwner = newValue?.id
}
// 毛坯负责人
const handleSelectedUser8 = (currentIndex,newValue: any) => {
   formData.value.projectPlanSubs[currentIndex].blankOwner = newValue?.id
} */
 watch(() => props.projectOrderSubs.projectOrderSubs, (newVal) => {
	
	//.projectOrderSubs
	console.log("子组件数据更新");
	console.log(props.projectOrderSubs);
  
   formData.value.projectPlanSubs = newVal;
  formData.value.name = props.ownerId
 //  formData.value.ownerId = props.projectOrderSubs.dateOne;
  // formData.value.dateOne = props.projectOrderSubs.dateOne;
  // formData.value.dateTwo = props.projectOrderSubs.dateTwo; 
   
  
  
}); 

</script>

<style>
	.spanWeight{
		font-weight: bold
	}
</style>