添加 模拟计算查看流程卡详情功能

huang

2024-12-02 7a848b7e816cd2309e4ab7c3117b7d155db1af01

添加 模拟计算查看流程卡详情功能

 north-glass-erp/northglass-erp/src/views/pp/glassOptimize/GlassComputed.vue

@@ -2,7 +2,7 @@
import ComputeCard from "@/views/pp/glassOptimize/page/ComputeCard.vue";
import ComputeDetail from "@/views/pp/glassOptimize/page/ComputeDetail.vue";
import Compute from "@/views/pp/glassOptimize/page/Compute.vue";
import { ref } from 'vue';
import {ref, watch} from 'vue';
import {ElMessage} from "element-plus";
import request from "@/utils/request";

@@ -26,8 +26,23 @@
    }
  } catch (error) {
    console.error('请求出错', error);
    ElMessage.error('网络连接出现问题，请检查网络设置');
    ElMessage.error('请输入工程号！');
  }
};

// 用于从获取到的数据中提取流程卡号（processId）
const extractProcessCardNumbers = (data) => {
  if (typeof data === 'string') {
    console.log('流程卡号为字符串类型，直接返回该字符串：', data);
    return data;
  }
  if (Array.isArray(data)) {
    const processCardNumbers = data.map(item => item.process_id);
    console.log('提取到的流程卡号数组：', processCardNumbers);
    return processCardNumbers;
  }
  console.log('传入的数据类型不符合要求，无法提取流程卡号');
  return [];
};

</script>
@@ -44,7 +59,7 @@
    </div>

    <div id="computeDetail">
      <compute-detail/>
      <compute-detail :process-card-numbers="extractProcessCardNumbers(receivedData)" />
    </div>

  </div>
@@ -59,7 +74,7 @@
  height: 40%;
}
#computeCard{
  margin-top: 90px;
  margin-top: 100px;
  width: 64%;
  height: 40%;
  float: left;

 north-glass-erp/northglass-erp/src/views/pp/glassOptimize/ProjectMange.vue

