优化

src/view/yunyin/shengchanguanli/yuedudahuoshengchanjindu.vue

@@ -3,33 +3,21 @@
 	  <layout>
 		<layout-header>
 		  <div class="">
-			<!--          按钮部分-->
+			<!--按钮部分-->
 			<el-form ref="elSearchFormRef"   class="demo-form-inline" :rules="searchRule" @keyup.enter="onSubmit()">
 			  <el-form-item>
 				<el-input v-model="searchInfo" placeholder="搜索" style="width: 180px;"></el-input>
 				<el-button type="primary" icon="search" @click="onSubmit" >查询</el-button>
-				<!-- <div style="margin-left: auto"> -->
-				  <el-button
-				    type="primary"
-				    class="bt"
-				    icon="download"
-				    @click="exportToExcel2"
-				    >导出到Excel</el-button
-				  >
-				<!-- </div>	 -->
-				<!-- <el-button type="primary" icon="edit"   @click="gd_gxclhconClick"  class="bt" title="修改">修改</el-button> -->
-			  </el-form-item>
+				</el-form-item>
 			</el-form>
 		  </div>
-
 		</layout-header>
   
 		<layout>
-		  <!--    左侧树侧形结构-->
-		  <layout-sider :resize-directions="['right']" :width="190" style="margin-right: 10px;">
+		  <!--左侧树侧形结构-->
+		  <layout-sider :resize-directions="['right']" :width="215" style="margin-right: 10px;">
 			<div class="JKWTree-tree" style="height: 200px">
 			  <h3>选择客户</h3>
-			  <!-- <el-tree :data="treeData"  :props="defaultProps" @node-click="handleNodeClick" @node-expand="handleNodeExpand"> -->
 			  <el-tree :data="treeData" @node-click="handleNodeClick" class="treecolor">
 			  </el-tree>
 			</div>
@@ -39,37 +27,30 @@
 		  <layout-content >
 		  <el-main>
 			<div class="gva-table-box">
-			  <!-- 表格数据 -->
 			  <el-table ref="multipleTable" style="width: 100%;height: 65vh" tooltip-effect="dark"
 						:row-style="{ height: '25px' }"  :header-cell-style="{ padding: '0px' }"
 						:cell-style="{ padding: '0px' }" :header-row-style="{ height: '20px' }"
-						:data="tableData"  border row-key="ID"
-						size="small" id="tab"
-						:cell-class-name="gxbgCellClass"
-						highlight-current-row="true" @row-dblclick="updateCompanyFunc"
-						@row-click="tableRowClick" :show-overflow-tooltip="true"
-						@selection-change="handleSelectionChange">
-						<el-table-column  sortable align="left" label="订单编号" prop="订单编号"  width="120" />
-						<el-table-column  sortable align="left" label="订单编号" prop="子订单编号"  width="120" />
-						<el-table-column  sortable align="left" label="款号" prop="款号"  width="100" />
-             			<el-table-column  sortable align="left" label="颜色" prop="颜色"  width="120" />
-			 			<el-table-column  sortable align="left" label="车缝" prop="车缝"  width="100" />
-			 			<el-table-column  sortable align="left" label="后道收样" prop="后道收样"  width="100" />
-			 			<el-table-column  sortable align="left" label="大烫" prop="大烫"  width="130" />
-			 			<el-table-column  sortable align="left" label="总检" prop="总检"  width="80" />
-			 			<el-table-column  sortable align="left" label="包装" prop="包装"  width="100" />
-			 			<el-table-column  sortable align="left" label="制单总数" prop="制单总数"  width="100" />
-			 			<el-table-column  sortable align="left" label="裁切总数" prop="裁切总数"  width="100" />	
-						<el-table-column  sortable align="left" label="上报时间" prop="sys_rq"  width="160" />
-						<el-table-column  sortable align="left" label="出库日期" prop="出库日期"  width="160" />
+						:data="tableData"  border row-key="ID" size="small" id="tab"
+						:cell-class-name="gxbgCellClass" highlight-current-row="true"
+						@row-dblclick="updateCompanyFunc" @row-click="tableRowClick" 
+						:show-overflow-tooltip="true" @selection-change="handleSelectionChange">
+						<el-table-column   align="left" label="订单编号" prop="订单编号"  width="100" />
+						<el-table-column   align="left" label="生产款号" prop="生产款号"  width="160" />
+						<el-table-column   align="left" label="款式" prop="款式"  width="160" />
+						<el-table-column   align="left" label="制单总数" prop="制单总数"  width="90" />
+						<el-table-column   align="left" label="裁剪完成数" prop="裁剪总数"  width="90" />	
+			 			<el-table-column   align="left" label="车缝完成数" prop="车缝"  width="90" />
+			 			<el-table-column   align="left" label="手工完成数" prop="手工"  width="90" />
+			 			<el-table-column   align="left" label="大烫完成数" prop="大烫"  width="90" />
+			 			<el-table-column   align="left" label="总检完成数" prop="总检"  width="90" />
+			 			<el-table-column   align="left" label="包装完成数" prop="包装"  width="90" />
+						<el-table-column   align="left" label="落货日期" prop="落货日期"  width="160" />
+			 			
 			  </el-table>
