下线打印报告优化

admin

2 天以前 22260b8e7349fe03402529d4918739b276113340

 jcdm-ui/src/views/main/cfkb/Instructions/index.vue

@@ -13,283 +13,33 @@
      </el-col>
      <el-col :span="10">
        <el-card shadow="never">
          <span class="head-font">产品序列号 : {{headContent.sfcCode}}</span>
<!--          <el-button @click="print1">打印</el-button>-->
          <el-button id="print" v-print="'#printMe'" type="primary">打印</el-button>


          <el-button type="primary" style="float: right" icon="el-icon-search" size="mini" @click="serialLink">串口连接</el-button>
          <el-button @click="clearClick" style="float: right" type="danger" size="mini">清除</el-button>
          <span class="head-font">产品序列号 :</span>
          <el-input style="width: 50%;" v-model="headContent.sfcCode" placeholder="请输入内容"></el-input>
<!--          <el-button type="primary" id="print" v-print="'#printMe'">打印</el-button>-->
          <el-button type="primary" id="print" v-print="'#printMe'">打印</el-button>
<!--          <el-button id="print" @click="print1" type="primary">打印</el-button>-->
          <el-button type="primary" style="margin-left: -70px;opacity: 0;" @click="printBefore">打印</el-button>
          <el-button @click="clearClick" type="danger">清除</el-button>
        </el-card>
      </el-col>

    </el-row>
    <el-row :gutter="5" style="margin-top: 5px">
      <el-col :span="12">
      <el-col :span="24">
        <el-tabs type="border-card"  style="height: 600px" v-model="activeName" @tab-click="changeMenu">
          <el-tab-pane name="first">
            <span slot="label"> <a class="el-icon-date"></a>首页</span>
            <el-col :span="24">
              <div>
<!--                <div id="printMe">-->
<!--                  <div style="font-size: 29px;text-align: center;margin-top: 64px">-->
<!--                    <span>电驱系统总成</span>-->
<!--                  </div>-->
<!--                  <div style="display: flex;margin-top: 2px;margin-left: 37px;font-size: 15px">-->
<!--                    <div class="div1">-->
<!--                      <div >-->
<!--                        <span>电机型号：</span><span>TZ180XSDSZX01</span><br>-->
<!--                      </div>-->
<!--                      <div style="margin-top: 4px">-->
<!--                        <span>额定功率：</span><span>30KW</span><br>-->
<!--                      </div>-->
<!--                      <div style="margin-top: 4px">-->
<!--                        <span>额定扭矩：</span><span>70N.m</span><br>-->
<!--                      </div>-->
<!--                      <div style="margin-top: 4px">-->
<!--                        <span>额定电压：</span><span>336VDS</span><br>-->
<!--                      </div>-->
<!--                      <div style="margin-top: 4px">-->
<!--                        <span>额工作制：</span><span>S9</span><br>-->
<!--                      </div>-->
<!--                      <div style="margin-top: 4px">-->
<!--                        <span>持续工作电流：</span><span>115A</span><br>-->
<!--                      </div>-->
<!--                      <div style="margin-top: 4px">-->
<!--                        <span>相数：</span><span>3</span><br>-->
<!--                      </div>-->
<!--                      <div style="margin-top: 4px">-->
<!--                        <span>零件号：</span><span>9900200461</span><br>-->
<!--                      </div>-->
<!--                    </div>-->