@@ -111,7 +111,17 @@
    successMsg: '模拟计算已启动！',
    checkMessage: '当前工程状态不符合模拟计算条件，请确认工程状态后再操作！',
    requiresRow: true,
    actionFunction: () => {
    actionFunction: async ({row}) => {
      console.log('获取的行数据', row);
      try {
        // 使用浏览器原生Clipboard API复制工程号
        await navigator.clipboard.writeText(row.projectNumber);
        console.log('工程号已复制到剪贴板');
        ElMessage.success('工程号已成功复制');
      } catch (error) {
        console.error('复制工程号时出错:', error);
        ElMessage.error('复制工程号失败，请稍后重试');
      }
      optimizeCompute.value = true;
      Mange.value = false;
    }
@@ -257,7 +267,7 @@
          return;
        } else {
          if (config.code === 'compute') {
            config.actionFunction();
            config.actionFunction({ row });
          } else {
            row.state = config.targetState;
            const index = produceList.value.findIndex(item => item === row);

 north-glass-erp/northglass-erp/src/views/pp/glassOptimize/page/Compute.vue

@@ -1,7 +1,7 @@
<script setup>
import {reactive, ref} from "vue";
import {useI18n} from "vue-i18n";
import {Minus, Plus, Search} from "@element-plus/icons-vue";
import {Minus, Platform, Plus, Search, SuccessFilled} from "@element-plus/icons-vue";

const {t} = useI18n()

@@ -34,27 +34,7 @@
    mode: 'row',
    showStatus: true
  },
  /*formConfig: {
    data: {
      width: '',
      height: '',
      quantity: ''
    },
    items: [
      { field: 'width', title: t('order.width')+':', itemRender: { name: 'VxeInput' } },
      { field: 'height', title: t('order.height')+':', itemRender: { name: 'VxeInput' } },
      { field: 'quantity', title: t('order.quantity')+':', itemRender: { name: 'VxeInput' } },
      {
        itemRender: {
          name: 'VxeButtonGroup',
          options: [
            { type: 'submit', content: t('craft.sure'), status: 'primary' },
            { type: 'reset', content: t('product.msg.reset') }
          ]
        }
      }
    ]
  },*/

  columns: [
    {field: 'id', width: 70, title: '序号', filters: [{data: ''}], slots: {default: 'state', filter: 'num2_filter'}},
    {field: '', width: 100, title: '版图数'},
@@ -128,7 +108,7 @@
// 定义响应式数据，用于绑定工程号输入框的值
const projectNumber = ref('');

let emit = defineEmits(['changeDialog', 'fetch-data']);
let emit = defineEmits(['fetch-data']);

const handleSearchClick = () => {
  // 通过 $emit 触发自定义事件，将工程号传递给父组件，由父组件去调用接口获取数据
@@ -144,13 +124,13 @@
    <div id="title" style="margin-top: -10px">
      <span>
        工程编号
      <vxe-input size="small" style="margin-left: 20px" clearable v-model="projectNumber"></vxe-input>
      <el-input style="width:150px;margin-left: 20px" clearable v-model="projectNumber" placeholder="请输入工程号"></el-input>
      <el-button
          type="primary"
          :icon="Search"
          style="margin-left: 20px"
          @click="handleSearchClick"
      >{{$t('basicData.search') }}
      >{{ $t('basicData.search') }}
      </el-button>
      </span>
      <span style="float: right ; margin-right: 120px">
@@ -172,8 +152,8 @@
                :value="item.value"
            />
          </el-select>
      <el-button type="primary" style="margin-left: 20px">模拟计算</el-button>
      <el-button type="primary" style="margin-left: 50px">保存</el-button>
      <el-button type="warning" style="margin-left: 10px" :icon="Platform">模拟计算</el-button>
      <el-button type="danger" style="margin-left: 20px" :icon="SuccessFilled">保存</el-button>
      </span><br>
      <div class="demo-progress" style="margin-top: 5px">
        <div style="display: flex; align-items: center">

 north-glass-erp/northglass-erp/src/views/pp/glassOptimize/page/ComputeCard.vue

@@ -8,8 +8,10 @@
const checkboxCellRender = reactive({
  name: 'VxeCheckboxGroup',
  options: [
    { label: '允许横排', value: '1' },
    { label: '钢化', value: '2' },
    { label: '幕墙模式', value: '1' },
    { label: '允许横排', value: '2' },
    { label: '钢化', value: '3' },

  ]
})

@@ -43,8 +45,8 @@
  },

  columns:[
    {type:'expand',fixed:"left",slots: { content:'content' },width: 50},
    {field: 'check', title: '选择', width: 200, cellRender: checkboxCellRender },
    {type:'seq',fixed:"left",slots: { content:'content' },width: 50},
    {field: 'check', title: '选择', width: 250, cellRender: checkboxCellRender },
    {field: 'process_id',width: 150, title: t('processCard.processId'), sortable: true},
    {field: 'technology_number',width: 70, title: '层', sortable: true},
    {field: 'TotalFloors',width: 150, title: '总层数', sortable: true},

 north-glass-erp/northglass-erp/src/views/pp/glassOptimize/page/ComputeDetail.vue

@@ -1,6 +1,9 @@
<script setup>
import {reactive, ref} from "vue";
import {useI18n} from "vue-i18n";
import request from "@/utils/request";
import {ElMessage} from "element-plus";
import {Minus, Plus, Search} from "@element-plus/icons-vue";
const { t } = useI18n()

const xGrid = ref()
@@ -32,37 +35,16 @@
    mode: 'row',
    showStatus: true
  },
  /*formConfig: {
    data: {
      width: '',
      height: '',
      quantity: ''
    },
    items: [
      { field: 'width', title: t('order.width')+':', itemRender: { name: 'VxeInput' } },
      { field: 'height', title: t('order.height')+':', itemRender: { name: 'VxeInput' } },
      { field: 'quantity', title: t('order.quantity')+':', itemRender: { name: 'VxeInput' } },
      {
        itemRender: {
          name: 'VxeButtonGroup',
          options: [
            { type: 'submit', content: t('craft.sure'), status: 'primary' },
            { type: 'reset', content: t('product.msg.reset') }
          ]
        }
      }
    ]
  },*/
  columns:[
    {field: 'id',width: 70,  title: '序号',filters:[{ data: '' }], slots: { default: 'state',filter: 'num2_filter' }},
    {field:'state',width: 150,title: t('order.width'),filters:[{ data: '' }], slots: { default: 'state',filter: 'num2_filter' }},
    {type: 'seq',width: 150,title: t('order.height')},
    {field: 'id',width: 150, title: t('order.quantity'),filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true},
    {field: 'id',width: 150, title: t('order.buildingNumber'),filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true},
    {field: 'id',width: 150, title: t('order.shape'),filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true},
    {field: 'id',width: 150, title: t('order.grossArea'),filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true},
    {field: 'id',width: 150, title: t('craft.TrademarkAttribute'),filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true},

  columns:[
    {type: 'seq',width: 70,  title: '序号',filters:[{ data: '' }],},
    {field: 'width',width: 150,title: t('order.width'),filters:[{ data: '' }],},
    {field: 'height',width: 150,title: t('order.height')},
    {field: 'quantity',width: 150, title: t('order.quantity'),filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true},
    {field: 'Storey Number',width: 150, title: t('order.buildingNumber'),filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true},
    {field: 'shape',width: 150, title: t('order.shape'),filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true},
    {field: 'area',width: 150, title: t('order.grossArea'),filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true},
    {field: 'Label type',width: 150, title: '印标',filters:[{ data: '' }],},
  ],//表头参数
  data:null,//表格数据
  toolbarConfig: {
@@ -73,19 +55,73 @@
  },

})
let emit = defineEmits([
  'changeDialog'
])
let ProjectName = ref('')
const changeOrderType = async ()=>{
  await emit('changeDialog',ProjectName.value)
  ProjectName.value = null
}

// 通过props接收父组件传递过来的流程卡号（processId）
const props = defineProps({
  processCardNumbers: String
});

// 用于记录当前显示的流程卡号在数组中的索引位置，初始值为0，即显示第一个元素
const currentIndex = ref(0);

const selectComputeDetail = async () => {
  let processId;
  if (typeof props.processCardNumbers === 'string') {
    processId = props.processCardNumbers;
  } else if (Array.isArray(props.processCardNumbers)) {
    if (props.processCardNumbers.length > 0) {
      processId = props.processCardNumbers[currentIndex.value];
    } else {
      console.error('流程卡号数组不符合预期或者索引超出范围，无法发起请求');
      ElMessage.error('没有有效的流程卡号数据，请检查数据来源');
      return;
    }
  } else {
    console.error('接收到的流程卡号数据类型不符合预期，无法进行后续操作');
    ElMessage.error('接收到的流程卡号数据格式不正确，请检查数据来源');
    return;
  }
  try {
    const res = await request.post(`/glassOptimize/selectComputeDetail/${processId}`);
    if ((Number(res.code) === 200)) {
      xGrid.value.loadData(res.data.data);
    } else {
      ElMessage.warning(res.msg);
      console.error('请求获取流程卡详情失败，状态码：', res.code, '，错误信息：', res.msg);
    }
  } catch (error) {
    console.error('调用loadData方法加载数据时出现错误:', error);
    ElMessage.error('加载表格数据时发生错误，请检查相关代码或联系开发人员');
  }
};

// 新增函数用于点击按钮时更新当前显示的流程卡号索引位置，实现切换显示下一个或上一个流程卡号
const handleChangeProcessCard = (step) => {
  if (Array.isArray(props.processCardNumbers)) {
    if (step > 0 && currentIndex.value < props.processCardNumbers.length - 1) {
      currentIndex.value++;
    } else if (step < 0 && currentIndex.value > 0) {
      currentIndex.value--;
    } else {
      if (step > 0) {
        ElMessage.warning('已经是最后一个流程卡号');
      } else {
        ElMessage.warning('已经是第一个流程卡号');
      }
    }
  }
};

</script>

<template>
  <div style="width: 100%;height: 100%">
    <span>流程卡详情</span>
    <span>流程卡详情
      <el-input style="width: 180px"  :value="props.processCardNumbers[currentIndex]"></el-input>
      <el-button type="danger" style="margin-left: 10px" @click="handleChangeProcessCard(-1)" :icon="Minus"></el-button>
      <el-button type="primary" style="margin-left: 10px" @click="handleChangeProcessCard(1)" :icon="Plus"></el-button>
    <el-button  type="success" style="margin-left: 10px;" @click="selectComputeDetail" :icon="Search">查看</el-button>
    </span>
    <vxe-grid
        size="small"
        @filter-change="filterChanged"

 north-glass-erp/src/main/java/com/example/erp/controller/pp/GlassOptimizeController.java

@@ -76,4 +76,13 @@
        return Result.seccess(glassOptimizeService.selectProjectComputeSv(projectNumber));
    }

    //模拟计算流程卡详情
    //模拟计算工程号查询
    @ApiOperation("模拟计算工程号查询")
    @PostMapping  ("/selectComputeDetail/{processId}")
    public Result selectComputeDetail(
            @PathVariable String processId){
        return Result.seccess(glassOptimizeService.selectComputeDetailSv(processId));
    }

}

 north-glass-erp/src/main/java/com/example/erp/mapper/pp/GlassOptimizeMapper.java

