schangxiang@126.com
2025-05-18 cf008dbb6059fe42a384e8ab35e90c4d295b9dc7
PipeLineLems/pipelinelems_web/src/widgets/PipeAccessoryAssembly/Views/Pages/PipeAccessoryAssembly/PipeAccessoryAssembly.tsx
@@ -1,7 +1,7 @@
import { defineComponent, onMounted, ref } from 'vue'
import type { Ref } from 'vue'
import styles from './PipeAccessoryAssembly.module.scss'
import pipeImage from '@/images/pipe-assembly-drawing-example.png';
import pipeImage from '@/images/pipe-assembly-drawing-example.png'
import {
  ElInput,
  ElForm,
@@ -16,6 +16,7 @@
  getPlaceNoForStockList,
  getMaterialModelList,
  instock,
  findSingleWorkPlanByFilter
} from '@/widgets/PipeAccessoryAssembly/Models/Service/PipeAccessoryAssembly'
import { Message } from '@element-plus/icons-vue/dist/types'
@@ -23,12 +24,22 @@
  name: 'PipeAccessoryAssembly',
  setup() {
    // 查询表单数据
    const queryForm = ref({
      materialModel: '',
      placeNo: '',
      materialBatch: '',
      stockNumber: '',
    })
const queryForm = ref({
  pipeSpecCode: '',
  processRouteNumber: '',
  taskCode: '',
  length: '',
  projectNumber: '',
  shipNumber: '',
  material: '',
  outerDiameter: '',
  thickness: '',
  plannedStartTime: '',
  plannedEndTime: '',
  workstationCode: '',
  processName: '',
  equipmentCode: ''
})
    // 数据源
    const modelOptions = ref<Array<{ value: string; label: string }>>([])
@@ -80,10 +91,52 @@
        label: item.placeNoDesc,
      }))
    }
    const handleChange =async (value) => {
      console.log('输入内容确认:', value); // 失去焦点或回车时触发
      // 在此处添加业务逻辑(如校验、提交等)
      const param={
        pipeSpecCode:value,
        pipeSpecCode_FilterMode:2,//精准查询
        processName:'装配工序',
        processName_FilterMode:2,//精准查询
      }
      const workPlan = await findSingleWorkPlanByFilter(param);
      console.log('返回:'+workPlan);
      if(workPlan==''){
        ElMessage.error('没有找到数据');
        queryForm.value ={ pipeSpecCode: '',
          processRouteNumber: '',
          taskCode: '',
          length: '',
          projectNumber: '',
          shipNumber: '',
          material: '',
          outerDiameter: '',
          thickness: '',
          plannedStartTime: '',
          plannedEndTime: '',
          workstationCode: '',
          processName: '',
          equipmentCode: ''}
      }else{
        queryForm.value=workPlan;
      }
    };
    return () => {
      return (
        <div class={styles.PipeAccessoryAssemblyContent}  style="overflow-y: auto !important;  height: 100%;">
        <div
          class={styles.PipeAccessoryAssemblyContent}
          style="overflow-y: auto !important;  height: 100%;"
        >
             <ElFormItem label="管段编号">
                  <ElInput
                    v-model={queryForm.value.pipeSpecCode}
                    clearable
                    class={styles.formInput}
                    onInput={handleChange}
                  />
                </ElFormItem>
          <div class={styles.actionButtons}>
            <ElButton type="warning">开工</ElButton>
            <ElButton type="warning">完工</ElButton>
@@ -91,85 +144,135 @@
            <ElButton type="warning">自动</ElButton>
            <ElButton type="warning">质检</ElButton>
          </div>
          <h2 class={styles.blockTitle}>当前工位/设备信息</h2>
          {/* <div class={styles.modelRrow}> */}
          {/* <div> */}
          <div class={styles.headerContent}>
            <div class={styles.header}>
              <ElForm label-position="right" class={styles.h5Form}>
                <ElFormItem label="型号1">
                  <ElSelect
                    v-model={queryForm.value.materialModel}
                    placeholder="请选择型号"
                    clearable
          <h2 class={styles.blockTitle}>当前任务</h2>
          <ElForm label-position="left" >
                <ElFormItem label="物料流向">
                  <ElInput
                    v-model={queryForm.value.processRouteNumber}
                    disabled
                    clearable
                    class={styles.formInput}
                  >
                    {modelOptions.value.map((item) => (
                      <ElOption
                        key={item.value}
                        label={item.label}
                        value={item.value}
                      />
                    ))}
                  </ElSelect>
                  />
                </ElFormItem>
                <ElFormItem label="型号2">
                  <ElSelect
                    v-model={queryForm.value.materialModel}
                    placeholder="请选择型号"
                    clearable
                <ElFormItem label="任务编号">
                  <ElInput
                    v-model={queryForm.value.taskCode}
                    disabled
                    clearable
                    class={styles.formInput}
                  >
                    {modelOptions.value.map((item) => (
                      <ElOption
                        key={item.value}
                        label={item.label}
                        value={item.value}
                      />
                    ))}
                  </ElSelect>
                  />
                </ElFormItem>
                <ElFormItem label="型号3">
                  <ElSelect
                    v-model={queryForm.value.materialModel}
                    placeholder="请选择型号"
                    clearable
                <ElFormItem label="管段长度">
                  <ElInput
                    v-model={queryForm.value.length}
                    disabled
                    clearable
                    class={styles.formInput}
                  >
                    {modelOptions.value.map((item) => (
                      <ElOption
                        key={item.value}
                        label={item.label}
                        value={item.value}
                      />
                    ))}
                  </ElSelect>
                  />
                </ElFormItem>
                <ElFormItem label="型号4">
                  <ElSelect
                    v-model={queryForm.value.materialModel}
                    placeholder="请选择型号"
                    clearable
                <ElFormItem label="项目号">
                  <ElInput
                    v-model={queryForm.value.projectNumber}
                    disabled
                    clearable
                    class={styles.formInput}
                  >
                    {modelOptions.value.map((item) => (
                      <ElOption
                        key={item.value}
                        label={item.label}
                        value={item.value}
                      />
                    ))}
                  </ElSelect>
                  />
                </ElFormItem>
                <ElFormItem label="船号">
                  <ElInput
                    v-model={queryForm.value.shipNumber}
                    disabled
                    clearable
                    class={styles.formInput}
                  />
                </ElFormItem>
                <ElFormItem label="材质">
                  <ElInput
                    v-model={queryForm.value.material}
                    disabled
                    clearable
                    class={styles.formInput}
                  />
                </ElFormItem>
                <ElFormItem label="外径">
                  <ElInput
                    v-model={queryForm.value.outerDiameter}
                    disabled
                    clearable
                    class={styles.formInput}
                  />
                </ElFormItem>
                <ElFormItem label="壁         &nbsp;&nbsp;&nbsp;厚">
                  <ElInput
                    v-model={queryForm.value.thickness}
                    disabled
                    clearable
                    class={styles.formInput}
                  />
                </ElFormItem>
                <ElFormItem label="计划开始时间">
                  <ElInput
                    v-model={queryForm.value.plannedStartTime}
                    disabled
                    clearable
                    class={styles.formInput}
                  />
                </ElFormItem>
                <ElFormItem label="计划完成时间">
                  <ElInput
                    v-model={queryForm.value.plannedEndTime}
                    disabled
                    clearable
                    class={styles.formInput}
                  />
                </ElFormItem>
              </ElForm>
            </div>
          </div>
              <h2 class={styles.blockTitle}>当前工位/设备信息</h2>
          <ElForm label-position="left" >
                <ElFormItem label="工位代码">
                  <ElInput
                    v-model={queryForm.value.workstationCode}
                    disabled
                    clearable
                    class={styles.formInput}
                  />
                </ElFormItem>
                <ElFormItem label="工序名称">
                  <ElInput
                    v-model={queryForm.value.processName}
                    disabled
                    clearable
                    class={styles.formInput}
                  />
                </ElFormItem>
                <ElFormItem label="设备代码">
                  <ElInput
                    v-model={queryForm.value.equipmentCode}
                    disabled
                    clearable
                    class={styles.formInput}
                  />
                </ElFormItem>
                {/* <ElFormItem label="设备状态">
                  <ElInput
                    v-model={queryForm.value.materialBatch}
                    disabled
                    clearable
                    class={styles.formInput}
                  />
                </ElFormItem> */}
                {/* <ElFormItem label="操作人">
                  <ElInput
                    v-model={queryForm.value.materialBatch}
                    disabled
                    clearable
                    class={styles.formInput}
                  />
                </ElFormItem> */}
              </ElForm>
          <div class="info-block">
            <h2 class="block-title">工艺信息</h2>
@@ -186,7 +289,6 @@
            style="height:1250px;"
            class="equipment-image"
          ></img>
        </div>
      )
    }