anrui/yxt-as-ui/src/views/workFlow/allocationByBranchesFlow/allocationByBranchesYiBan.vue

<template>
  <div class="app-container">
    <div class="tab-header webtop">
      <div>调拨详情</div>
      <div>
        <el-button type="danger" size="small" @click="openRevoke()">撤回</el-button>
      </div>
    </div>
    <div class="">

      <el-form ref="form_obj" :model="formobj" class="formaddcopy02">

        <el-row style="border-top: 1px solid #e0e3eb">

          <el-col :span="8">
            <div class="span-sty">申请人</div>
            <el-form-item><span class="addinputInfo">{{ formobj.createByName }}</span></el-form-item>
          </el-col>
          <el-col :span="8">
            <div class="span-sty">申请部门</div>
            <el-form-item><span class="addinputInfo">{{ formobj.deptName }}</span></el-form-item>
          </el-col>
          <el-col :span="8">
            <div class="span-sty">申请日期</div>
            <el-form-item><span class="addinputInfo">{{ formobj.createTime }}</span></el-form-item>
          </el-col>
        </el-row>

        <el-row>

          <el-col :span="8">
            <div class="span-sty">调出站</div>
            <el-form-item><span class="addinputInfo">{{ formobj.outPlatName }}</span></el-form-item>
          </el-col>
          <el-col :span="5">
            <div class="span-sty">调入站</div>
            <el-form-item><span class="addinputInfo">{{ formobj.inOrgName }}</span></el-form-item>
          </el-col>
          <el-col :span="3">
            <el-form-item><span style="width: 100%;">{{ formobj.inPlatName }}</span></el-form-item>
          </el-col>
          <el-col :span="8">
            <div class="span-sty">经办人</div>
            <el-form-item><span class="addinputInfo">{{ formobj.confirmName }}</span></el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="24">
            <div class="span-sty">备注</div>
            <el-form-item><span class="addinputInfo">{{ formobj.remarks }}</span></el-form-item>
          </el-col>
        </el-row>


        <div class="title titleOne">
          <div>调拨商品列表</div>
        </div>

        <el-table :data="formobj.wmsInventoryAllocateBillDetailNewList" :index="index" border style="width: 100%;"
          show-summary :summary-method="getSummaries">
          <el-table-column fixed width="60" label="序号" type="index" :index="index + 1" align="center" />
          <el-table-column prop="goodsID" label="商品ID" align="center" />
          <el-table-column prop="goodsSpuName" label="商品名称" align="center" />
          <el-table-column prop="goodsSkuCode" label="商品编码" align="center" />
          <el-table-column prop="goodsSkuOwnSpec" label="型号" align="center" />
          <el-table-column prop="unit" label="单位" align="center" />
          <el-table-column prop="warehouseName" label="仓库" width="150" align="center" />
          <el-table-column prop="warehouseArea" label="仓库" width="150" align="center" />
          <el-table-column prop="warehouseRackCode" label="库位" align="center" />
          <el-table-column prop="stockCount" label="库存数量" align="center" />
          <el-table-column prop="markUpRatio" label="加价比例" align="center" />
          <el-table-column prop="requAmount" label="调拨单价" align="center" />
          <el-table-column prop="count" label="调拨数量" align="center" />
          <el-table-column prop="amount" label="调拨金额" align="center" width="100" />
        </el-table>
      </el-form>
    </div>
  </div>
</template>

<script>
  import req from '@/api/storage/allocation.js'
  export default {
    data() {
      return {
        index: 0,
        formobj: {},
        // 环节所需参数
        linkByParameter: {
          businessSid: '',
          comment: '',
          instanceId: '',
          taskId: '',
          orgSidPath: '',
          taskDefKey: '',
          userSid: ''
        },
      }
    },
    created() {
      console.log('url:' + window.location.href)
      var one = window.location.href.indexOf('&data') + 6
      const data = window.location.href.substr(one) // url解码unescape()已从web中移除,尽量不使用
      const obj = JSON.parse(decodeURIComponent(data))
      console.log('iframe页面获取的obj:', obj)
      // 点击（同意、终止、驳回、驳回）操作时所需的参数
      this.linkByParameter.businessSid = obj.businessSid
      this.linkByParameter.instanceId = obj.instanceId
      this.linkByParameter.taskId = obj.taskId
      this.linkByParameter.taskDefKey = obj.taskDefKey
      this.linkByParameter.userSid = window.sessionStorage.getItem('userSid')
      // 加载表单数据
      this.showInfo(obj.businessSid)
    },
    mounted() {
      window.parent.postMessage({
        cmd: 'returnHeight',
        params: {
          // 告诉父级页面，子页面的弹框高度。
          code: 2,
          data: 500 + 'px'
        }
      }, '*')
    },
    methods: {
      // 合计
      getSummaries(param) {
        const {
          columns,
          data
        } = param
        const sums = []
        columns.forEach((column, index) => {
          if (index === 0) {
            sums[index] = '合计'
            return
          }
          const values = data.map(item => Number(item[column.property]))
          if (column.property === 'count') {
            sums[index] = values.reduce((prev, curr) => {
              const value = Number(curr)
              if (!isNaN(value)) {
                return prev + curr
              } else {
                return prev
              }
            }, 0)
            sums[index] += ''
          } else if (column.property === 'amount') {
            sums[index] = values.reduce((prev, curr) => {
              const value = Number(curr)
              if (!isNaN(value)) {
                return prev + curr
              } else {
                return prev
              }
            }, 0)
            sums[index] += ''
          }
        })
        return sums
      },


      showInfo(sid) {
        this.$nextTick(() => {
          this.$refs['form_obj'].clearValidate()
        })
        req.init(sid).then((res) => {
          if (res.success) {
            this.formobj = res.data
          }
        })
      },

      /** 确认撤回任务 */
      openRevoke() {
        this.$confirm('是否确认执行撤回操作', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.handleRevoke()
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消撤回'
          })
        })
      },
      /** 撤回任务 */
      handleRevoke() {
        req.revokeProcess(this.linkByParameter).then((response) => {
          if (response.success) {
            this.$notify({
              title: '提示',
              message: '执行成功',
              type: 'success',
              duration: 2000
            })
            this.nodeDialogVisible = false
            // 子页面向父级页面传递值
            window.parent.postMessage({
              cmd: 'returnHeight',
              params: {
                // 操作成功，告诉父级页面关闭弹框
                code: 1
              }
            }, '*')
          }
        })
      }
    }
  }
</script>

<style scoped>
  .span-sty {
    width: 130px !important;
  }

  .addinputInfo {
    margin-left: 120px !important;
  }
</style>