@@ -30,4 +30,7 @@

    //模拟计算工程号查询
    List<Map<String, Object>> selectProjectComputeMp(@Param("projectNo")String projectNumber);

    //模拟计算流程卡详情
    List<Map<String, Object>> selectComputeDetailMp(String processId);
}

 north-glass-erp/src/main/java/com/example/erp/service/pp/GlassOptimizeService.java

@@ -64,4 +64,11 @@
        return map;
    }

    //模拟计算流程卡详情
    public Map<String, Object>selectComputeDetailSv(String processId) {
        Map<String, Object> map = new HashMap<>();
        map.put("data", glassOptimizeMapper.selectComputeDetailMp(processId));
        return map;
    }

}

 north-glass-erp/src/main/resources/mapper/pp/GlassOptimize.xml

@@ -212,7 +212,7 @@
            p.project_no
    </select>

    <!--模拟计算查询-->
    <!--模拟计算查询流程卡-->
    <select id="selectProjectComputeMp">
        SELECT
            fc.process_id,
@@ -251,4 +251,26 @@
            fc.process_id, fc.technology_number;
    </select>

    <!--模拟计算流程卡详情-->
    <select id="selectComputeDetailMp">
        SELECT
            d.width AS width,
            d.height AS height,
            f.quantity AS quantity,
            d.building_number AS `Storey Number`,
            d.shape AS shape,
            round(g.area * f.quantity, 4) AS area,
            g.icon AS `Label type`
        FROM
            pp.flow_card f
                LEFT JOIN pp.optimize_project p ON f.project_no = p.project_no
                LEFT JOIN sd.order o ON f.order_id = o.order_id
                LEFT JOIN sd.order_detail d ON f.order_id = d.order_id AND f.order_number = d.order_number
                LEFT JOIN sd.order_glass_detail g ON f.order_id = g.order_id AND f.order_number = g.order_number AND f.technology_number = g.technology_number
                LEFT JOIN sd.product_detail p2 ON d.product_id = p2.prod_id AND f.technology_number = p2.glass_sort
                LEFT JOIN pp.optimize_project j ON f.project_no = j.project_no
        WHERE
            p.state IN (1, 2)
          AND f.process_id = #{processId}
    </select>
</mapper>