loulijun2021
2022-08-11 f3335e01ea71614db9fa6aedf1d35e1202c3b12f
src/views/scgl/sckbg.vue
@@ -1,6 +1,6 @@
<template>
  <div>
    <div class="body" style="padding: 0;height: 100%" :style="{height:mainHeight+'px'}">
    <div class="body" style="padding-top: 10px;" :style="{height:mainHeight+'px'}">
      <el-tabs ref="elTabs" v-model="activeName" type="border-card" @tab-click="tabClick">
        <el-tab-pane label="生产列表">
          <div style="margin-left: 10px;margin-top:10px;display: flex;justify-content: space-between">
@@ -30,9 +30,9 @@
          <div class="elTableDiv">
            <el-table
              :data="tableData"
              :height="tableHeight+'px'"
              :height="isIpad? (tableHeight+50):tableHeight"
              border
              stripe
              :row-class-name="tableRowClassName"
              :style="{width: 100+'%',height:tableHeight+'px',}"
              highlight-current-row
              :header-cell-style="this.$headerCellStyle"
@@ -125,6 +125,7 @@
                label="计划开工日期"
                width="185"
                sortable="custom"
                fixed="right"
              />
              <!--              <el-table-column-->
              <!--                label="操作"-->
@@ -147,7 +148,7 @@
            :page.sync="form.page"
            :limit.sync="form.rows"
            align="right"
            layout="prev, pager, next,sizes"
            layout="total,prev, pager, next,sizes"
            popper-class="select_bottom"
            @pagination="getMesOrderStepSearch"
          />
@@ -192,9 +193,9 @@
          <div class="elTableDiv">
            <el-table
              :data="WXtableData"
              :height="tableHeight+'px'"
              :height="isIpad? (tableHeight+50):tableHeight"
              border
              stripe
              :row-class-name="tableRowClassName"
              :style="{width: 100+'%',height:tableHeight+'px',}"
              highlight-current-row
              :header-cell-style="this.$headerCellStyle"
@@ -286,6 +287,7 @@
                label="计划开工日期"
                width="185"
                sortable="custom"
                fixed="right"
              />
              <!--              <el-table-column-->
              <!--                label="操作"-->
@@ -308,7 +310,7 @@
            :page.sync="WXform.page"
            :limit.sync="WXform.rows"
            align="right"
            layout="prev, pager, next,sizes"
            layout="total,prev, pager, next,sizes"
            popper-class="select_bottom"
            @pagination="getMesOrderStepSearch"
          />
@@ -320,7 +322,7 @@
    <el-dialog
      :title="dialogTitle"
      :visible.sync="dialogVisible"
      width="800"
      width="850px"
      class="dialogVisible"
      :top="dialogTitle==='自制报工'?'5vh':'15vh'"
      :close-on-click-modal="false"
@@ -453,7 +455,7 @@
          <el-table
            :data="userTableData"
            border
            stripe
            :row-class-name="tableRowClassName"
            :header-cell-style="this.$headerCellStyle"
            :cell-style="this.$cellStyle"
            height="180"
@@ -464,6 +466,7 @@
              width="100"
              label="序号"
              type="index"
              fixed
            />
            <el-table-column
              prop="username"
@@ -490,6 +493,7 @@
            <el-table-column
              prop="RowNum"
              label="操作"
              fixed="right"
            >
              <template slot-scope="{row}">
                <div class="operationClass">
@@ -507,7 +511,7 @@
            :page.sync="Userform.page"
            :limit.sync="Userform.rows"
            align="right"
            layout="prev, pager, next,sizes"
            layout="total,prev, pager, next,sizes"
            popper-class="select_bottom"
            @pagination="getMesOrderStepSearch"
          />