-  
 			  <!-- 分页 -->
 			  <div class="gva-pagination">
 				<el-pagination layout="total" :current-page="page" :page-size="pageSize"
 				 :total="total" @current-change="handleCurrentChange" @size-change="handleSizeChange" />
-  <!--              <el-pagination layout="total, sizes, prev, pager, next, jumper" :current-page="page" :page-size="pageSize" :page-sizes="[10, 30, 50, 100]"-->
-  <!--                             :total="total" @current-change="handleCurrentChange" @size-change="handleSizeChange" />-->
 			  </div>
 			</div>
   
@@ -83,381 +64,258 @@
 // 全量引入格式化工具 请按需保留
 import { Layout, LayoutSider, LayoutContent } from '@arco-design/web-vue';
 import {ref, reactive} from 'vue'
-import {dateList,OrderYieldList,Datalist} from '@/api/mes/job'
+import {dateList,OrderYieldList,Datalist,ProductInformation} from '@/api/mes/job'
 import * as XLSX from 'xlsx'
 import FileSaver from 'file-saver'
 import PrintPage from './components/print.vue'
 import {ElMessage} from "element-plus";
+import { useUserStore } from '@/pinia/modules/user';
 defineOptions({name: 'Company'})
+//获取登录用户信息
+const userStore = useUserStore()
+const _username = ref('')
+_username.value = userStore.userInfo.userName + '/' + userStore.userInfo.nickName
+console.log('获取用户名称',_username.value)
+//全局获取当前日期
+const today = new Date();
+const year = today.getFullYear();
+const month = String(today.getMonth() + 1).padStart(2, '0'); // 月份从 0 开始，需要补零
+const day = String(today.getDate()).padStart(2, '0');
+const hours = String(today.getHours()).padStart(2, '0');
+const minutes = String(today.getMinutes()).padStart(2, '0');
+const seconds = String(today.getSeconds()).padStart(2, '0');
+const currentDate = `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
+const currentDates = `${year}-${month}-${day}`;
+
 // =========== 获取左侧树侧形结构 ===========
 const treeData = ref([]);  
-const _department_code = ref(null)
+const _department_code = ref(null);
 const getDepartmentdata = async () => {  
   try {  
-	const Datalists = await Datalist();
-	Datalists.data.forEach(id => {
-	  treeData.value.push({  
-	    label: id,
-	  });  
-	}); 
-	// const dateList_list = await dateList();
-    // const { data } = dateList_list;  
-    // treeData.value = data.map(month => ({label: month })); // 假设每个节点有一个id和label  
-    // console.log(553, treeData.value);  
+    const response = await ProductInformation();
+    const data = response.data.data;
+    // 清空 treeData，防止重复添加
+    treeData.value = [];
+    // 获取年月和列表的并进行排序（从大到小）
+    const entries = Object.entries(data).sort((a, b) => b[0].localeCompare(a[0]));
+    // 遍历排序后的数据
+    entries.forEach(([yearMonth, code]) => {
+      // 创建每个月的节点
+      const monthNode = {
+        label: yearMonth,  // 年月作为一级节点
+        children: code.map(code => ({
+          label: code,  // 设备编号作为二级节点
+          parent: yearMonth // 记录父节点，即年份
+        }))
+      };
+      // 将该月的节点添加到 treeData 中
+      treeData.value.push(monthNode);
+    });
   } catch (error) {  
-    console.error(error);  
+    console.error('获取数据失败:', error);  
   }  
-};  
-  
+};
+
 getDepartmentdata();
+
   
-  //点击左侧树形 获取右侧table列表
-  //日期
-  let _ddrq = ref('');
-  //客户编号
-  const _khbh = ref(null);  
-  const tableData = reactive([]);
-  const handleNodeClick = async (node) => {
-	  // console.log(node)
-		// _ddrq.value = node.label.replace('-', '');
-		_khbh.value = node.label;
-  // 取消所有节点的颜色
-  const allNodes = document.querySelectorAll('.treecolor .el-tree-node');
-  allNodes.forEach(node => {
-    node.querySelector('.el-tree-node__label').style.color = '';
-  });
-  // 获取点击的节点
-  const clickedNodeId = node['$treeNodeId'];
-  const clickedNode = document.querySelector(`.treecolor .el-tree-node[data-key="${clickedNodeId}"]`);
-  if (clickedNode) {
-    // 给当前点击的节点改变颜色
-    clickedNode.querySelector('.el-tree-node__label').style.color = 'red';
-  }
-	searchInfo.value = '';  // 清空搜索信息
-	_workOrderDetailList();  // 执行获取员工列表的函数
-  };
-  
-  //全局调用工单编号
-  const _Gd_gdbh = ref(null)
-  //全局调用印件代号
-  const _Gd_cpdh = ref(null)
-  //点击表格行
-  const tableRowClick = async (row) => {
-	console.log(row)
-  };
-  
+//点击左侧树形 获取右侧table列表
+let _ddrq = ref('');//日期
+const _khbh = ref('');
+const _riqi = ref(''); 
+const tableData = reactive([]);
   
-  // 搜索框
-  const searchInfo = ref('')
-  //查询
-  const onSubmit = () => {
-	if(searchInfo.value === ''){
-	  tableData.length = 0;
-	}else{
-		//调用查询接口
-	  _workOrderDetailList();
+//左侧点击事件
+const handleNodeClick = async (node) => {
+	// 取消所有节点的颜色
+	const allNodes = document.querySelectorAll('.treecolor .el-tree-node');
+	allNodes.forEach(node => {
+	node.querySelector('.el-tree-node__label').style.color = '';
+	});
+	// 获取点击的节点
+	const clickedNodeId = node['$treeNodeId'];
+	const clickedNode = document.querySelector(`.treecolor .el-tree-node[data-key="${clickedNodeId}"]`);
+	if (clickedNode) {
+	// 给当前点击的节点改变颜色
+	clickedNode.querySelector('.el-tree-node__label').style.color = 'red';
 	}
-  };
-  //查询接口
-  const _workOrderDetailList = async ()=>{
-  	const OrderYieldListtable = await OrderYieldList({client:_khbh.value,search:searchInfo.value});
-  	try {
-  		const workOrderDetaildata = OrderYieldListtable
-  		tableData.splice(0,tableData.length,...workOrderDetaildata.data);
-  	} catch (error) {
-  		console.error(error);
-  	}
-  }
-  
-  //导出到Excel
-  const exportToExcel2 = () => {
-      const el = document.getElementById("tab");
-      // 文件名
-      const filename = "导出到excel.xlsx";
-      const wb = XLSX.utils.table_to_book(el, { raw: true });
-      const wbout = XLSX.write(wb, {
-        bookType: "xlsx",
-        bookSST: true,
-        type: "array",
-      });
-      try {
-        FileSaver.saveAs(
-          new Blob([wbout], { type: "application/octet-stream" }),
-          filename
-        );
-      } catch (e) {
-        console.log(e);
-      }
-      return wbout;
-  };
+	searchInfo.value = '';  // 清空搜索信息
+	
+	// console.log(node.label);
+	  // 检查是否是最低级节点（即没有子节点）
+	  if (!node.children || node.children.length === 0) {
+		// 获取当前节点的上级节点
+		const parentNode = node.parent;
+		// 获取客户编号
+		_khbh.value = node.label[0].split('【')[0]; 
+		// 获取日期
+		if (parentNode) {
+		  _riqi.value = parentNode; // 父节点保存的是日期
+		}
+		
+	  }
+	_workOrderDetailList();
+};
 
+const _workOrderDetailList = async ()=>{
+	// console.log(_khbh.value);
+	// console.log(_riqi.value);
+	
+	if(_khbh.value === ''){return;}
+	
+	const OrderYieldListtable = await OrderYieldList({client:_khbh.value,search:searchInfo.value,date:_riqi.value});
+	tableData.splice(0,tableData.length,...OrderYieldListtable.data);
+}
+
+//全局调用工单编号
+const _Gd_gdbh = ref(null)
+//全局调用印件代号
+const _Gd_cpdh = ref(null)
+//点击表格行
+const tableRowClick = async (row) => {
+	console.log(row)
+};
   
-  // 分页相关的响应式变量
-  const page = ref(1)
-  const total = ref(0)
-  const pageSize = ref(10)
-  // 分页
-  const handleCurrentChange = (val) => {
-	page.value = val;
-	_getStaffList();
-  };
-  
-  // 修改页面容量 点击多少条/页
-  const handleSizeChange = (val) => {
-	page.value = 10;//默认显示
-	pageSize.value = val;
-	_getStaffList();
-  };
-  
-  // 弹窗控制标记
-  const dialogFormVisible = ref(false)
-  //修改
-  const formDataTest = ref({})
-  
-  
-  
-  
-  
-  
-  </script>
-  
-  <style scoped>
-  .form-container {
-	display: flex;
-	flex-wrap: wrap;
-  }
-  
-  .form-column {
-	/*flex: 1;*/
-	margin-right: 15px; /* 调整列之间的间距 */
-  }
-  
-  /* 左侧输入框宽度调整 */
-  .form-column .el-form-item .el-input {
-	width: 150px; /* 调整左侧输入框的宽度 */
-  }
-  
-  :deep(.hui-plan-usage-lows  div) {
-	color: #8c939d !important;
-  }
-  :deep(.lan-plan-usage-lows  div) {
-	color: blue !important;
-	font-weight: bold;
-  }
-  
-  
-  
-  /* :deep(.hui-plan-usage-lows.column-0  div) {
-	color: #8c939d !important;
-  }
-  :deep(.hui-plan-usage-lows.column-1  div) {
-	color: #8c939d !important;
-  }
-  :deep(.hui-plan-usage-lows.column-2  div) {
-	color: #8c939d !important;
-  }
-  :deep(.hui-plan-usage-lows.column-3  div) {
-	color: #8c939d !important;
-  }
-  :deep(.hui-plan-usage-lows.column-4  div) {
-	color: #8c939d !important;
-  }
-  :deep(.hui-plan-usage-lows.column-5  div) {
-	color: #8c939d !important;
-  }
-  :deep(.hui-plan-usage-lows.column-6  div) {
-	color: #8c939d !important;
-  }
-  :deep(.hui-plan-usage-lows.column-7  div) {
-	color: #8c939d !important;
-  }
-  :deep(.hui-plan-usage-lows.column-8  div) {
-	color: #8c939d !important;
-  }
-  :deep(.hui-plan-usage-lows.column-9  div) {
-	color: #8c939d !important;
-  }
-  :deep(.hui-plan-usage-lows.column-10  div) {
-	color: #8c939d !important;
-  }
-  :deep(.hui-plan-usage-lows.column-11  div) {
-	color: #8c939d !important;
-  }
-  :deep(.hui-plan-usage-lows.column-12 div) {
-	color: #8c939d !important;
-  }
-  :deep(.hui-plan-usage-lows.column-13 div) {
-	color: #8c939d !important;
-  }
-  :deep(.hui-plan-usage-lows.column-14 div) {
-	color: #8c939d !important;
-  }
-  :deep(.hui-plan-usage-lows.column-15 div) {
-	color: #8c939d !important;
-  }
-  :deep(.hui-plan-usage-lows.column-16 div) {
-	color: #8c939d !important;
-  }
-  :deep(.hui-plan-usage-lows.column-17 div) {
-	color: #8c939d !important;
-  }
-  
-  :deep(.lan-plan-usage-lows.column-0  div) {
-	color: blue !important;
-	font-weight: bold;
-  }
-  :deep(.lan-plan-usage-lows.column-1  div) {
-	color: blue !important;
-	font-weight: bold;
-  }
-  :deep(.lan-plan-usage-lows.column-2  div) {
-	color: blue !important;
-	font-weight: bold;
-  }
-  :deep(.lan-plan-usage-lows.column-3  div) {
-	color: blue !important;
-	font-weight: bold;
-  }
-  :deep(.lan-plan-usage-lows.column-4  div) {
-	color: blue !important;
-	font-weight: bold;
-  }
-  :deep(.lan-plan-usage-lows.column-5  div) {
-	color: blue !important;
-	font-weight: bold;
-  }
-  :deep(.lan-plan-usage-lows.column-6  div) {
-	color: blue !important;
-	font-weight: bold;
-  }
-  :deep(.lan-plan-usage-lows.column-7  div) {
-	color: blue !important;
-	font-weight: bold;
-  }
-  :deep(.lan-plan-usage-lows.column-8  div) {
-	color: blue !important;
-	font-weight: bold;
-  }
-  :deep(.lan-plan-usage-lows.column-9  div) {
-	color: blue !important;
-	font-weight: bold;
-  }
-  :deep(.lan-plan-usage-lows.column-10  div) {
-	color: blue !important;
-	font-weight: bold;
-  }
-  :deep(.lan-plan-usage-lows.column-11  div) {
-	color: blue !important;
-	font-weight: bold;
-  }
-  :deep(.lan-plan-usage-lows.column-12  div) {
-	color: blue !important;
-	font-weight: bold;
-  }
-  :deep(.lan-plan-usage-lows.column-13  div) {
-	color: blue !important;
-	font-weight: bold;
-  }
-  :deep(.lan-plan-usage-lows.column-14  div) {
-	color: blue !important;
-	font-weight: bold;
-  }
-  :deep(.lan-plan-usage-lows.column-15  div) {
-	color: blue !important;
-	font-weight: bold;
-  }
-  :deep(.lan-plan-usage-lows.column-16  div) {
-	color: blue !important;
-	font-weight: bold;
-  }
-  :deep(.lan-plan-usage-lows.column-17  div) {
-	color: blue !important;
-	font-weight: bold;
-  } */
   
-  /* 媒体查询，根据需要调整断点 */
-  @media screen and (max-width: 768px) {
-	.form-column {
-	  flex: 1 0 100%; /* 在小屏幕下变成单列布局 */
-	  margin-right: 0;
-	}
-  }
-  /*:deep(.el-table td .cell) {*/
-  /*  line-height: 30px !important;*/
-  /*}*/
-  .JKWTree-container {
-	display: flex;
-  }
-  .JKWTree-tree {
-	/*width: 300px;*/
-	background-color: #fff;
-	padding: 10px;
-	margin-right: 20px;
-  }
-  .JKWTree-tree h3 {
-	font-size: 15px;
-	font-weight: 700;
-	margin: 10px 0;
-  }
-  .JKWTree-content {
-	flex: 1;
-  }
-  /* 图片上传 */
-  .upload-box {
-	width: 200px;
-	height: 200px;
-	border: 2px dashed #e2e2e2;
-	display: flex;
-	justify-content: center;
-	align-items: center;
-	position: relative;
-	cursor: pointer;
-  }
-  .uploaded-image {
-	width: 100%;
-	height: 100%;
-	object-fit: cover;
-  }
-  .upload-icon {
-	font-size: 40px;
-	color: #c0c4cc;
-  }
-  .file-input {
-	display: none;
-  }
-  .el-table .warning-row {
-	background: oldlace;
-  }
+// 搜索框
+const searchInfo = ref('')
+//查询
+const onSubmit = () => {
+if(searchInfo.value === ''){
+  tableData.length = 0;
+}else{
+	//调用查询接口
+  _workOrderDetailList();
+}
+};
+
   
-  /* 选中某行时的背景色 */
-  :deep(.el-table__body tr.current-row) > td {
-	background: #ff80ff !important;
-  }
-  </style>
-  <style scoped>
-  :deep(.el-table td .cell) {
-	line-height: 20px !important;
-  }
-  :deep(.el-tabs__header){
-	margin-bottom: 0;
-  }
-  .search{
-	margin-left: 0px !important;
-	margin-right: 10px !important;
-  }
-  .bt{
-	margin-left: 2px !important;
-	padding: 3px !important;
-	font-size: 12px;
-  }
-  .el-tabs__header{
-	margin: 0px !important;
-  }
-  .gva-table-box{
-	padding: 0px !important;
-  }
-  .mab{
-	margin-bottom: 5px;
-  }
-  </style>
+// 分页相关的响应式变量
+const page = ref(1)
+const total = ref(0)
+const pageSize = ref(10)
+// 分页
+const handleCurrentChange = (val) => {
+page.value = val;
+_getStaffList();
+};
+
+// 修改页面容量 点击多少条/页
+const handleSizeChange = (val) => {
+page.value = 10;//默认显示
+pageSize.value = val;
+_getStaffList();
+};
+
+// 弹窗控制标记
+const dialogFormVisible = ref(false)
+//修改
+const formDataTest = ref({})
+</script>
+<style scoped>
+.form-container {
+display: flex;
+flex-wrap: wrap;
+}
+
+.form-column {
+/*flex: 1;*/
+margin-right: 15px; /* 调整列之间的间距 */
+}
+
+/* 左侧输入框宽度调整 */
+.form-column .el-form-item .el-input {
+width: 150px; /* 调整左侧输入框的宽度 */
+}
+
+:deep(.hui-plan-usage-lows  div) {
+color: #8c939d !important;
+}
+:deep(.lan-plan-usage-lows  div) {
+color: blue !important;
+font-weight: bold;
+}
+
+/* 媒体查询，根据需要调整断点 */
+@media screen and (max-width: 768px) {
+.form-column {
+  flex: 1 0 100%; /* 在小屏幕下变成单列布局 */
+  margin-right: 0;
+}
+}
+.JKWTree-container {
+display: flex;
+}
+.JKWTree-tree {
+/*width: 300px;*/
+background-color: #fff;
+padding: 10px;
+margin-right: 20px;
+}
+.JKWTree-tree h3 {
+font-size: 15px;
+font-weight: 700;
+margin: 10px 0;
+}
+.JKWTree-content {
+flex: 1;
+}
+/* 图片上传 */
+.upload-box {
+width: 200px;
+height: 200px;
+border: 2px dashed #e2e2e2;
+display: flex;
+justify-content: center;
+align-items: center;
+position: relative;
+cursor: pointer;
+}
+.uploaded-image {
+width: 100%;
+height: 100%;
+object-fit: cover;
+}
+.upload-icon {
+font-size: 40px;
+color: #c0c4cc;
+}
+.file-input {
+display: none;
+}
+.el-table .warning-row {
+background: oldlace;
+}
+
+/* 选中某行时的背景色 */
+:deep(.el-table__body tr.current-row) > td {
+background: #ff80ff !important;
+}
+</style>
+<style scoped>
+:deep(.el-table td .cell) {
+line-height: 20px !important;
+}
+:deep(.el-tabs__header){
+margin-bottom: 0;
+}
+.search{
+margin-left: 0px !important;
+margin-right: 10px !important;
+}
+.bt{
+margin-left: 2px !important;
+padding: 3px !important;
+font-size: 12px;
+}
+.el-tabs__header{
+margin: 0px !important;
+}
+.gva-table-box{
+padding: 0px !important;
+}
+.mab{
+margin-bottom: 5px;
+}
+</style>