<template>
  <div>
    <n-grid>
      <n-gi :span="10">
        <n-form-item
            label="指派工段"
            :path="`${listname}[${index}].sectionId`"
        >
          <n-select
              v-model:value="obj.sectionId"
              filterable
              placeholder="请选择工段"
              :options="sectionList"
              :loading="loadingRef"
              disabled
              remote
              :clear-filter-after-select="false"
          />
        </n-form-item>
      </n-gi>
      <n-gi :span="10">
        <n-form-item
            label="指派工位"
            :path="`${listname}[${index}].deviceId`"
            :rule="{
                        required:true,
                        message:`请选择工位`,
                        trigger: 'blur' 
                    }"
        >
          <n-select
              v-model:value="obj.deviceId"
              filterable
              placeholder="请选择工位"
              :options="deviceList"
              :loading="loadingRef"
              clearable
              remote
              :clear-filter-after-select="false"
          />
        </n-form-item>
      </n-gi>
    </n-grid>
    <n-grid>
      <n-gi :span="10">
        <n-form-item
            label="数量"
            :path="`${listname}[${index}].quantity`"
            :rule="{
                    required: true,
                    message: `请输入数量`,
                    trigger: 'blur',
                }"
        >
          <n-input v-model:value="obj.quantity"/>
        </n-form-item>
      </n-gi>
      <n-gi :span="10">
        <n-form-item
            label="NC下发"
            :path="`${listname}[${index}].ncId`"
        >
          <n-select
              v-model:value="obj.ncId"
              filterable
              placeholder="请选择下发NC"
              :options="ncList"
              clearable
              remote
              :clear-filter-after-select="false"
          />
        </n-form-item>
      </n-gi>
      <n-gi :span="4" style="padding-left:10px;">
        <n-icon
            v-if="index == 0"
            size="25"
            style="padding-top: 5px;cursor: pointer;" color="#1060c9"
            @click="addpgnum"
        >
          <AddOutline/>
        </n-icon>

        <n-icon
            v-else
            size="18"
            style="padding:7px 0 0 2px;cursor: pointer;" color="#d03050"
            @click="deletenum(index)"
        >
          <TrashOutline/>
        </n-icon>
      </n-gi>
    </n-grid>
  </div>


</template>
<script setup lang="ts">
import {ref, reactive} from 'vue'
import {userApi} from '@/api/system'
import {sectionApi, type Section} from '@/api/section'
import {
  AddOutline,
  TrashOutline,
} from '@vicons/ionicons5'
import {loadAllNcCode} from '@/api/nccode.ts'

const props = withDefaults(defineProps<{
  listname: any
  obj: any,
  index: any
  sectionId?: number | string | null
  workshopId?: number | string | null
}>(), {
  obj: {}
})
const emit = defineEmits<{
  addhand: [],
  delehand: [index: any],
  update: [index: any, obj: any]
}>()


//  function updatehand() {
//     emit('update')
// }

function addpgnum() {
  emit('addhand')
}

function deletenum(index: any) {
  emit('delehand', index)
}

let sectionList = reactive<{ label: string, value: any }[]>([])
let yglist = ref<any>([])

let loadingRef = ref(false)

let deviceList = ref<any>([])

let ncList = ref<any>([])

function slehand(v?: any) {
  loadingRef.value = true
  yglist.value.splice(0)
  // dispatchform.userlist = [{
  //     id:'',
  //     num:''
  // }]
  userApi.page({
    page: 1,
    pageSize: 100,
    username: v,
  }).then((rps: any) => {
    if (rps.list && rps.list.length > 0) {
      yglist.value = rps.list.map((n: any) => {
        return {
          label: n.username,
          value: n.id + ''
        }
      })
    }
    console.log(yglist.value, '12')
    loadingRef.value = false
  }).catch(() => {
    loadingRef.value = false
  })
}

//加载工段（按 sectionId 查部门与设备）
async function loadSection() {
  if (props.sectionId == null || props.sectionId === '') return
  const res = await sectionApi.list({sectionId: props.sectionId})
  const mesSection = res?.MesSection;
  const mesDevice = res?.MesDevice || []
  if (!mesSection) return

  sectionList.push({
    label: mesSection.deptName,
    value: mesSection.id
  })
  props.obj.sectionId = mesSection.id

  deviceList.value = mesDevice.map((n: any) => {
    return {
      label: n.deviceName,
      value: n.id + ''
    }
  })
}

//加载下发数据
async function loadNc() {
  const res = await loadAllNcCode()
  ncList.value = res.map((n: any) => {
    return {
      label: n.ncName,
      value: n.id
    }
  })
  console.log(ncList.value)
}


loadSection()
slehand()
loadNc()

</script>