数据报表页面数据列设置固定宽度

zhaowei

8 天以前 86f0166e2a759e6ec2c34b0dd0b388bafa80cedd

 src/views/dnc/base/modules/ProductStructure/GuideCardBatch/KnifeListPrintModal.vue

@@ -5,60 +5,60 @@
      <div class="table-header">
        <h3>刀具清单</h3>
        <div>
          <div>单位：<span>机加中心</span></div>
          <div>编号：<span>25-C140-PST-293</span></div>
          <div>单位：<span>{{detail.unit}}</span></div>
          <div>编号：<span>{{detail.serialNumber}}</span></div>
        </div>
      </div>

      <table border="1">
        <tr>
          <th colspan="2">程序外部文件名</th>
          <td colspan="9">TY9F-11-2507-002-TY9F1W0130-30-3</td>
          <td colspan="9">{{detail.docName}}</td>
        </tr>

        <tr>
          <th colspan="2">零件图号</th>
          <td colspan="5">TY9F-11-2507-002-TY9F1W0130</td>
          <td colspan="5">{{detail.partsCode}}</td>
          <th>零件名称</th>
          <td colspan="3">转接头</td>
          <td colspan="3">{{detail.partsName}}</td>
        </tr>

        <tr>
          <th colspan="2">零件材料</th>
          <td colspan="3">钢棒</td>
          <td colspan="3">{{detail.materielDesp}}</td>
          <th colspan="2">夹具</th>
          <td colspan="4">{{detail.fixtureInformation}}</td>
        </tr>

        <tr>
          <th colspan="2">工序（工步号）</th>
          <td>30-3</td>
          <td>{{detail.processWorkCode}}</td>
          <th colspan="2">加工批次</th>
          <td colspan="2">S2501</td>
          <td colspan="2">{{detail.processingBatch}}</td>
          <th>加工数量</th>
          <td>20</td>
          <td>{{detail.processingQuantity}}</td>
          <th>加工设备</th>
          <td>3140123</td>
          <td>{{detail.processingEquipment}}</td>
        </tr>

        <tr>
          <th colspan="2">刀位号</th>
          <th>刀具描述</th>
          <th colspan="2">最短工作长度</th>
          <th colspan="2">刀具编号</th>
          <th>规格</th>
          <th>库位</th>
          <th colspan="2">备注</th>
          <th>刀具名称</th>
          <th colspan="2">刀具简称</th>
          <th colspan="2">刀具规格</th>
          <th>刀位</th>
          <th>刀具数量</th>
          <th colspan="2">描述</th>
        </tr>

        <tr v-for="item in knifeList" :key="item.knifeId">
          <td colspan="2">{{item.knifeNo}}</td>
          <td>{{item.knifeDescription}}</td>
          <td colspan="2">{{item.minWorkLength}}</td>
          <td colspan="2">{{item.knifeId}}</td>
          <td>{{item.spec}}</td>
          <td>{{item.position}}</td>
          <td colspan="2">{{item.remark}}</td>
          <td colspan="2">{{item.cutterCode}}</td>
          <td>{{item.cutterName}}</td>
          <td colspan="2">{{item.cutterType}}</td>
          <td colspan="2">{{item.cutterSpec}}</td>
          <td>{{item.cutterSpacing}}</td>
          <td>{{item.quantity}}</td>
          <td colspan="2">{{item.description}}</td>
        </tr>
      </table>
    </div>
@@ -70,119 +70,37 @@
</template>

<script>
  import { getAction } from '@api/manage'

  export default {
    name: 'KnifeListPrintModal',
    data() {
      return {
        visible: false,
        detail: {},
        knifeList: [
          {
            knifeNo: '1',
            knifeDescription: '8E',
            minWorkLength: '35',
            knifeId: 'Q20110211',
            spec: '',
            position: '05070201',
            remark: ''
          },
          {
            knifeNo: '2',
            knifeDescription: '6E',
            minWorkLength: '35',
            knifeId: 'Q20110212',
            spec: '',
            position: '05070202',
            remark: ''
          },
          {
            knifeNo: '5',
            knifeDescription: '6R',
            minWorkLength: '20',
            knifeId: 'Q20110213',
            spec: '',
            position: '05070203',
            remark: ''
          },
          {
            knifeNo: '1',
            knifeDescription: '8E',
            minWorkLength: '35',
            knifeId: 'Q20110214',
            spec: '',
            position: '05070201',
            remark: ''
          },
          {
            knifeNo: '2',
            knifeDescription: '6E',
            minWorkLength: '35',
            knifeId: 'Q20110215',
            spec: '',
            position: '05070202',
            remark: ''
          },
          {
            knifeNo: '5',
            knifeDescription: '6R',
            minWorkLength: '20',
            knifeId: 'Q20110216',
            spec: '',
            position: '05070203',
            remark: ''
          },
          {
            knifeNo: '1',
            knifeDescription: '8E',
            minWorkLength: '35',
            knifeId: 'Q20110217',
            spec: '',
            position: '05070201',
            remark: ''
          },
          {
            knifeNo: '2',
            knifeDescription: '6E',
            minWorkLength: '35',
            knifeId: 'Q20110218',
            spec: '',
            position: '05070202',
            remark: ''
          },
          {
            knifeNo: '5',
            knifeDescription: '6R',
            minWorkLength: '20',
            knifeId: 'Q20110219',
            spec: '',
            position: '05070203',
            remark: ''
          },
          {
            knifeNo: '1',
            knifeDescription: '8E',
            minWorkLength: '35',
            knifeId: 'Q20110220',
            spec: '',
            position: '05070201',
            remark: ''
          }
        ]
        knifeList: [],
        url:{
          getByBusinessId: '/nc/cutter/getList'
        }
      }
    },
    methods: {
      getImageUrl(imgSrcSuffix) {
        return `${window._CONFIG['domianURL']}/${imgSrcSuffix}`
      },

      handleCancel() {
        this.visible = false
      }
      },
      handleCutter(docId){
        getAction(this.url.getByBusinessId,{docId:docId}).then((res)=>{
          if(res.success){
            this.knifeList = res.result
            this.visible = true
          }
        })
      },
    }
  }
</script>

<style scopedl lang="less">
<style scoped lang="less">
  .table-header {
    display: flex;
    flex-direction: column;