<!--                    <div class="div2" style="font-size: 15px;margin-left: 17px">-->
<!--                      <div>-->
<!--                        <span>控制器型号：</span><span>KTZ34X23SZX07</span><br>-->
<!--                      </div>-->
<!--                      <div style="margin-top: 4px">-->
<!--                        <span>峰值功率：</span><span>60KW</span><br>-->
<!--                      </div>-->
<!--                      <div style="margin-top: 4px">-->
<!--                        <span>峰值转矩：</span><span>175N.m</span><br>-->
<!--                      </div>-->
<!--                      <div style="margin-top: 4px">-->
<!--                        <span>最高转速：</span><span>12000rpm</span><br>-->
<!--                      </div>-->
<!--                      <div style="margin-top: 4px">-->
<!--                        <span>防护等级：</span><span>IP68</span><br>-->
<!--                      </div>-->
<!--                      <div style="margin-top: 4px">-->
<!--                        <span>峰值工作电流：</span><span>230A</span><br>-->
<!--                      </div>-->
<!--                      <div style="margin-top: 4px">-->
<!--                        <span>绝缘等级：</span><span>H</span><br>-->
<!--                      </div>-->
<!--                      <div style="margin-top: 4px">-->
<!--                        <span>出厂编号：</span><span>2407190000002</span><br>-->
<!--                      </div>-->
<!--                    </div>-->
<!--                  </div>-->
<!--                  <div style="font-size: 29px;margin-top: 2px;margin-left: 80px">-->
<!--                    <span>湖州智芯动力发展有限公司</span>-->
<!--                  </div>-->


<!--                  <div style="text-align: center;margin-top: 97px;font-size: 20px">-->
<!--                    <span>TZ180XSDSZX01</span><br>-->
<!--                    <span>KTZ34X23SZX07</span><br>-->
<!--                    <span>993083</span><br>-->
<!--                    <span>9900166410</span><br>-->
<!--                    <span>2407190000002</span>-->
<!--                  </div>-->

<!--                  <div style="margin-top: 76px;display: flex;margin-left: 32px">-->
<!--                    <div ref="canvasWrapper" id="canvasWrapper1" style="width: 30%;flex: 1"></div>-->
<!--                    <div style="width: 70%;flex: 1;margin-top: 18px;margin-right: 17px">-->
<!--                      <span style="margin-left: -80px;font-size: 18px;font-family: FangSong">-->
<!--                        P9900166410#T{{text1}}-->
<!--                      </span><br>-->
<!--                      <span style="margin-left: -80px;font-size: 18px;font-family: FangSong">-->
<!--                        #V993983#SSW002.005#HHW001.001#NMCU#-->
<!--                      </span>-->
<!--&lt;!&ndash;                      <span style="font-size: 10px;word-break: break-all;display: flex;justify-content: center;width: 155px;margin-left: 9px">P9900166410#T{{text1}}#V993983#SSW002.005#HHW001.001#NBMS#</span>&ndash;&gt;-->
<!--                    </div>-->
<!--                  </div>-->

<!--                  <div style="margin-top: 42px;display: flex;margin-left: 32px">-->
<!--                    <div ref="canvasWrapper" id="canvasWrapper2" style="width: 30%;flex: 1"></div>-->
<!--                    <div style="width: 70%;flex: 1;margin-top: 18px;margin-right: 17px">-->
<!--                      <span style="margin-left: -80px;font-size: 18px;font-family: FangSong">-->
<!--                        P9900166410#T{{text1}}-->
<!--                      </span><br>-->
<!--                      <span style="margin-left: -80px;font-size: 18px;font-family: FangSong">-->
<!--                        #V993983#SSW002.005#HHW001.001#NMCU#-->
<!--                      </span>-->
<!--                      &lt;!&ndash;                      <span style="font-size: 10px;word-break: break-all;display: flex;justify-content: center;width: 155px;margin-left: 9px">P9900166410#T{{text1}}#V993983#SSW002.005#HHW001.001#NBMS#</span>&ndash;&gt;-->
<!--                    </div>-->
<!--                  </div>-->

<!--                  <div style="text-align: center;margin-left: -130px;margin-top: 42px">-->
<!--                    <span>9900200461</span><br>-->
<!--                    <span>MCU</span><br>-->
<!--                    <span>HW 001.001</span><br>-->
<!--                    <span>SW 001.001</span><br>-->
<!--                  </div>-->

