mes-vue/src/views/biz/orderProcessPlan/pgitem.vue

<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"
              @update:value="loadNc"
          />
        </n-form-item>
      </n-gi>
    </n-grid>
    <n-grid>
      <n-gi :span="10">
        <n-form-item
            label="数量"
            :path="`${listname}[${index}].quantity`"
            :rule="{
                    trigger: ['input', 'blur'],
                    validator: (_rule: any, value: any) => {
                      if (value === null || value === undefined || value === '') {
                        return new Error('请输入数量')
                      }
                      const num = Number(value)
                      if (Number.isNaN(num) || num <= 0) {
                        return new Error('请输入有效数量')
                      }
                      return true
                    },
                }"
        >
          <n-input :value="quantityText" @update:value="onQuantityUpdate" placeholder="请输入数量"/>
        </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, computed, watch} 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]
}>()

/** n-input 需要 string；带出的待派数量可能是 number，统一转成字符串可直接通过校验 */
const quantityText = computed(() => {
  const val = props.obj?.quantity
  if (val === null || val === undefined || val === '') return ''
  return String(val)
})

function onQuantityUpdate(val: string) {
  props.obj.quantity = val
}

watch(
  () => props.obj?.quantity,
  (val) => {
    if (typeof val === 'number') {
      props.obj.quantity = String(val)
    }
  },
  { immediate: true }
)

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)
  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 + ''
        }
      })
    }
    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 + ''
    }
  })
}

/** 按工位/设备加载已绑定 NC/图纸；无设备时清空 */
async function loadNc(deviceId?: string | number | null) {
  props.obj.ncId = null
  ncList.value = []
  if (deviceId == null || deviceId === '') return
  const res = await loadAllNcCode(deviceId)
  const list = Array.isArray(res) ? res : (res as any)?.records ?? (res as any)?.list ?? []
  ncList.value = list.map((n: any) => {
    return {
      label: n.name || n.ncName || n.ncCode || String(n.id),
      value: n.id
    }
  })
}


loadSection()
slehand()

</script>