index.vue 29 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794
  1. <template>
  2. <div>
  3. <layout>
  4. <layout-header>
  5. <div class="">
  6. <!--按钮部分-->
  7. <el-form ref="elSearchFormRef" inline class="demo-form-inline" @submit.native.prevent>
  8. <el-form-item>
  9. <el-input v-model="searchInfo" placeholder="搜索工单编号或产品名称 " clearable style="width: 180px"/>
  10. <el-button type="primary" icon="search" class="search" @click="handleSearch"/>
  11. <el-button type="primary"icon="edit"class="bt"@click=" () => { dialogDetail = true; } "><i class="el-icon-edit" />查改</el-button>
  12. <!--<el-button type="primary" disabled icon="edit" @click="" style="margin-left: 10px">工艺方案复制</el-button>-->
  13. <el-button type="primary" icon="edit" class="bt" @click=" () => { dialogGdcjstj = true; }">工单超节损统计</el-button>
  14. <el-button type="primary" icon="edit" class="bt" @click=" () => { dialogKhsz = true}">考核设置</el-button>
  15. <el-button type="primary" icon="edit" class="bt"@click=" () => { dialogXzgdtl = true; }">修正工单投料</el-button>
  16. <el-button type="primary" icon="edit" class="bt"@click=" () => { dialogGxclhc = true;}">工序产量核查</el-button>
  17. <el-button type="primary"icon="edit"class="bt"@click="() => {dialogGdzjfptj = true;}">工单质检废品统计</el-button>
  18. <el-button type="primary" icon="edit" class="bt"@click="() => {dialogHjfpfb = true;}">核检废品分布</el-button>
  19. <el-button type="primary" icon="edit" class="bt"@click="handleGddy">工单打印</el-button>
  20. <el-button type="primary" icon="edit" class="bt" @click="() => { pd_lcdlist = true; pd_lcdProductValue();}">流程单查询</el-button>
  21. <el-button type="primary" icon="edit" class="bt" @click="exportExcel">导出Excel</el-button>
  22. <el-button type="primary" icon="edit" class="bt" @click="ygdy">超节损员工打印</el-button>
  23. </el-form-item>
  24. </el-form>
  25. <!-- 弹窗 -->
  26. <div>
  27. <!-- 查改 -->
  28. <Detail v-if="dialogDetail" :is-show="dialogDetail" :gdbh="gdbh"
  29. :yjno="yjno"
  30. @destroy="() => {dialogDetail = false;}"/>
  31. <!-- 工单超节损统计 -->
  32. <el-dialog v-model="dialogGdcjstj" title="工单超节损统计" destroy-on-close >
  33. <Gdcjstj :gdbh="gdbh" :yjno ="yjno" />
  34. </el-dialog>
  35. <!-- 员工打印 -->
  36. <el-dialog v-model="dialogygdy" title="员工打印" destroy-on-close style="height: 40%;">
  37. <el-date-picker
  38. v-model="ygdy_formData['ygriqi']"
  39. type="month"
  40. placeholder="选择年月"
  41. :default-value="new Date()"
  42. style="width: 500px"
  43. />
  44. <el-button type="primary" icon="edit" class="bt" @click="onclick_ygdy">按员工打印</el-button>
  45. </el-dialog>
  46. <!-- 修正工单印件质量考核设置 -->
  47. <Khsz v-if="dialogKhsz" v-model="dialogKhsz" :gdbh="gdbh" :yjno="yjno" />
  48. <!-- 修正工单投料 -->
  49. <Xzgdtl v-if="dialogXzgdtl" v-model="dialogXzgdtl" @update-data = "exitXzgdtl" :gdbh="gdbh" :yjno="yjno"/>
  50. <!-- 工序产量核查 -->
  51. <Gxclhc v-if="dialogGxclhc" v-model="dialogGxclhc"
  52. :gdbh="gdbh" :jjcp_yjno = "jjcp_yjno"
  53. />
  54. <!-- 工单质检废品统计 -->
  55. <Gongdanzhijianfeipintongji
  56. v-if="dialogGdzjfptj"
  57. v-model="dialogGdzjfptj"
  58. :val="gdbh"
  59. />
  60. <!-- 核检废品分布 -->
  61. <Hjfpfb
  62. v-if="dialogHjfpfb"
  63. v-model="dialogHjfpfb"
  64. :val="gdbh"
  65. :jjcp_yjno="jjcp_yjno"
  66. />
  67. <!-- 工单打印 -->
  68. <PrintPage ref="printPageRef" />
  69. <!--流程单查询【弹窗】-->
  70. <el-dialog v-model="pd_lcdlist" title="工单工序生产进程" fullscreen>
  71. <div style="width: 100%; height: 100%">
  72. <el-button type="" @click=" () => {pd_lcdlist = false;}">退出</el-button>
  73. </div>
  74. <div style=" width: 100%; height: 100%; display: flex; align-items: center;">
  75. <el-form-item label="工单编号" style="margin-right: 20px; padding: 0">
  76. <el-input v-model="pd_lcdformData['gdbh']" @keyup.enter="pd_lcdProductValue" placeholder="Enter回车"/>
  77. </el-form-item>
  78. <el-form-item label="" style="margin-right: 5px; padding: 0">
  79. <el-input v-model="pd_lcdformData['code']" disabled/>
  80. </el-form-item>
  81. <el-form-item label="" style="margin-right: 5px; padding: 0">
  82. <el-input v-model="pd_lcdformData['name']" disabled style="width: 500px" />
  83. </el-form-item>
  84. </div>
  85. <div style="width: 100%; height: 70vh; display: flex">
  86. <layout>
  87. <layout-sider
  88. :resize-directions="['right']"
  89. :width="240"
  90. style="margin-right: 10px; height: 70vh"
  91. >
  92. <div class="JKWTree-tree">
  93. <el-tree
  94. :data="pd_lcd_treeData"
  95. default-expand-all
  96. @node-click="pd_lcd_handleNodeClick"
  97. />
  98. </div>
  99. </layout-sider>
  100. <layout-main>
  101. <!-- 这里放右侧的内容 -->
  102. <el-space wrap>
  103. <!-- 右侧内容 -->
  104. <template v-for="item in processList.total_process">
  105. <el-button
  106. disabled
  107. :type="
  108. !processList.process.includes(item)
  109. ? 'danger'
  110. : 'info'
  111. "
  112. plain
  113. style="width: 50px"
  114. >{{ item }}</el-button>
  115. </template>
  116. </el-space>
  117. </layout-main>
  118. </layout>
  119. </div>
  120. </el-dialog>
  121. </div>
  122. </div>
  123. </layout-header>
  124. <layout>
  125. <!-- 左侧树侧形结构-->
  126. <layout-sider
  127. :resize-directions="['right']"
  128. :width="190"
  129. style="margin-right: 10px"
  130. >
  131. <div class="JKWTree-tree" style="height: 70vh" >
  132. <h3>工单超节损核算</h3>
  133. <el-tree :data="treeData" highlight-current @node-click="handleNodeClick"/>
  134. </div>
  135. </layout-sider>
  136. <!-- 右侧内容区域 -->
  137. <layout-content>
  138. <!-- 上方列表 -->
  139. <div class="gva-table-box">
  140. <el-table
  141. style="width: 100%; height: 30vh"
  142. :data="tableData1"
  143. row-key="ID"
  144. highlight-current-row
  145. border
  146. :row-class-name="rowClassName"
  147. :cell-class-name="cellClassName"
  148. :row-style="{ height: '20px' }"
  149. :cell-style="{ padding: '0px' }"
  150. :header-row-style="{ height: '20px' }"
  151. :header-cell-style="{ padding: '0px' }"
  152. @row-click="showOrderSuperLossGy"
  153. @current-change="
  154. (row, oldRow) => {
  155. currentRow = row;
  156. }
  157. "
  158. >
  159. <el-table-column
  160. type="selection"
  161. width="55"
  162. />
  163. <!-- 使用 v-for 循环渲染每一列 -->
  164. <el-table-column
  165. v-for="column in tableCols1"
  166. :key="column.prop"
  167. :prop="column.prop"
  168. :label="column.label"
  169. :width="column.width"
  170. :align='column.left'
  171. :fixed='column.fixed'
  172. :sortable="column.sortable"
  173. show-overflow-tooltip="true"
  174. sortable
  175. />
  176. </el-table>
  177. </div>
  178. <!-- 下方表格 -->
  179. <el-table
  180. style="width: 100%; height: 40vh"
  181. row-key="ID"
  182. highlight-current-row
  183. border
  184. :data="tableData2"
  185. :row-style="{ height: '20px' }"
  186. :cell-style="{ padding: '0px' }"
  187. :header-row-style="{ height: '20px' }"
  188. :header-cell-style="{ padding: '0px' }"
  189. >
  190. <el-table-column
  191. type="selection"
  192. width="55"
  193. />
  194. <!-- 使用 v-for 循环渲染每一列 -->
  195. <el-table-column
  196. v-for="column in tableCols2"
  197. :key="column.prop"
  198. :prop="column.prop"
  199. :label="column.label"
  200. :width="column.width"
  201. show-overflow-tooltip="true"
  202. sortable
  203. />
  204. </el-table>
  205. </layout-content>
  206. </layout>
  207. </layout>
  208. </div>
  209. </template>
  210. <script>
  211. import service from '@/utils/request'
  212. import { writeXLSX } from 'xlsx'
  213. // 5.1流程单查询-工单工序生产进程菜单栏
  214. export const getOrderProcessLeft = (params) => {
  215. return service({
  216. url: '/mes_server/work_order_verification/getOrderProcessLeft',
  217. method: 'get',
  218. params,
  219. })
  220. }
  221. // 5.2流程单查询-获取工单工序生产进程右侧
  222. export const getOrderProcessRight = (params) => {
  223. return service({
  224. url: '/mes_server/work_order_verification/getOrderProcessRight',
  225. method: 'get',
  226. params,
  227. })
  228. }
  229. </script>
  230. <script setup>
  231. import {
  232. Layout,
  233. LayoutContent,
  234. LayoutHeader,
  235. LayoutSider,
  236. } from '@arco-design/web-vue'
  237. import { ref, watch } from 'vue'
  238. import {
  239. getOrderSuperLossGy,
  240. getSide,
  241. EmployeeDataCollect,
  242. getTable,
  243. } from '@/api/mes_api_gty/orderAccounting'
  244. import Khsz from '@/view/performance/12-orderAccounting/componets/khsz.vue'
  245. import {hiprint} from "vue-plugin-hiprint";
  246. import Gdcjstj from '@/view/performance/12-orderAccounting/componets/gdcjstj.vue'
  247. import Xzgdtl from '@/view/performance/12-orderAccounting/componets/xzgdtl.vue'
  248. import Gxclhc from '@/view/performance/12-orderAccounting/componets/gxclhc.vue'
  249. import Gongdanzhijianfeipintongji from '@/view/performance/09-workOrderVerification/componets/gongdanzhijianfeipintongji.vue'
  250. import Detail from '@/view/performance/12-orderAccounting/componets/detail.vue'
  251. import Hjfpfb from './componets/hjfpfb.vue'
  252. import PrintPage from '@/view/yunyin/shengchanguanli/components/print.vue'
  253. import { reactive } from 'vue'
  254. import { exportExcelFile } from '@/utils/excel'
  255. import { useUserStore } from '@/pinia/modules/user'
  256. const userStore = useUserStore()
  257. const sys_id =
  258. '[' + userStore.userInfo.userName + '/' + userStore.userInfo.nickName + ']'
  259. // 弹窗
  260. const dialogGdcjstj = ref(false)
  261. const dialogDetail = ref(false)
  262. const dialogKhsz = ref(false)
  263. const dialogXzgdtl = ref(false)
  264. const dialogGxclhc = ref(false)
  265. const dialogGdzjfptj = ref(false)
  266. const dialogHjfpfb = ref(false)
  267. // 侧边栏数据
  268. const treeData = ref([])
  269. const getSideData = async() => {
  270. const res = await getSide()
  271. if (res.code === 0) {
  272. const { data } = res
  273. const transformedData = []
  274. for (const [key, value] of Object.entries(data)) {
  275. const [date, total] = key.split('-') // 提取日期和数量
  276. const transformedItem = {
  277. label: `${date}(工单数:${total})`,
  278. date: date,
  279. children: value.map((item) => ({
  280. label: `${item['客户编号']}【${item['客户名称']}】(工单数:${item.total})`,
  281. date: date,
  282. code: item?.['客户编号'],
  283. })),
  284. }
  285. transformedData.push(transformedItem)
  286. }
  287. treeData.value = transformedData
  288. }
  289. }
  290. getSideData()
  291. // 表格数据
  292. const tableCols1 = [
  293. // { label: '超损工单', prop: 'csgd', width: '110' ,sortable:'sortable'},
  294. { label: '工单编号', prop: 'Gd_gdbh', width: '110',sortable:'sortable',fixed:'fixed',align:'left'},
  295. { label: '印件号', prop: 'jjcp_yjno', width: '95' ,sortable:'sortable'},
  296. { label: '联数', prop: 'yj_ls', width: '80' ,sortable:'sortable'},
  297. { label: '产品代号', prop: '成品编码', width: '120' ,sortable:'sortable'},
  298. { label: '产品名称', prop: '成品名称', width: '250' ,sortable:'sortable'},
  299. { label: '实际投料', prop: '实际投料', width: '115' ,sortable:'sortable'},
  300. { label: '计量单位', prop: '计量单位', width: '115' ,sortable:'sortable'},
  301. { label: '入仓日期', prop: 'warehousing_date', width: '110' ,sortable:'sortable'},
  302. { label: '入仓数量', prop: 'warehousing_num', width: '110' ,sortable:'sortable'},
  303. { label: '目标合格率', prop: 'target_rate', width: '120' ,sortable:'sortable'},
  304. { label: '实际合格率', prop: 'real_rate', width: '120' ,sortable:'sortable'},
  305. { label: '奖惩系数', prop: 'reward_rate', width: '110' ,sortable:'sortable'},
  306. { label: '奖罚金额合计', prop: 'reward_money', width: '140',sortable:'sortable' },
  307. { label: '废品合计', prop: '废品合计', width: '120' ,sortable:'sortable'},
  308. { label: '工单无形损', prop: '工单无形损', width: '120',sortable:'sortable' },
  309. { label: '材料废', prop: '材料废', width: '120' ,sortable:'sortable'},
  310. { label: '零头处理', prop: '零头处理', width: '120',sortable:'sortable' },
  311. { label: '处发废', prop: '外发废', width: '120',sortable:'sortable' },
  312. { label: '外摊废', prop: '分摊废', width: '120' ,sortable:'sortable'},
  313. { label: '工单计划损耗', prop: '工单计划损耗', width: '140',sortable:'sortable' },
  314. { label: '工单制程废', prop: 'zcfp', width: '120',sortable:'sortable' },
  315. { label: '工单检验废', prop: '工单质检废', width: '120',sortable:'sortable' },
  316. { label: '年月', prop: 'date', width: '120' ,sortable:'sortable'},
  317. ]
  318. const tableCols2 = [
  319. { label: '工单编号', prop: 'Gy0_gdbh', width: '120' },
  320. { label: '印件及工序', prop: 'Gy0_yjno', width: '120' },
  321. { label: '工序名称', prop: 'Gy0_gxmc', width: '200' },
  322. { label: '联数', prop: 'Gy0_ls', width: '80' },
  323. { label: '基础损耗', prop: 'Gy0_Rate0', width: '120' },
  324. { label: '损耗率', prop: 'Gy0_Rate1', width: '120' },
  325. { label: '损耗系数', prop: '损耗系数', width: '120' },
  326. { label: '计损色数', prop: 'Gy0_ms', width: '120' },
  327. { label: '计划产量', prop: 'Gy0_计划接货数', width: '120' },
  328. { label: '计划损耗', prop: 'Gy0_计划损耗', width: '120' },
  329. { label: '上报产量', prop: 'total_cl', width: '120' },
  330. { label: '制程废', prop: 'total_fp', width: '120' },
  331. ]
  332. const tableData1 = ref([])
  333. const tableData2 = ref([])
  334. const currentRow = ref({})
  335. const gdbh = ref('')
  336. const jjcp_yjno = ref('')
  337. const date = ref('')
  338. const yjno = ref ('')
  339. const searchInfo = ref('')
  340. watch(currentRow, (value, oldValue, onCleanup) => {
  341. gdbh.value = value?.['Gd_gdbh']
  342. date.value = value?.['date']
  343. yjno.value = value?.['yj_Yjno']
  344. jjcp_yjno.value = value?.['jjcp_yjno']
  345. pd_lcdformData['gdbh'] = value?.['Gd_gdbh']
  346. })
  347. const cjsriqi = ref ('')
  348. // 显示上方表格
  349. const handleNodeClick = async(node) => {
  350. // console.log(node.date)
  351. cjsriqi.value = node.date
  352. console.log(cjsriqi.value)
  353. if (!node.children) {
  354. const { date, code } = node
  355. const res = await getTable({ date, code, limit: 9999, page: 1 })
  356. tableData1.value = res.data.data.map((item) => ({
  357. ...item,
  358. csgd:
  359. parseFloat(item['target_rate']) - parseFloat(item['real_rate']) > 0
  360. ? '√'
  361. : '',
  362. date: date,
  363. }))
  364. // console.log(tableData1.value )
  365. } else {
  366. // console.log(node.date, node.code)
  367. }
  368. }
  369. // 显示下方表格
  370. const showOrderSuperLossGy = async() => {
  371. jjcp_yjno.value = currentRow.value['jjcp_yjno']
  372. const { Gd_gdbh: order } = currentRow.value
  373. const yjno = jjcp_yjno.value
  374. console.log(yjno)
  375. const res = await getOrderSuperLossGy({ order,yjno })
  376. if (res.code === 0) {
  377. const { data } = res
  378. tableData2.value = data.map((item) => ({
  379. ...item,
  380. Gy0_yjno: `${item.Gy0_yjno}-${item.Gy0_gxh}`,
  381. Gy0_gxmc:
  382. item.Add_gxmc === ''
  383. ? item.Gy0_gxmc
  384. : `${item.Gy0_gxmc}〖${item.Add_gxmc}〗`,
  385. }))
  386. }
  387. }
  388. // 定位
  389. const handleSearch = async() => {
  390. console.log(searchInfo.value)
  391. //调用搜索接口
  392. const res = await getTable({ search:searchInfo.value,limit:999,page:1})
  393. console.log(res)
  394. tableData1.value = res.data.data.map((item) => ({
  395. ...item,
  396. csgd:
  397. parseFloat(item['target_rate']) - parseFloat(item['real_rate']) > 0
  398. ? '√'
  399. : '',
  400. date: date,
  401. }))
  402. // if (searchInfo.value) {
  403. // tableData1.value = tableData1.value.filter((item) => {
  404. // return item['Gd_gdbh'] === searchInfo.value ?? item
  405. // })
  406. // }
  407. }
  408. /* const rowClassName = ({ row, rowIndex }) => {
  409. if (row['csgd'] === '√') {
  410. return 'yellow-row'
  411. }
  412. return ''
  413. }*/
  414. function cellClassName({ row, column, rowIndex, columnIndex }) {
  415. if ([7, 11, 13, 21].includes(columnIndex)) {
  416. return 'red-cell'
  417. }
  418. return ''
  419. }
  420. const printPageRef = ref()
  421. function handleGddy() {
  422. printPageRef.value.open(gdbh.value)
  423. }
  424. const pd_lcdlist = ref(false)
  425. const processList = ref([])
  426. const pd_lcdformData = reactive({})
  427. const pd_lcdProductValue = async() => {
  428. _getOrderProcessLeft_list()
  429. }
  430. const pd_lcd_treeData = ref([])
  431. const _getOrderProcessLeft_list = async() => {
  432. const order = pd_lcdformData['gdbh']
  433. console.log(order)
  434. try {
  435. // 5.1流程单查询-工单工序生产进程菜单栏
  436. const getOrderProcessLeft_list = await getOrderProcessLeft({
  437. order: order,
  438. })
  439. console.log(getOrderProcessLeft_list)
  440. pd_lcdformData['code'] = getOrderProcessLeft_list.data.Gd_info['code']
  441. pd_lcdformData['name'] = getOrderProcessLeft_list.data.Gd_info['name']
  442. pd_lcd_treeData.value = [
  443. {
  444. label: order + '-' + getOrderProcessLeft_list.data.Gd_info['name'],
  445. // label: order + '-' + getOrderProcessLeft_list.data.Gd_info['code'] + '-' + getOrderProcessLeft_list.data.Gd_info['name'],
  446. value: undefined,
  447. children: [],
  448. },
  449. ]
  450. const newData = []
  451. for (const key in getOrderProcessLeft_list.data.Gy_info) {
  452. const temp = getOrderProcessLeft_list.data.Gy_info[key]
  453. const concatenatedValue = `${temp.Gy0_yjno}-${temp.Gy0_gxh} ---> ${temp.Gy0_gxmc}`
  454. newData.push({ label: concatenatedValue, value: temp.Gy0_gxh })
  455. }
  456. pd_lcd_treeData.value[0].children = newData
  457. // 5.2流程单查询-获取工单工序生产进程右侧【进入页面默认显示第一个】
  458. const getOrderProcessRight_list = await getOrderProcessRight({
  459. order: order,
  460. gxNo: newData[0].value,
  461. })
  462. processList.value = getOrderProcessRight_list.data
  463. } catch (error) {
  464. console.error(error)
  465. }
  466. }
  467. const pd_lcd_handleNodeClick = async(node) => {
  468. if (node.value === undefined) return
  469. const order = pd_lcdformData['gdbh']
  470. // //5.2流程单查询-获取工单工序生产进程右侧
  471. const getOrderProcessRight_list = await getOrderProcessRight({
  472. order: order,
  473. gxNo: node.value,
  474. })
  475. console.log(getOrderProcessRight_list)
  476. processList.value = getOrderProcessRight_list.data
  477. }
  478. // 导出excel
  479. const exportExcel = () => {
  480. const labels = tableCols1.map((item) => item.label)
  481. const props = tableCols1.map((item) => item.prop)
  482. const data = tableData1.value.map((item) => {
  483. const row = {}
  484. props.forEach((prop, index) => {
  485. row[labels[index]] = item?.[prop]
  486. })
  487. return row
  488. })
  489. if (data[0]?.[labels[0]] === undefined) {
  490. return
  491. }
  492. exportExcelFile(data)
  493. }
  494. // 员工打印
  495. // false是弹窗默认关闭
  496. const dialogygdy = ref(false)
  497. const ygdy_formData = reactive({
  498. ygriqi : '',
  499. })
  500. // 点击 超节损员工打印打开弹窗
  501. const ygdy = () => {
  502. dialogygdy.value = true
  503. }
  504. // json
  505. const jsondatas = {"panels":[{"index":0,"name":1,"paperType":"A4","height":210,"width":297,"paperHeader":76.5,"paperFooter":837,"printElements":[{"options":{"left":12,"top":9,"height":40,"width":40,"src":"https://shangbiaopic.11467.com/13/85/13855845.jpg","fit":"","coordinateSync":false,"widthHeightSync":false,"right":55,"bottom":45.989585876464844,"vCenter":35,"hCenter":25.989585876464844,"field":"minong"},"printElementType":{"title":"图片","type":"image"}},{"options":{"left":57,"top":15,"height":14,"width":180,"title":"浙江翌星包装科技有限公司","coordinateSync":false,"widthHeightSync":false,"fontSize":13.5,"textAlign":"center","textContentVerticalAlign":"middle","qrCodeLevel":0},"printElementType":{"title":"文本","type":"text"}},{"options":{"left":319.5,"top":15,"height":30,"width":168,"title":"员工超结损奖罚统计","right":393,"bottom":36,"vCenter":333,"hCenter":31.125,"coordinateSync":false,"widthHeightSync":false,"qrCodeLevel":0,"fontSize":16.5,"fontWeight":"bold","textAlign":"center","textContentVerticalAlign":"middle"},"printElementType":{"title":"文本","type":"text"}},{"options":{"left":46.5,"top":54,"height":16,"width":90,"title":"文本","field":"riqi","coordinateSync":false,"widthHeightSync":false,"qrCodeLevel":0,"right":203.2474136352539,"bottom":92.23958587646484,"vCenter":154.4974136352539,"hCenter":71.98958587646484,"hideTitle":true},"printElementType":{"title":"文本","type":"text"}},{"options":{"left":510,"top":52.5,"height":16,"width":48,"title":"打印时间","coordinateSync":false,"widthHeightSync":false,"qrCodeLevel":0},"printElementType":{"title":"这是更新后的元素","type":"text"}},{"options":{"left":556.5,"top":52.5,"height":16,"width":141,"field":"dysj","coordinateSync":false,"widthHeightSync":false,"hideTitle":true,"qrCodeLevel":0},"printElementType":{"title":"这是更新后的元素","type":"text"}},{"options":{"left":15,"top":54,"height":16,"width":31.5,"title":"日期","right":90.74478149414062,"bottom":93.0000228881836,"vCenter":48.744781494140625,"hCenter":71.2500228881836,"coordinateSync":false,"widthHeightSync":false,"fontSize":12,"qrCodeLevel":0},"printElementType":{"title":"文本","type":"text"}},{"options":{"left":19.5,"top":85.5,"height":61.5,"width":735,"field":"table","groupFieldsFormatter":"function(type,options,data){ return [\"name\"] }","qid":"table_1","right":755.2421951293945,"bottom":147.74480438232422,"vCenter":387.74219512939453,"hCenter":116.99480438232422,"coordinateSync":false,"widthHeightSync":false,"maxRows":25,"tableHeaderBorder":"border","columns":[[{"width":107.22811671087534,"title":"所在部门","field":"szbm","checked":true,"columnId":"szbm","fixed":false,"rowspan":1,"colspan":1},{"width":128.67374005305038,"title":"班组","field":"banzu","checked":true,"columnId":"banzu","fixed":false,"rowspan":1,"colspan":1,"align":"left"},{"width":128.67374005305038,"title":"员工编号","field":"ygbh","checked":true,"columnId":"ygbh","fixed":false,"rowspan":1,"colspan":1},{"width":128.67374005305038,"title":"员工姓名","field":"ygxm","checked":true,"columnId":"ygxm","fixed":false,"rowspan":1,"colspan":1},{"width":128.67374005305038,"title":"超节损金额","field":"cjsje","checked":true,"columnId":"cjsje","fixed":false,"rowspan":1,"colspan":1},{"width":113.07692307692307,"title":"备注说明","field":"beizhu","checked":true,"columnId":"beizhu","fixed":false,"rowspan":1,"colspan":1}]]},"printElementType":{"title":"表格","type":"table","editable":true,"columnDisplayEditable":true,"columnDisplayIndexEditable":true,"columnTitleEditable":true,"columnResizable":true,"columnAlignEditable":true,"isEnableEditField":true,"isEnableContextMenu":true,"isEnableInsertRow":true,"isEnableDeleteRow":true,"isEnableInsertColumn":true,"isEnableDeleteColumn":true,"isEnableMergeCell":true}}],"paperNumberLeft":822,"paperNumberTop":501,"paperNumberDisabled":true,"paperNumberContinue":true,"rotate":true,"orient":2,"watermarkOptions":{},"panelLayoutOptions":{}}]}
  506. const onclick_ygdy = async () => {
  507. // 获取用户选择的日期
  508. const selectedDate = new Date(ygdy_formData['ygriqi']);
  509. // 手动增加一个月
  510. selectedDate.setMonth(selectedDate.getMonth() + 1);
  511. // 格式化为 YYYY-MM
  512. const formattedDate = selectedDate.toISOString().slice(0, 7);
  513. // 引入打印初始化
  514. hiprint.init();
  515. const hiprintTemplate = new hiprint.PrintTemplate({ template: jsondatas });
  516. // 获取数据
  517. // console.log(formattedDate);
  518. const res = await EmployeeDataCollect({ date: formattedDate });
  519. console.log(res)
  520. console.log(121212)
  521. const { data } = res;
  522. // if (res.data.印刷车间.A班.length === 0) {
  523. // console.log("A班数据为空");
  524. // } else {
  525. // console.log("A班数据不为空");
  526. // }
  527. // return false;
  528. // 将数据转换为目标格式
  529. const dataSource = { 'table': [] };
  530. // 处理“印刷车间”A班的数据
  531. let isFirstA班 = true;
  532. for (const [key, value] of Object.entries(data['印刷车间']['A班'])) {
  533. const [ygbh, ygxm] = key.split('(');
  534. dataSource.table.push({
  535. 'szbm': isFirstA班 ? '印刷车间' : '',
  536. 'banzu': isFirstA班 ? 'A班' : '',
  537. 'ygbh': ygbh,
  538. 'ygxm': ygxm.replace(')', ''),
  539. 'cjsje': value
  540. });
  541. isFirstA班 = false;
  542. }
  543. // 添加“印刷车间”A班的合计行
  544. dataSource.table.push({
  545. 'szbm': '',
  546. 'banzu': '车间班组合计',
  547. 'ygbh': '',
  548. 'ygxm': '',
  549. 'cjsje': data['yinshuaA']
  550. });
  551. // 处理“印刷车间”B班的数据
  552. let isFirstB班 = true;
  553. for (const [key, value] of Object.entries(data['印刷车间']['B班'])) {
  554. const [ygbh, ygxm] = key.split('(');
  555. dataSource.table.push({
  556. 'szbm': isFirstB班 ? '印刷车间' : '',
  557. 'banzu': isFirstB班 ? 'B班' : '',
  558. 'ygbh': ygbh,
  559. 'ygxm': ygxm.replace(')', ''),
  560. 'cjsje': value
  561. });
  562. isFirstB班 = false;
  563. }
  564. // 添加“印刷车间”B班的合计行
  565. dataSource.table.push({
  566. 'szbm': '',
  567. 'banzu': '车间班组合计',
  568. 'ygbh': '',
  569. 'ygxm': '',
  570. 'cjsje': data['yinshuaB']
  571. });
  572. // 处理“印后车间”A班的数据
  573. let isFirst印后A班 = true;
  574. for (const [key, value] of Object.entries(data['印后车间']['A班'])) {
  575. const [ygbh, ygxm] = key.split('(');
  576. dataSource.table.push({
  577. 'szbm': isFirst印后A班 ? '印后车间' : '',
  578. 'banzu': isFirst印后A班 ? 'A班' : '',
  579. 'ygbh': ygbh,
  580. 'ygxm': ygxm.replace(')', ''),
  581. 'cjsje': value
  582. });
  583. isFirst印后A班 = false;
  584. }
  585. // 添加“印后车间”A班的合计行
  586. dataSource.table.push({
  587. 'szbm': '',
  588. 'banzu': '车间班组合计',
  589. 'ygbh': '',
  590. 'ygxm': '',
  591. 'cjsje': data['yinhouA']
  592. });
  593. // 处理“印后车间”B班的数据
  594. let isFirst印后B班 = true;
  595. for (const [key, value] of Object.entries(data['印后车间']['B班'])) {
  596. const [ygbh, ygxm] = key.split('(');
  597. dataSource.table.push({
  598. 'szbm': isFirst印后B班 ? '印后车间' : '',
  599. 'banzu': isFirst印后B班 ? 'B班' : '',
  600. 'ygbh': ygbh,
  601. 'ygxm': ygxm.replace(')', ''),
  602. 'cjsje': value
  603. });
  604. isFirst印后B班 = false;
  605. }
  606. // 添加“印后车间”B班的合计行
  607. dataSource.table.push({
  608. 'szbm': '',
  609. 'banzu': '车间班组合计',
  610. 'ygbh': '',
  611. 'ygxm': '',
  612. 'cjsje': data['yinhouB']
  613. });
  614. // 获取当前日期
  615. const today = new Date();
  616. const year = today.getFullYear();
  617. const month = String(today.getMonth() + 1).padStart(2, '0'); // 月份从 0 开始,需要补零
  618. const day = String(today.getDate()).padStart(2, '0');
  619. const hours = String(today.getHours()).padStart(2, '0');
  620. const minutes = String(today.getMinutes()).padStart(2, '0');
  621. const seconds = String(today.getSeconds()).padStart(2, '0');
  622. const currentDate = `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
  623. // 初始化数据结构
  624. const tableDataFormatted = {
  625. "minong": "/src/assets/logotx.png",
  626. "dysj": currentDate,
  627. "riqi": data['日期'],
  628. "table": dataSource['table'],
  629. "cjbzhj": data['total'] // 将total作为车间班组合计
  630. };
  631. // 输出结果,确保数据格式正确
  632. console.log(tableDataFormatted);
  633. // 打印结果
  634. hiprintTemplate.print(tableDataFormatted);
  635. }
  636. //关闭窗口
  637. const exitXzgdtl = (data) => {
  638. dialogXzgdtl.value = data;
  639. };
  640. </script>
  641. <style scoped>
  642. :deep(.plan-usage-low div) {
  643. color: red !important;
  644. }
  645. .JKWTree-container {
  646. display: flex;
  647. }
  648. .JKWTree-tree {
  649. width: 100%;
  650. background-color: #fff;
  651. /*background-color: rgba(241, 224, 224, 0.99);*/
  652. padding: 10px;
  653. margin-right: 20px;
  654. }
  655. .JKWTree-tree h3 {
  656. font-size: 15px;
  657. font-weight: 700;
  658. margin: 10px 0;
  659. }
  660. .JKWTree-content {
  661. flex: 1;
  662. }
  663. :deep(.el-table .yellow-row) {
  664. background: #ffff80;
  665. }
  666. :deep(.red-cell div) {
  667. color: #ff0000 !important;
  668. }
  669. /* 选中某行时的背景色 */
  670. :deep(.el-table__body tr.current-row) > td {
  671. background: #ff80ff !important;
  672. }
  673. </style>
  674. <style scoped>
  675. :deep(.el-table td .cell) {
  676. line-height: 20px !important;
  677. }
  678. :deep(.el-tabs__header) {
  679. margin-bottom: 0;
  680. }
  681. .search {
  682. margin-left: 0px !important;
  683. margin-right: 10px !important;
  684. }
  685. .bt {
  686. margin-left: 2px !important;
  687. padding: 3px !important;
  688. font-size: 12px;
  689. }
  690. .el-tabs__header {
  691. margin: 0px !important;
  692. }
  693. .gva-table-box {
  694. padding: 0px !important;
  695. }
  696. .mab {
  697. margin-bottom: 5px;
  698. }
  699. </style>