<!--                </div>-->
                <div id="printMe">
                  <offline-qualification-report></offline-qualification-report>
                <div id="printMe" class="print_hide">
                  <offline-qualification-report :printParam="printParam"></offline-qualification-report>
                </div>
                <el-button style="display: none" @click="test1">生成二维码</el-button>
                <el-button style="display: none" @click="test2">生成二维码</el-button>

              </div>
            </el-col>
          </el-tab-pane>
        </el-tabs>
      </el-col>
      <el-col :span="12">
        <el-input v-model="weightValue" placeholder="请输入称重数据"></el-input>
        <el-button @click="enterWeighing">录入</el-button>
      </el-col>
    </el-row>
    <el-dialog v-dialogpop-up :title="title" :visible.sync="open1" width="1000" append-to-body>
      <el-row
        type="flex"
        class="row-bg"
        justify="center"
        v-show="portsList.length === 0"
      >
        <el-col :span="7">
          <div style="margin-top: 400px">
          <span style="display: block">
            仅支持Chrome 89+或者Edge 89+浏览器(安全上下文（HTTPS）中可用)
          </span>
            <el-button type="primary" @click="obtainAuthorization">授权</el-button>
          </div>
        </el-col>
      </el-row>
      <el-form
        v-show="portsList.length > 0"
        ref="form1"
        :model="form1"
        label-width="100px">
        <el-row>
          <el-col :span="24"
          ><div>
            <el-form-item label="串口">
              <el-select
                v-model="form1.port"
                filterable
                placeholder="请选择串口"
                :disabled="isDisable"
              >
                <el-option
                  v-for="item in portsList"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                >
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="波特率">
              <el-autocomplete
                popper-class="my-autocomplete"
                v-model="form1.baudRate"
                :fetch-suggestions="querySearch"
                placeholder="请输入波特率"
                :disabled="isDisable"
              >
                <i class="el-icon-edit el-input__icon" slot="suffix"> </i>
                <template slot-scope="{ item }">
                  <div class="name">{{ item.value }}</div>
                  <span class="addr">{{ item.address }}</span>
                </template>
              </el-autocomplete>
            </el-form-item>
            <el-form-item label="数据位">
              <el-select
                v-model="form1.dataBits"
                placeholder="请选择数据位"
                :disabled="isDisable"
              >
                <el-option label="7" value="7"></el-option>
                <el-option label="8" value="8"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="停止位">
              <el-select
                v-model="form1.stopBits"
                placeholder="请选择停止位"
                :disabled="isDisable"
              >
                <el-option label="1" value="1"></el-option>
                <el-option label="2" value="2"></el-option>
              </el-select>
            </el-form-item>

            <el-form-item label="校验位">
              <el-select
                v-model="form1.parity"
                placeholder="请选择校验位"
                :disabled="isDisable"
              >
                <el-option label="None" value="none"></el-option>
                <el-option label="Even" value="even"></el-option>
                <el-option label="Odd" value="odd"></el-option>
              </el-select>
            </el-form-item>

            <el-form-item label="流控制">
              <el-select
                v-model="form1.flowControl"
                placeholder="请选择流控制"
                :disabled="isDisable"
              >
                <el-option label="None" value="none"></el-option>
                <el-option label="HardWare" value="hardware"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="显示历史">
              <el-switch
                v-model="form1.isShowHistory"
                @change="loadHistory"
              ></el-switch>
              <el-button
                type="danger"
                icon="el-icon-delete"
                circle
                title="清空历史"
                @click="clearHistory"
              ></el-button>
            </el-form-item>
            <el-form-item label="发送区设置" v-show="isShowSendArea">
              <el-form-item label="发送格式">
                <el-radio-group v-model="form1.type">
                  <el-radio label="1">ASCII</el-radio>
                  <el-radio label="2">HEX</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item label="发送信息">
                <el-input type="textarea" v-model="form1.sendMsg"></el-input>
              </el-form-item>
              <el-button type="primary" @click="sendCommon">发送</el-button>
            </el-form-item>

            <el-form-item>
              <el-button :type="btnType" @click="connectBtn">{{
                  btnText
                }}</el-button>
              <el-button type="info" @click="obtainAuthorization"
              >新增授权</el-button
              >
            </el-form-item>
          </div>
          </el-col>
        </el-row>
      </el-form>
    </el-dialog>
  </div>