@@ -655,6 +659,69 @@
        </div>
      </span>
    </el-dialog>
    <!--打印预览页面-->
    <el-dialog
      title="预览"
      :visible.sync="dialogVisible2"
      width="1140"
      :close-on-click-modal="false"
      @close="dialogVisible2Close"
    >
      <!-- 要打印的区域 -->
      <div id="printMe2" style="padding: 30px;">
        <div
          style="display: flex;width: 250px;height: 150px;border: 1px solid #000;text-align: center;font-size: 10px;"
        >
          <div style="width: 60px;display: flex;flex-direction: column;border-right: 1px solid #000">
            <div
              style="display: flex;height: 75%;border-bottom:1px solid #000;justify-content: center;align-items: center "
            >
              <div id="qrCode2" ref="qrCodeDiv2" />
            </div>
            <div style="display: flex;height: 25%;justify-content: flex-start;align-items: center">
              <div style="margin-left: 5px;width: 40px">数量:</div>
              {{ qrForm.startqty }}
            </div>
          </div>
          <div style="width:190px;display: flex;flex-direction: column">
            <div
              style="display: flex;height: 25%;border-bottom:1px solid #000;justify-content: flex-start;align-items: center;text-align: left"
            >
              <div style="width: 60px;margin-left: 5px;">工单编号:</div>
              <div>{{ qrForm.wo_code }}</div>
            </div>
            <div
              style="display: flex;height: 25%;border-bottom:1px solid #000;justify-content: flex-start;align-items: center ;text-align: left"
            >
              <div style="width: 60px;margin-left: 5px;">产品编码:</div>
              <div>{{ qrForm.partcode }}</div>
            </div>
            <div
              style="display: flex;height: 25%;border-bottom:1px solid #000 ;justify-content: flex-start;align-items: center;text-align: left"
            >
              <div style="width:60px;margin-left: 5px;">产品名称:</div>
              <div>{{ qrForm.partname }}</div>
            </div>
            <div style="display: flex;height: 25%;justify-content: flex-start;align-items: center;text-align: left">
              <div style="width: 60px;margin-left: 5px;">下道工序:</div>
              <div>{{ qrForm.nextstepname }}</div>
            </div>
          </div>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <div class="footerButton">
          <el-button @click="dialogVisible2 = false">取 消</el-button>
          <el-button v-print="printObj2" type="primary">确 定</el-button>
        </div>
      </span>
    </el-dialog>
  </div>
