|
@@ -0,0 +1,394 @@
|
|
|
+<template>
|
|
|
+ <div ref="accessoriesDetailsRef">
|
|
|
+ <a-modal
|
|
|
+ title="打印" :footer="null"
|
|
|
+ width="70%"
|
|
|
+ :visible="visible"
|
|
|
+ @cancel="handleCancel">
|
|
|
+ <div>
|
|
|
+ <a-button type="primary" style="float:right" ghost @click="onPrint">打印</a-button>
|
|
|
+ <table class="a4-table" id="printContent2">
|
|
|
+ <!-- 标题行 -->
|
|
|
+ <tr>
|
|
|
+ <td colspan="7" style="height:20px;border:none; padding:0">
|
|
|
+ <table width="100%" style="border:none">
|
|
|
+ <tr style="height:20% ;" >
|
|
|
+ <td style="text-align:center;width:20%;border:none">
|
|
|
+ <img style="height:20mm;width:30mm;margin-top: 12%;"src="/resource/img/logo1.png" alt="公司logo">
|
|
|
+ </td>
|
|
|
+ <td style="text-align:center;border:none">
|
|
|
+ <div class="company-name">上海哥宝海事工程有限公司</div>
|
|
|
+ <div class="form-title">外勤工作总结表</div>
|
|
|
+ </td>
|
|
|
+ <td style="width:20%;border:none">
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td style="width:40mm;border:none; " class="doc-info" colspan="3" >
|
|
|
+ 表单编号:{{dateRef.billCode}}
|
|
|
+ 版本:A/1
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ </table>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <!-- 个人信息 -->
|
|
|
+ <tr>
|
|
|
+ <td colspan="2" class="header-cell">姓 名</td>
|
|
|
+ <td class="header-cell">{{dateRef.schedulingMan}}</td>
|
|
|
+ <td class="header-cell">部 门</td>
|
|
|
+ <td class="header-cell">{{dateRef.sysOrgCode_dictText}}</td>
|
|
|
+ <td class="header-cell">日期</td>
|
|
|
+ <td class="header-cell">{{dateRef.schedulingDate}}</td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td class="full-height">午别</td>
|
|
|
+ <td class="full-height">工作时间</td>
|
|
|
+ <td colspan="3" class="full-height">工作内容</td>
|
|
|
+ <td class="full-height">重要程度</td>
|
|
|
+ <td class="full-height">备注</td>
|
|
|
+ </tr>
|
|
|
+
|
|
|
+ <tr>
|
|
|
+ <td rowspan="5" style="text-align: center;vertical-align: middle;" class="full-height">上<br/>午</td>
|
|
|
+ <td class="full-height">7:00-8:00</td>
|
|
|
+ <td colspan="3" class="full-height">{{dateRef.time78Work}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time78Degree}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time78Notes}}</td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+
|
|
|
+ <td class="full-height">8:00-9:00</td>
|
|
|
+ <td colspan="3" class="full-height">{{dateRef.time89Work}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time89Degree}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time89Notes}}</td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td class="full-height">9:00-10:00</td>
|
|
|
+ <td colspan="3" class="full-height">{{dateRef.time910Work}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time910Degree}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time910Notes}}</td>
|
|
|
+
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td class="full-height">10:00-11:00</td>
|
|
|
+ <td colspan="3" class="full-height">{{dateRef.time1011Work}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time1011Degree}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time1011Notes}}</td>
|
|
|
+
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td class="full-height">11:00-12:00</td>
|
|
|
+ <td colspan="3" class="full-height">{{dateRef.time1112Work}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time1112Degree}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time1112Notes}}</td>
|
|
|
+ </tr>
|
|
|
+
|
|
|
+ <tr>
|
|
|
+ <td rowspan="5" style="text-align: center;vertical-align: middle;" class="full-height">下<br/>午</td>
|
|
|
+ <td class="full-height">12:00-13:00</td>
|
|
|
+ <td colspan="3" class="full-height">{{dateRef.time1213Work}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time1213Degree}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time1213Notes}}</td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td class="full-height">13:00-14:00</td>
|
|
|
+ <td colspan="3" class="full-height">{{dateRef.time1314Work}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time1314Degree}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time1314Notes}}</td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td class="full-height">14:00-15:00</td>
|
|
|
+ <td colspan="3" class="full-height">{{dateRef.time1415Work}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time1415Degree}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time1415Notes}}</td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td class="full-height">15:00-16:00</td>
|
|
|
+ <td colspan="3" class="full-height">{{dateRef.time1516Work}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time1516Degree}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time1516Notes}}</td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td class="full-height">16:00-17:00</td>
|
|
|
+ <td colspan="3" class="full-height">{{dateRef.time1617Work}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time1617Degree}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time1617Notes}}</td>
|
|
|
+ </tr>
|
|
|
+
|
|
|
+ <tr>
|
|
|
+ <td rowspan="6" style="text-align: center;vertical-align: middle;" class="full-height">晚<br/>上</td>
|
|
|
+ <td class="full-height">17:00-18:00</td>
|
|
|
+ <td colspan="3" class="full-height">{{dateRef.time1718Work}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time1718Degree}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time1718Notes}}</td>
|
|
|
+
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td class="full-height">18:00-19:00</td>
|
|
|
+ <td colspan="3" class="full-height">{{dateRef.time1819Work}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time1819Degree}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time1819Notes}}</td>
|
|
|
+
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td class="full-height">19:00-20:00</td>
|
|
|
+ <td colspan="3" class="full-height">{{dateRef.time1920Work}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time1920Degree}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time1920Notes}}</td>
|
|
|
+
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td class="full-height">20:00-21:00</td>
|
|
|
+ <td colspan="3" class="full-height">{{dateRef.time2021Work}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time2021Degree}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time2021Notes}}</td>
|
|
|
+
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td class="full-height">21:00-22:00</td>
|
|
|
+ <td colspan="3" class="full-height">{{dateRef.time2122Work}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time2122Degree}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time2122Notes}}</td>
|
|
|
+
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td class="full-height">22:00-24:00</td>
|
|
|
+ <td colspan="3" class="full-height">{{dateRef.time2224Work}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time2224Degree}}</td>
|
|
|
+ <td class="full-height">{{dateRef.time2224Notes}}</td>
|
|
|
+ </tr>
|
|
|
+
|
|
|
+ <tr>
|
|
|
+ <td colspan="7" style="vertical-align: top; text-align: left;" class="large-height">补充说明:{{dateRef.notes}}</td>
|
|
|
+ </tr>
|
|
|
+
|
|
|
+ <tr>
|
|
|
+ <td colspan="7" style="text-align: center;border:none;padding-top:20px">Page 1 of 1</td>
|
|
|
+ </tr>
|
|
|
+ </table>
|
|
|
+ </div>
|
|
|
+ </a-modal>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script lang="ts" setup>
|
|
|
+ import {ref, computed, unref,reactive} from 'vue';
|
|
|
+ import { useGlobSetting } from '/@/hooks/setting';
|
|
|
+ import {defHttp} from '/@/utils/http/axios';
|
|
|
+ const { domainUrl } = useGlobSetting();
|
|
|
+ var visible = ref(false);
|
|
|
+ import { printJS } from '/@/hooks/web/usePrintJS';
|
|
|
+
|
|
|
+ var dateRef = reactive<Record<string, any>>({
|
|
|
+ billCode: '',
|
|
|
+ schedulingMan: '',
|
|
|
+ sysOrgCode_dictText: '',
|
|
|
+ schedulingDate: '',
|
|
|
+ notes: '',
|
|
|
+ time78Work: '',
|
|
|
+ time78Degree: '',
|
|
|
+ time78Notes: '',
|
|
|
+ time89Work: '',
|
|
|
+ time89Degree: '',
|
|
|
+ time89Notes: '',
|
|
|
+ time910Work: '',
|
|
|
+ time910Degree: '',
|
|
|
+ time910Notes: '',
|
|
|
+ time1011Work: '',
|
|
|
+ time1011Degree: '',
|
|
|
+ time1011Notes: '',
|
|
|
+ time1112Work: '',
|
|
|
+ time1112Degree: '',
|
|
|
+ time1112Notes: '',
|
|
|
+ time1213Work: '',
|
|
|
+ time1213Degree: '',
|
|
|
+ time1213Notes: '',
|
|
|
+ time1314Work: '',
|
|
|
+ time1314Degree: '',
|
|
|
+ time1314Notes: '',
|
|
|
+ time1415Work: '',
|
|
|
+ time1415Degree: '',
|
|
|
+ time1415Notes: '',
|
|
|
+ time1516Work: '',
|
|
|
+ time1516Degree: '',
|
|
|
+ time1516Notes: '',
|
|
|
+ time1617Work: '',
|
|
|
+ time1617Degree: '',
|
|
|
+ time1617Notes: '',
|
|
|
+ time1718Work: '',
|
|
|
+ time1718Degree: '',
|
|
|
+ time1718Notes: '',
|
|
|
+ time1819Work: '',
|
|
|
+ time1819Degree: '',
|
|
|
+ time1819Notes: '',
|
|
|
+ time1920Work: '',
|
|
|
+ time1920Degree: '',
|
|
|
+ time1920Notes: '',
|
|
|
+ time2021Work: '',
|
|
|
+ time2021Degree: '',
|
|
|
+ time2021Notes: '',
|
|
|
+ time2122Work: '',
|
|
|
+ time2122Degree: '',
|
|
|
+ time2122Notes: '',
|
|
|
+ time2223Work: '',
|
|
|
+ time2223Degree: '',
|
|
|
+ time2223Notes: '',
|
|
|
+ time2324Work: '',
|
|
|
+ time2324Degree: '',
|
|
|
+ time2324Notes: ''
|
|
|
+ });
|
|
|
+
|
|
|
+ var dataSource=ref([])
|
|
|
+ const baseUrl = domainUrl + '/sys/common/static/';
|
|
|
+ function getTable(record,billCode,schedulingMan,sysOrgCode_dictText){
|
|
|
+ visible.value = true
|
|
|
+ dateRef.billCode=billCode;
|
|
|
+ dateRef.schedulingMan=schedulingMan;
|
|
|
+ dateRef.sysOrgCode_dictText=sysOrgCode_dictText;
|
|
|
+ dateRef.schedulingDate=record.schedulingDate;
|
|
|
+ dateRef.notes=record.notes;
|
|
|
+
|
|
|
+ dateRef.time78Work=record.time78Work;
|
|
|
+ dateRef.time78Degree=record.time78Degree;
|
|
|
+ dateRef.time78Notes=record.time78Notes;
|
|
|
+
|
|
|
+ dateRef.time89Work=record.time89Work;
|
|
|
+ dateRef.time89Degree=record.time89Degree;
|
|
|
+ dateRef.time89Notes=record.time89Notes;
|
|
|
+
|
|
|
+ dateRef.time910Work=record.time910Work;
|
|
|
+ dateRef.time910Degree=record.time910Degree;
|
|
|
+ dateRef.time910Notes=record.time910Notes;
|
|
|
+
|
|
|
+ dateRef.time1011Work=record.time1011Work;
|
|
|
+ dateRef.time1011Degree=record.time1011Degree;
|
|
|
+ dateRef.time1011Notes=record.time1011Notes;
|
|
|
+
|
|
|
+ dateRef.time1112Work=record.time1112Work;
|
|
|
+ dateRef.time1112Degree=record.time1112Degree;
|
|
|
+ dateRef.time1112Notes=record.time1112Notes;
|
|
|
+
|
|
|
+ dateRef.time1213Work=record.time1213Work;
|
|
|
+ dateRef.time1213Degree=record.time1213Degree;
|
|
|
+ dateRef.time1213Notes=record.time1213Notes;
|
|
|
+
|
|
|
+ dateRef.time1314Work=record.time1314Work;
|
|
|
+ dateRef.time1314Degree=record.time1314Degree;
|
|
|
+ dateRef.time1314Notes=record.time1314Notes;
|
|
|
+
|
|
|
+ dateRef.time1415Work=record.time1415Work;
|
|
|
+ dateRef.time1415Degree=record.time1415Degree;
|
|
|
+ dateRef.time1415Notes=record.time1415Notes;
|
|
|
+
|
|
|
+ dateRef.time1516Work=record.time1516Work;
|
|
|
+ dateRef.time1516Degree=record.time1516Degree;
|
|
|
+ dateRef.time1516Notes=record.time1516Notes;
|
|
|
+
|
|
|
+ dateRef.time1617Work=record.time1617Work;
|
|
|
+ dateRef.time1617Degree=record.time1617Degree;
|
|
|
+ dateRef.time1617Notes=record.time1617Notes;
|
|
|
+
|
|
|
+ dateRef.time1718Work=record.time1718Work;
|
|
|
+ dateRef.time1718Degree=record.time1718Degree;
|
|
|
+ dateRef.time1718Notes=record.time1718Notes;
|
|
|
+
|
|
|
+ dateRef.time1819Work=record.time1819Work;
|
|
|
+ dateRef.time1819Degree=record.time1819Degree;
|
|
|
+ dateRef.time1819Notes=record.time1819Notes;
|
|
|
+
|
|
|
+ dateRef.time1920Work=record.time1920Work;
|
|
|
+ dateRef.time1920Degree=record.time1920Degree;
|
|
|
+ dateRef.time1920Notes=record.time1920Notes;
|
|
|
+
|
|
|
+ dateRef.time2021Work=record.time2021Work;
|
|
|
+ dateRef.time2021Degree=record.time2021Degree;
|
|
|
+ dateRef.time2021Notes=record.time2021Notes;
|
|
|
+
|
|
|
+ dateRef.time2122Work=record.time2122Work;
|
|
|
+ dateRef.time2122Degree=record.time2122Degree;
|
|
|
+ dateRef.time2122Notes=record.time2122Notes;
|
|
|
+
|
|
|
+ dateRef.time2223Work=record.time2223Work;
|
|
|
+ dateRef.time2223Degree=record.time2223Degree;
|
|
|
+ dateRef.time2223Notes=record.time2223Notes;
|
|
|
+
|
|
|
+ dateRef.time2324Work=record.time2324Work;
|
|
|
+ dateRef.time2324Degree=record.time2324Degree;
|
|
|
+ dateRef.time2324Notes=record.time2324Notes;
|
|
|
+
|
|
|
+ printJS({
|
|
|
+ printable: '#printContent2',
|
|
|
+ type: 'html',
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ function onPrint() {
|
|
|
+ printJS({
|
|
|
+ printable: '#printContent2',
|
|
|
+ type: 'html',
|
|
|
+ });
|
|
|
+ }
|
|
|
+ function handleCancel(){
|
|
|
+ visible.value = false;
|
|
|
+ }
|
|
|
+ defineExpose({
|
|
|
+ getTable
|
|
|
+ });
|
|
|
+ </script>
|
|
|
+
|
|
|
+<style lang="less" scoped>
|
|
|
+ @page {
|
|
|
+ size: A4;
|
|
|
+ margin: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .a4-table {
|
|
|
+ margin: 0 auto; /* 水平居中 */
|
|
|
+ width: 91%;
|
|
|
+ border-collapse: collapse;
|
|
|
+ table-layout: fixed;
|
|
|
+ }
|
|
|
+ .a4-table td {
|
|
|
+ border: 1px solid #000;
|
|
|
+ padding: 2mm;
|
|
|
+ vertical-align: top;font-size: 3.5mm;
|
|
|
+ }
|
|
|
+ .header-cell {
|
|
|
+ /* font-weight: bold; */
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+ .company-name {
|
|
|
+ margin-top: 5mm;
|
|
|
+ font-size: 5mm;
|
|
|
+ font-family: anticon
|
|
|
+ /* font-weight: bold; */
|
|
|
+ }
|
|
|
+ .form-title {
|
|
|
+ font-size: 6mm;
|
|
|
+ margin-top: 2mm;
|
|
|
+ font-family: anticon
|
|
|
+ }
|
|
|
+ .doc-info {
|
|
|
+ font-size: 4mm;
|
|
|
+ text-align: right;
|
|
|
+ }
|
|
|
+ .full-height {
|
|
|
+ /* height: 14mm; */
|
|
|
+ text-align:center
|
|
|
+ }
|
|
|
+ .large-height {
|
|
|
+ height: 50mm;
|
|
|
+ }
|
|
|
+ /** 时间和数字输入框样式 */
|
|
|
+ :deep(.ant-input-number) {
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+
|
|
|
+ :deep(.ant-calendar-picker) {
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+ /deep/.ant-modal-body{
|
|
|
+ padding: 14px !important;
|
|
|
+ }
|
|
|
+</style>
|