</template>
<script>
@@ -317,6 +67,10 @@
  components: {OfflineQualificationReport},
  data() {
    return {
      printParam: {
        key: '选项1',
        label: '黄金糕'
      },
      weightValue: '',
      showInput: true,
      serialPortContent: '',
@@ -398,9 +152,6 @@
      text1: '',
    }
  },
  beforeDestroy() {
    this.exit();
  },
  created() {
    this.initStation();
    // this.getStationConfList();
@@ -430,8 +181,17 @@
    isDisable() {
      return this.btnType === "danger";
    },
    printContent() {
      return {
        // id: '',
        // id: '#printMe',
        // preview: false,
      }
    }
  },
  methods: {


    enterWeighing(){
      if(this.headContent.sfcCode ==='' || this.weightValue === '' ){
        this.$message.error('参数不全！');
@@ -548,41 +308,27 @@
      // this.addOverStationCollection()
      this.print1()
    },
    print1() {
      // 新开页面打印
      let newStr = document.getElementById('printMe').innerHTML;
      let newWin = window.open('', '_blank');
      newWin.document.body.innerHTML = newStr;
      newWin.print();
      return false;
    },
    test1(){
      document.getElementById('canvasWrapper1').innerHTML = '';
      this.$nextTick(() => {
        let qrCode = new QRCode('canvasWrapper1',{
          width: 83,
          height: 83,
          text: 'P9900166410#T'+ this.text1 +'#V993983#SSW002.005#HHW001.001#NMCU#',
          colorDark: '#000',
          colorLight: '#fff'
        })
    printBefore() {
      if (this.headContent.sfcCode !== '') {
        document.getElementById('print').click();
      } else {
        alert('请先扫码');
      }
      )
    },
    test2(){
      document.getElementById('canvasWrapper2').innerHTML = '';
      this.$nextTick(() => {
          let qrCode = new QRCode('canvasWrapper2',{
            width: 83,
            height: 83,
            text: 'P9900166410#T'+ this.text1 +'#V993983#SSW002.005#HHW001.001#NMCU#',
            colorDark: '#000',
            colorLight: '#fff'
          })
        }
      )
    },

    // print1() {
    //   if(this.headContent.sfcCode !== ''){
    //     // 新开页面打印
    //     const value = 'Hello, Parent!';
    //     this.$emit('value-sent', value);
    //     let newStr = document.getElementById('printMe').innerHTML;
    //     let newWin = window.open('', '_blank');
    //     newWin.document.body.innerHTML = newStr;
    //     newWin.print();
    //     return;
    //   }else {
    //     this.$message.error('请先扫码');
    //   }
    // },
    /** 入站增加过站采集记录 **/
    addOverStationCollection(){
      this.passingStationForm = {
@@ -598,20 +344,6 @@
      addPassingStationCollection(this.passingStationForm).then(response => {});
      yzAddBasicParameters(this.passingStationForm).then(response => {});
    },
    exit() {
      if (this.ws) {
        this.ws.close();
        this.ws = null;
      }
    },
    send() {
      if (this.ws) {
        this.ws.send(this.message);
      } else {
        alert("未连接到服务器");
      }
    },

    initStation: async function () {
      await getIpv4().then(response => {
        this.StationConfQueryParams.ipAddress = response.msg
@@ -939,6 +671,7 @@
}

</script>

<style scoped>
.div1, .div2 {
  flex: 1; /* 两个div平分容器宽度 */