</template>
@@ -677,6 +744,7 @@
  SavaMesOrderStepReport
} from '@/api/scgl'
import { urlAddRandomNo, webapp_ws_ajax_run, webapp_ws_autoupdate } from '@/utils/grwebapp'
import QRCode from 'qrcodejs2'
const SER_HZ = /^[\u4e00-\u9fa5]+$/
export default {
@@ -706,6 +774,7 @@
    return {
      mainHeight: 0,
      tableHeight: 0,
      isIpad: false,
      // produceCode: '', // 工序码
      // WXproduceCode: '', // 外协工序码
      radioSelected: '', // 工序选中
@@ -813,9 +882,53 @@
          { required: true, message: '请输入报工数量', trigger: ['blur', 'change'] }
        ]
      },
      activeName: ''
      activeName: '',
      dialogVisible2: false,
      printObj2: {
        id: 'printMe2',
        popTitle: '打印模板',
        preview: false,
        extraHead: '<meta http-equiv="Content-Language" content="zh-cn"/>',
        closeCallback(vue) { // 关闭打印的回调事件(无法确定点击的是确认还是取消)
          console.log('11212', vue)
          // vue.dialogVisible = false
          vue.dialogVisible2 = false
          vue.dialogVisible = false
        },
        beforeOpenCallback(vue) {
          vue.printLoading = true
          console.log('打开之前')
          console.log()
        },
        openCallback(vue) {
          vue.printLoading = false
          console.log('执行了打印')
        }
      },
      qrForm: {
        qrvalue: '',
        startqty: '',
        wo_code: '',
        partcode: '',
        partname: '',
        nextstepname: ''
      }
    }
  },
  // computed: {
  //   qrLink: function() {
  //     return this.$store.getters.getPreviewUrl
  //   }
  // },
  // watch: {
  //   qrLink: function(newVal, oldNew) {
  //     if (newVal !== oldNew) {
  //       this.$nextTick(() => {
  //         this.bindQRCode(newVal)
  //       })
  //     }
  //   }
  // },
  created() {
    this.getMesOrderStepSearch()
    this.tabClick()
@@ -826,11 +939,15 @@
    this.$nextTick(() => {
      $("input[name='produceCode']")[0].focus()
      // this.bindQRCode('10001;001')
    })
    // webapp_urlprotocol_startup()
    webapp_ws_autoupdate(true)
    // webapp_ws_autoupdate(true)
  },
  methods: {
    tableRowClassName({ row, rowIndex }) {
      return 'custom-row'
    },
    async getMesOrderStepSearch() {
      const res = await MesOrderStepSearch(this.form)
      if (res.code === '200') {
@@ -1141,6 +1258,10 @@
    },
    // 用户列表保存
    userSave(row) {
      console.log(row, 123)
      if (row.usercode === '') {
        return this.$message.info('人员名称不能为空!')
      }
      this.userTableData.forEach(item => {
        if (item.number === row.number) {
          item.isVisible = 0
@@ -1265,9 +1386,10 @@
            }
            SavaMesOrderStepIn(data).then(res => {
              if (res.code === '200') {
                this.WXprint()
                this.WXprint2()
                this.$message.success('收料成功!')
                this.dialogVisible = false
                this.dialogVisible2 = true
                this.tabClick()
              } else {
                this.$message.error('收料失败!')
@@ -1327,11 +1449,13 @@
              ngqty: this.dialogForm.noputqty === '' ? 0 : this.dialogForm.noputqty, // 不良数量
              badcode: this.dialogForm.badcode.length < 1 ? '' : this.dialogForm.badcode.join(';')// 不良原因
            }
            SavaMesOrderStepReport(data).then(res => {
              if (res.code === '200') {
                this.ZZprint()
                this.ZZprint2()
                this.$message.success('报工成功!')
                this.dialogVisible = false
                this.dialogVisible2 = true
                this.tabClick()
              } else {
                this.$message.error('报工失败!')
@@ -1341,57 +1465,62 @@
        }
      })
    },
    async ZZprint() {
      const obj = {
        recordset: [
          {
            wo_code: this.dialogForm.wo_code, // 工单编号
            partcode: this.dialogForm.partcode, // 产品编码
            partname: this.dialogForm.partname, // 产品名称
            next_stepname: this.dialogForm.nextstepname, // 下道工序
            qty: this.dialogForm.startqty, // 数量
            // qrcode: this.form.orderstepqrcode// 二维码
            qrcode: this.dialogForm.wo_code + ';' + this.dialogForm.nextstepcode // 二维码
          }
        ]
      }
      const args = {
        type: 'print', // preview  print
        showOptionDlg: false, // 如果不显示打印对话框而直接打印,将此行注释去掉即可
        report: urlAddRandomNo('./static/grf/报工产出标签.grf'),
        data: obj
      }
      webapp_ws_ajax_run(args)
    // 生成二维码
    bindQRCode(text) {
      new QRCode(this.$refs.qrCodeDiv2, {
        text: text,
        width: 50,
        height: 50,
        colorDark: '#000', // 二维码颜色
        colorLight: '#ffffff', // 二维码背景色
        correctLevel: QRCode.CorrectLevel.L// 容错率,L/M/H
      })
    },
    // 外协收料打印
    WXprint() {
      // 参数具体说明请参考帮助文档中的“WEB报表(B/S报表)->WEB报表客户端->启动参数说明”部分
      const obj = {
        recordset: [
          {
            wo_code: this.dialogForm.wo_code, // 工单编号
            partcode: this.dialogForm.partcode, // 产品编码
            partname: this.dialogForm.partname, // 产品名称
            next_stepname: this.dialogForm.nextstepname, // 下道工序
            qty: this.dialogForm.sqty, // 数量
            // qrcode: this.WXform.orderstepqrcode// 二维码
            qrcode: this.dialogForm.wo_code + ';' + this.dialogForm.nextstepcode// 二维码
          }
        ]
      }
      const args = {
        type: 'print', // preview  print
        showOptionDlg: false, // 如果不显示打印对话框而直接打印,将此行注释去掉即可
        report: urlAddRandomNo('./static/grf/外协收料标签.grf'),
        data: obj
      }
      webapp_ws_ajax_run(args)
    ZZprint2() {
      this.qrForm.qrvalue = this.dialogForm.wo_code + ';' + this.dialogForm.nextstepcode
      this.qrForm.startqty = this.dialogForm.startqty
      this.qrForm.wo_code = this.dialogForm.wo_code
      this.qrForm.partcode = this.dialogForm.partcode
      this.qrForm.partname = this.dialogForm.partname
      this.qrForm.nextstepname = this.dialogForm.nextstepname
      this.$nextTick(() => {
        this.bindQRCode(this.qrForm.qrvalue)
        console.log(this.$refs.qrCodeDiv2, 123)
        // console.log(this.$refs.qrCodeDiv2.querySelectorAll('#qrCode2>img'), 1)
        // console.log(this.$refs.qrCodeDiv2.querySelectorAll('#qrCode2>canvas'), 2)
      })
    },
    WXprint2() {
      this.qrForm.qrvalue = this.dialogForm.wo_code + ';' + this.dialogForm.nextstepcode
      this.qrForm.startqty = this.dialogForm.sqty
      this.qrForm.wo_code = this.dialogForm.wo_code
      this.qrForm.partcode = this.dialogForm.partcode
      this.qrForm.partname = this.dialogForm.partname
      this.qrForm.nextstepname = this.dialogForm.nextstepname
      this.$nextTick(() => {
        this.bindQRCode(this.qrForm.qrvalue)
      })
    },
    dialogVisible2Close() {
      this.qrForm.qrvalue = ''
      this.qrForm.startqty = ''
      this.qrForm.wo_code = ''
      this.qrForm.partcode = ''
      this.qrForm.partname = ''
      this.qrForm.nextstepname = ''
      this.$refs.qrCodeDiv2 = ''
    },
    // 获取页面高度
    getHeight() {
      this.$nextTick(() => {
        this.mainHeight = window.innerHeight - 250
        this.tableHeight = this.mainHeight - 80
        this.mainHeight = window.innerHeight - 85
        this.tableHeight = this.mainHeight - 220
        this.isIpad = window.innerHeight < 769
        if (window.innerHeight < 769) {
          this.tableHeight = this.tableHeight - 50
        }
      })
    }
  }
@@ -1400,124 +1529,15 @@
<style lang="scss" scoped>
$main_color: #42b983;
::v-deep .el-button--primary {
  background-color: $main_color !important;
  height: 30px;
  display: flex;
  align-items: center;
  //border: 1px solid $main_color;
  border: none;
  padding: 0 20px;
}
::v-deep .el-button--primary:hover {
  border: none;
}
::v-deep .el-button--info {
  height: 30px;
  display: flex;
  align-items: center;
  padding: 0 20px;
}
::v-deep .el-pagination.is-background .el-pager li:not(.disabled).active {
  background-color: $main_color !important;
}
::v-deep .el-dialog__footer {
  display: flex;
  justify-content: flex-end;
}
.footerButton {
  display: flex;
  justify-content: end;
}
::v-deep .el-button--default {
  background-color: #ffffff !important;
  height: 30px;
  display: flex;
  align-items: center;
  padding: 0 20px;
}
::v-deep .el-button--default:hover {
  color: #606266;
}
::v-deep .el-dialog__body {
  padding: 20px 100px !important;
}
::v-deep .el-radio__input.is-checked .el-radio__inner {
  background-color: $main_color;
  border-color: $main_color;
}
::v-deep .el-radio__input.is-checked + .el-radio__label {
  color: $main_color !important;
}
::v-deep .el-checkbox__input.is-checked .el-checkbox__inner {
  border-color: $main_color;
  background-color: $main_color;
}
::v-deep .el-input__inner {
  height: 30px;
  line-height: 30px;
}
::v-deep .el-input__inner:focus {
  border-color: $main_color;
}
::v-deep .el-table .caret-wrapper {
  transform: scale(0.8);
}
::v-deep .cell {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}
::v-deep .el-button--text {
  color: $main_color;
.el-button--text{
  font-size: 14px;
  cursor: pointer;
}
.operationClass {
  height: 23px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.el-icon-share {
  color: $main_color;
  cursor: pointer;
}
.el-checkbox.is-bordered.is-checked {
  border-color: $main_color;
}
::v-deep .el-radio__input.is-checked .el-radio__inner {
  border-color: $main_color;
  background: $main_color;
}
::v-deep .el-checkbox__input.is-indeterminate .el-checkbox__inner {
  border-color: $main_color;
  background: $main_color;
}
::v-deep .el-checkbox__input.is-checked + .el-checkbox__label {
  color: $main_color !important;
}
::v-deep .el-checkbox.is-bordered + .el-checkbox.is-bordered {
@@ -1532,36 +1552,6 @@
  margin: 10px 30px 0px 0;
}
.body ::v-deep .el-divider {
  border: 1px solid #eee;
  width: 99%;
  margin: 10px auto;
}
.body ::v-deep .el-form-item {
  margin-bottom: 0;
}
::v-deep .el-input__inner:focus {
  border-color: $main_color;
}
::v-deep .el-select .el-input__inner:focus {
  border-color: $main_color;
}
::v-deep .el-select-dropdown__item.selected {
  color: $main_color;
}
::v-deep .el-checkbox__inner:hover {
  border-color: $main_color;
}
::v-deep .el-textarea__inner:focus {
  border-color: $main_color;
}
//.dialogVisible{
::v-deep .el-select .el-input .el-select__caret {
  display: flex;
@@ -1576,3 +1566,104 @@
  }
}
</style>
<style media="print">
/*@media print {*/
@page {
  size: auto;
  margin: 3mm;
  font-size: 10px;
}
</style>
<!--公共页面样式-->
<style lang="scss" scoped>
$main_color: #42b983;
.el-icon-share ,.el-icon-delete,.el-icon-edit-outline{
  color: $main_color;
  cursor: pointer;
}
.el-icon-edit-outline{
  margin-right: 15px;
}
::v-deep .el-button--primary, .el-button--default, .el-button--info {
  height: 34px;
  display: flex;
  align-items: center;
  padding: 0 15px;
}
::v-deep .el-button--primary {
  //background-color: $main_color !important;
}
::v-deep .el-button--default {
  background-color: #f8f8fa;
  border: none;
}
::v-deep .el-input__inner {
  height: 34px;
  line-height: 34px;
  //color: #a7a7a7;
}
::v-deep .el-dialog__body {
  padding: 20px 100px !important;
}
::v-deep .dialogVisibleRoles .el-dialog__body {
  padding: 20px 20px !important;
}
::v-deep .importPickerClass .el-dialog__body {
  padding: 20px 20px !important;
}
::v-deep .el-dialog__footer {
  display: flex;
  justify-content: flex-end;
}
::v-deep .el-table .caret-wrapper {
  transform: scale(0.8);
}
::v-deep .cell {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
::v-deep .el-table::before {
  height: 0;
}
::v-deep .el-table__body-wrapper {
  background-color: #f8f8fa;
}
::v-deep .el-table__body .el-table__row.hover-row td{
  background-color: #eaecef ;
}
::v-deep .el-form--inline .el-form-item__label {
  color: #a7a7a7;
}
.body ::v-deep .el-divider {
  border: 1px solid #eee;
  width: 99%;
  margin: 10px auto;
}
.body ::v-deep .el-form-item {
  margin-bottom: 0;
}
</style>
<style>
.el-table .custom-row {
  background: #f8f8fa;
}
</style>