projects/mes-test #133
							
								
								
									
										4
									
								
								.env.dev
									
									
									
									
									
								
							
							
						
						
									
										4
									
								
								.env.dev
									
									
									
									
									
								
							@@ -13,11 +13,11 @@ VUE_APP_TITLE = MES系统
 | 
			
		||||
 | 
			
		||||
# 芋道管理系统/开发环境
 | 
			
		||||
 | 
			
		||||
# VUE_APP_BASE_API = 'http://192.168.0.33:48082'
 | 
			
		||||
VUE_APP_BASE_API = 'http://192.168.0.33:48082'
 | 
			
		||||
# VUE_APP_BASE_API = 'http://192.168.2.173:48080'
 | 
			
		||||
# VUE_APP_BASE_API = 'http://192.168.1.49:48080'
 | 
			
		||||
# VUE_APP_BASE_API = 'http://192.168.1.8:48080'
 | 
			
		||||
VUE_APP_BASE_API = 'http://192.168.1.56:48080'
 | 
			
		||||
# VUE_APP_BASE_API = 'http://192.168.1.56:48080'
 | 
			
		||||
# VUE_APP_BASE_API = 'http://192.168.1.188:48080'
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 
 | 
			
		||||
							
								
								
									
										73
									
								
								src/api/base/delivery.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										73
									
								
								src/api/base/delivery.js
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,73 @@
 | 
			
		||||
// 成品发货
 | 
			
		||||
import request from '@/utils/request'
 | 
			
		||||
// 获得成品发货清单分页
 | 
			
		||||
export function deliveryLogPage(data) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/extend/delivery-log/page',
 | 
			
		||||
    method: 'post',
 | 
			
		||||
    data: data
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获取发货进度分页
 | 
			
		||||
export function deliveryProgressPage(data) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/extend/delivery-progress/page',
 | 
			
		||||
    method: 'post',
 | 
			
		||||
    data: data
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获取发货进度分页
 | 
			
		||||
export function deliveryLogDetPage(data) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/extend/delivery-log-det/page',
 | 
			
		||||
    method: 'post',
 | 
			
		||||
    data: data
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 创建成品发货清单
 | 
			
		||||
export function deliveryLogCreate(data) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/extend/delivery-log/create',
 | 
			
		||||
    method: 'post',
 | 
			
		||||
    data: data
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 更新成品发货清单
 | 
			
		||||
export function deliveryLogUpdate(data) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/extend/delivery-log/update',
 | 
			
		||||
    method: 'put',
 | 
			
		||||
    data: data
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获得成品发货清单
 | 
			
		||||
export function getDeliveryLog(query) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/extend/delivery-log/get',
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 删除成品发货清单
 | 
			
		||||
export function deliveryLogDelete(query) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/extend/delivery-log/delete',
 | 
			
		||||
    method: 'delete',
 | 
			
		||||
    params: query
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 装车
 | 
			
		||||
export function deliveryLogDetCreate(data) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/extend/delivery-log-det/create',
 | 
			
		||||
    method: 'post',
 | 
			
		||||
    data: data
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
@@ -94,3 +94,47 @@ export function orderIssue(data) {
 | 
			
		||||
    data: data
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获得工单
 | 
			
		||||
export function getWorkOrderById(query) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/core-work-order/get',
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 订单监控
 | 
			
		||||
export function orderMonitor(query) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/order/orderMonitor',
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获得所有客户列表
 | 
			
		||||
export function customerList() {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/core-customer/listAll',
 | 
			
		||||
    method: 'get'
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获得订单详情
 | 
			
		||||
export function orderDetail(query) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/order/getDetail',
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 产品bom消耗信息
 | 
			
		||||
export function bomUseNum(query) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material-product-bom/bomUseNum',
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
@@ -14,4 +14,13 @@ export function getWorker(query) {
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获得该班组其他可选组员列表(除去现有组员)
 | 
			
		||||
export function otherWorkerList(query) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/group-team-det/otherWorkerList',
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
@@ -16,4 +16,13 @@ export function getSchedulingMonitoringRecord(query) {
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获得所有列表
 | 
			
		||||
export function groupClassesListAll(query) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/group-classes/listAll',
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
@@ -180,6 +180,7 @@ input, textarea{
 | 
			
		||||
// 抽屉head区域---start
 | 
			
		||||
.el-drawer__header {
 | 
			
		||||
  padding-bottom: 20px;
 | 
			
		||||
  padding-left: 30px;
 | 
			
		||||
  margin-bottom: 23px;
 | 
			
		||||
  font-size: 20px;
 | 
			
		||||
  font-weight: 500;
 | 
			
		||||
 
 | 
			
		||||
							
								
								
									
										162
									
								
								src/views/delivery/deliveryLog/components/addOrUpdate.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										162
									
								
								src/views/delivery/deliveryLog/components/addOrUpdate.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,162 @@
 | 
			
		||||
<template>
 | 
			
		||||
  <el-form ref="addOrUpdate" :rules="rules" label-width="130px" :model="form">
 | 
			
		||||
    <el-row>
 | 
			
		||||
      <el-col :span='12'>
 | 
			
		||||
        <el-form-item label="订单名" prop="orderId">
 | 
			
		||||
          <el-select v-model="form.orderId" placeholder="请选择" style="width: 100%;">
 | 
			
		||||
            <el-option
 | 
			
		||||
              v-for="item in orderList"
 | 
			
		||||
              :key="item.id"
 | 
			
		||||
              :label="item.name"
 | 
			
		||||
              :value="item.id">
 | 
			
		||||
            </el-option>
 | 
			
		||||
          </el-select>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
      <el-col :span='12'>
 | 
			
		||||
        <el-form-item label="发货单名称" prop="name">
 | 
			
		||||
          <el-input v-model="form.name"></el-input>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
    </el-row>
 | 
			
		||||
    <el-row>
 | 
			
		||||
      <el-col :span='12'>
 | 
			
		||||
        <el-form-item label="发货时间" prop="deliveryTime">
 | 
			
		||||
          <el-date-picker
 | 
			
		||||
            v-model="form.deliveryTime"
 | 
			
		||||
            type="datetime"
 | 
			
		||||
            format='yyyy-MM-dd HH:mm:ss'
 | 
			
		||||
            value-format="timestamp"
 | 
			
		||||
            style="width: 100%;"
 | 
			
		||||
            placeholder="选择日期">
 | 
			
		||||
          </el-date-picker>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
      <el-col :span='12'>
 | 
			
		||||
        <el-form-item label="发货单号" prop="code">
 | 
			
		||||
          <el-input v-model="form.code"></el-input>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
    </el-row>
 | 
			
		||||
    <el-row>
 | 
			
		||||
      <el-col :span='12'>
 | 
			
		||||
        <el-form-item label="发货负责人" prop="deliveryPersonId">
 | 
			
		||||
          <el-select v-model="form.deliveryPersonId" placeholder="请选择" style="width: 100%;">
 | 
			
		||||
            <el-option
 | 
			
		||||
              v-for="item in personList"
 | 
			
		||||
              :key="item.id"
 | 
			
		||||
              :label="item.name"
 | 
			
		||||
              :value="item.id">
 | 
			
		||||
            </el-option>
 | 
			
		||||
          </el-select>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
      <el-col :span='12'>
 | 
			
		||||
        <el-form-item label="运输负责人" prop="principal">
 | 
			
		||||
          <el-input v-model="form.principal"></el-input>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
    </el-row>
 | 
			
		||||
    <el-row>
 | 
			
		||||
      <el-col :span='12'>
 | 
			
		||||
        <el-form-item label="运输联系方式" prop="principalCall">
 | 
			
		||||
          <el-input v-model="form.principalCall"></el-input>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
      <el-col :span='12'>
 | 
			
		||||
        <el-form-item label="运输费用" prop="principalCost">
 | 
			
		||||
          <el-input-number v-model="form.principalCost" :min="0" :max='9999999999' :precision='2'></el-input-number>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
    </el-row>
 | 
			
		||||
    <el-row>
 | 
			
		||||
      <el-col :span='24'>
 | 
			
		||||
        <el-form-item label="备注" prop="remark">
 | 
			
		||||
          <el-input v-model="form.remark"></el-input>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
    </el-row>
 | 
			
		||||
  </el-form>
 | 
			
		||||
</template>
 | 
			
		||||
<script>
 | 
			
		||||
import { orderList } from '@/api/base/orderManage'
 | 
			
		||||
import { getWorkerList } from '@/api/base/worker'
 | 
			
		||||
import { deliveryLogCreate, deliveryLogUpdate, getDeliveryLog } from '@/api/base/delivery'
 | 
			
		||||
export default {
 | 
			
		||||
  name: 'AddOrUpdate',
 | 
			
		||||
  data() {
 | 
			
		||||
    return {
 | 
			
		||||
      form: {
 | 
			
		||||
        id: '',
 | 
			
		||||
        orderId: '',
 | 
			
		||||
        name: '',
 | 
			
		||||
        code: '',
 | 
			
		||||
        deliveryTime: null,
 | 
			
		||||
        deliveryPersonId: '',
 | 
			
		||||
        principal: '',
 | 
			
		||||
        principalCall: '',
 | 
			
		||||
        principalCost: 0.00,
 | 
			
		||||
        remark: ''
 | 
			
		||||
      },
 | 
			
		||||
      isEdit: false,
 | 
			
		||||
      rules: {
 | 
			
		||||
        orderId: [{ required: true, message: "订单名不能为空", trigger: "change" }],
 | 
			
		||||
        name: [{ required: true, message: "发货单名称不能为空", trigger: "blur" }],
 | 
			
		||||
        code: [{ required: true, message: "发货单号不能为空", trigger: "blur" }]
 | 
			
		||||
      },
 | 
			
		||||
      orderList: [],
 | 
			
		||||
      personList: []
 | 
			
		||||
    }
 | 
			
		||||
  },
 | 
			
		||||
  methods: {
 | 
			
		||||
    init(id) {
 | 
			
		||||
      this.getSelectList()
 | 
			
		||||
      if (id) {
 | 
			
		||||
        this.form.id = id
 | 
			
		||||
        this.isEdit = true
 | 
			
		||||
        getDeliveryLog({id}).then(res => {
 | 
			
		||||
          this.form = res.data || {}
 | 
			
		||||
        })
 | 
			
		||||
      }
 | 
			
		||||
    },
 | 
			
		||||
    getSelectList() {
 | 
			
		||||
      orderList().then(res => {
 | 
			
		||||
        this.orderList = res.data || []
 | 
			
		||||
      })
 | 
			
		||||
      getWorkerList().then(res => {
 | 
			
		||||
        this.personList = res.data || []
 | 
			
		||||
      })
 | 
			
		||||
    },
 | 
			
		||||
    submitForm() {
 | 
			
		||||
      this.$refs['addOrUpdate'].validate((valid) => {
 | 
			
		||||
        if (valid) {
 | 
			
		||||
          console.log(this.form)
 | 
			
		||||
          if (this.isEdit) {
 | 
			
		||||
            //编辑
 | 
			
		||||
            deliveryLogUpdate({ ...this.form }).then((res) => {
 | 
			
		||||
              if (res.code === 0) {
 | 
			
		||||
                this.$modal.msgSuccess("操作成功");
 | 
			
		||||
                this.$emit('successSubmit')
 | 
			
		||||
              }
 | 
			
		||||
            })
 | 
			
		||||
          } else {
 | 
			
		||||
            deliveryLogCreate({ ...this.form }).then((res) => {
 | 
			
		||||
              if (res.code === 0) {
 | 
			
		||||
                this.$modal.msgSuccess("操作成功");
 | 
			
		||||
                this.$emit('successSubmit')
 | 
			
		||||
              }
 | 
			
		||||
            })
 | 
			
		||||
          }
 | 
			
		||||
        } else {
 | 
			
		||||
          return false
 | 
			
		||||
        }
 | 
			
		||||
      })
 | 
			
		||||
    },
 | 
			
		||||
    formClear() {
 | 
			
		||||
      this.$refs.addOrUpdate.resetFields()
 | 
			
		||||
      this.form.principalCost = 0.00
 | 
			
		||||
      this.isEdit = false
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</script>
 | 
			
		||||
							
								
								
									
										170
									
								
								src/views/delivery/deliveryLog/components/deliveryLogDetail.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										170
									
								
								src/views/delivery/deliveryLog/components/deliveryLogDetail.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,170 @@
 | 
			
		||||
<template>
 | 
			
		||||
  <el-drawer
 | 
			
		||||
    title="发货清单详情"
 | 
			
		||||
    size="60%"
 | 
			
		||||
    :append-to-body="true"
 | 
			
		||||
    :visible.sync="centervisible"
 | 
			
		||||
    @close='close'>
 | 
			
		||||
    <div class="box1">
 | 
			
		||||
      <el-row>
 | 
			
		||||
        <el-col :span='12'>
 | 
			
		||||
          <span class="title">订单名:</span>
 | 
			
		||||
          <span class="text">{{orderName ? orderName : '-'}}</span>
 | 
			
		||||
        </el-col>
 | 
			
		||||
        <el-col :span='12'>
 | 
			
		||||
          <span class="title">发货单号:</span>
 | 
			
		||||
          <span class="text">{{code ? code : '-'}}</span>
 | 
			
		||||
        </el-col>
 | 
			
		||||
      </el-row>
 | 
			
		||||
    </div>
 | 
			
		||||
    <div class="box2">
 | 
			
		||||
      <div class="boxTitle">
 | 
			
		||||
        <span class="blueTitle"></span>
 | 
			
		||||
        <span>详情</span>
 | 
			
		||||
      </div>
 | 
			
		||||
      <base-table
 | 
			
		||||
        :page="queryParams.pageNo"
 | 
			
		||||
        :limit="queryParams.pageSize"
 | 
			
		||||
        :table-props="tableProps"
 | 
			
		||||
        :table-data="tableData"
 | 
			
		||||
        :max-height="tableH"
 | 
			
		||||
      />
 | 
			
		||||
      <pagination
 | 
			
		||||
        :page.sync="queryParams.pageNo"
 | 
			
		||||
        :limit.sync="queryParams.pageSize"
 | 
			
		||||
        :total="total"
 | 
			
		||||
        @pagination="getList"
 | 
			
		||||
      />
 | 
			
		||||
    </div>
 | 
			
		||||
  </el-drawer>
 | 
			
		||||
</template>
 | 
			
		||||
<script>
 | 
			
		||||
import { parseTime } from '@/utils/ruoyi'
 | 
			
		||||
import { deliveryLogDetPage } from '@/api/base/delivery'
 | 
			
		||||
const tableProps = [
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'createTime',
 | 
			
		||||
    label: '添加时间',
 | 
			
		||||
    filter: parseTime,
 | 
			
		||||
    minWidth: 150
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'deliveryCarCode',
 | 
			
		||||
    label: '装车单号',
 | 
			
		||||
    showOverflowtooltip: true
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'loadTime',
 | 
			
		||||
    label: '装车时间',
 | 
			
		||||
    filter: parseTime,
 | 
			
		||||
    minWidth: 150
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'productName',
 | 
			
		||||
    label: '装车产品'
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'packagingSize',
 | 
			
		||||
    label: '装箱规格(片/箱)',
 | 
			
		||||
    width: 120
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'packagingNum',
 | 
			
		||||
    label: '箱数'
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'quantity',
 | 
			
		||||
    label: '装车总量'
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'productDate',
 | 
			
		||||
    label: '产品批次',
 | 
			
		||||
    minWidth: 150,
 | 
			
		||||
    showOverflowtooltip: true
 | 
			
		||||
  }
 | 
			
		||||
]
 | 
			
		||||
export default {
 | 
			
		||||
  name: 'DeliveryLogDetail',
 | 
			
		||||
  data() {
 | 
			
		||||
    return {
 | 
			
		||||
      centervisible: false,
 | 
			
		||||
      queryParams: {
 | 
			
		||||
        pageNo: 1,
 | 
			
		||||
        pageSize: 20,
 | 
			
		||||
        logId: ''
 | 
			
		||||
      },
 | 
			
		||||
      total: 0,
 | 
			
		||||
      tableProps,
 | 
			
		||||
      tableData: [],
 | 
			
		||||
      tableH: this.tableHeight(275),
 | 
			
		||||
      orderName: '',
 | 
			
		||||
      code: ''
 | 
			
		||||
    }
 | 
			
		||||
  },
 | 
			
		||||
  mounted() {
 | 
			
		||||
    window.addEventListener('resize', () => {
 | 
			
		||||
      this.tableH = this.tableHeight(275)
 | 
			
		||||
    })
 | 
			
		||||
  },
 | 
			
		||||
  methods: {
 | 
			
		||||
    init(param) {
 | 
			
		||||
      this.orderName = param.orderName
 | 
			
		||||
      this.code = param.code
 | 
			
		||||
      this.queryParams.logId = param.id
 | 
			
		||||
      this.centervisible = true
 | 
			
		||||
      this.getList()
 | 
			
		||||
    },
 | 
			
		||||
    getList() {
 | 
			
		||||
      deliveryLogDetPage({...this.queryParams}).then(res => {
 | 
			
		||||
        this.tableData = res.data.list || []
 | 
			
		||||
        this.total = res.data.total || 0
 | 
			
		||||
      })
 | 
			
		||||
    },
 | 
			
		||||
    close() {
 | 
			
		||||
      this.orderName = ''
 | 
			
		||||
      this.code = ''
 | 
			
		||||
      this.queryParams.pageNo = 1
 | 
			
		||||
      this.queryParams.pageSize = 20
 | 
			
		||||
      this.queryParams.logId = ''
 | 
			
		||||
      this.tableData = []
 | 
			
		||||
      this.total = 0
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</script>
 | 
			
		||||
<style scoped lang='scss'>
 | 
			
		||||
.boxTitle {
 | 
			
		||||
  display: inline-block;
 | 
			
		||||
  font-size: 16px;
 | 
			
		||||
  font-weight: 400;
 | 
			
		||||
  color: #000000;
 | 
			
		||||
  margin:0 10px 10px 0;
 | 
			
		||||
}
 | 
			
		||||
.blueTitle {
 | 
			
		||||
  content: '';
 | 
			
		||||
  display: inline-block;
 | 
			
		||||
  width: 4px;
 | 
			
		||||
  height: 18px;
 | 
			
		||||
  background-color: #0B58FF;
 | 
			
		||||
  border-radius: 1px;
 | 
			
		||||
  margin-right: 8px;
 | 
			
		||||
  vertical-align: bottom;
 | 
			
		||||
}
 | 
			
		||||
.box1 {
 | 
			
		||||
  padding: 8px 8px 8px 40px;
 | 
			
		||||
  .title {
 | 
			
		||||
    height: 16px;
 | 
			
		||||
    font-weight: 600;
 | 
			
		||||
    color: rgba(0,0,0,0.85);
 | 
			
		||||
  }
 | 
			
		||||
  .text {
 | 
			
		||||
    height: 16px;
 | 
			
		||||
    font-weight: 400;
 | 
			
		||||
    color: rgba(102,102,102,0.75);
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
.box2 {
 | 
			
		||||
  padding:32px 32px 30px 30px;
 | 
			
		||||
  height: calc(100vh - 125px);
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
							
								
								
									
										141
									
								
								src/views/delivery/deliveryLog/components/loadedPage.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										141
									
								
								src/views/delivery/deliveryLog/components/loadedPage.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,141 @@
 | 
			
		||||
<template>
 | 
			
		||||
  <el-form ref="addOrUpdate" :rules="rules" label-width="130px" :model="form">
 | 
			
		||||
    <el-row>
 | 
			
		||||
      <el-col :span='12'>
 | 
			
		||||
        <el-form-item label="发货单号">
 | 
			
		||||
          <el-input v-model="code" disabled></el-input>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
      <el-col :span='12'>
 | 
			
		||||
        <el-form-item label="装车单号" prop="deliveryCarCode">
 | 
			
		||||
          <el-input v-model="form.deliveryCarCode"></el-input>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
    </el-row>
 | 
			
		||||
    <el-row>
 | 
			
		||||
      <el-col :span='12'>
 | 
			
		||||
        <el-form-item label="装车时间" prop="loadTime">
 | 
			
		||||
          <el-date-picker
 | 
			
		||||
            v-model="form.loadTime"
 | 
			
		||||
            type="datetime"
 | 
			
		||||
            format='yyyy-MM-dd HH:mm:ss'
 | 
			
		||||
            value-format="timestamp"
 | 
			
		||||
            style="width: 100%;"
 | 
			
		||||
            placeholder="选择日期">
 | 
			
		||||
          </el-date-picker>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
      <el-col :span='12'>
 | 
			
		||||
        <el-form-item label="车辆联系人" prop="contactPerson">
 | 
			
		||||
          <el-input v-model="form.contactPerson"></el-input>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
    </el-row>
 | 
			
		||||
    <el-row>
 | 
			
		||||
      <el-col :span='12'>
 | 
			
		||||
        <el-form-item label="联系方式" prop="contactPersonCall">
 | 
			
		||||
          <el-input v-model="form.contactPersonCall"></el-input>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
      <el-col :span='12'>
 | 
			
		||||
        <el-form-item label="装车产品" prop="productId">
 | 
			
		||||
          <el-select v-model="form.productId" placeholder="请选择" style="width: 100%;">
 | 
			
		||||
            <el-option
 | 
			
		||||
              v-for="item in productList"
 | 
			
		||||
              :key="item.id"
 | 
			
		||||
              :label="item.name"
 | 
			
		||||
              :value="item.id">
 | 
			
		||||
            </el-option>
 | 
			
		||||
          </el-select>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
    </el-row>
 | 
			
		||||
    <el-row>
 | 
			
		||||
      <el-col :span='12'>
 | 
			
		||||
        <el-form-item label="装箱规格(片/箱)" prop="packagingSize">
 | 
			
		||||
          <el-input-number v-model="form.packagingSize" :min="0" :max='9999999999' style="width:100%"></el-input-number>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
      <el-col :span='12'>
 | 
			
		||||
        <el-form-item label="产品批次" prop="productDate">
 | 
			
		||||
          <el-input v-model="form.productDate" placeholder="多个批次用','隔开"></el-input>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
    </el-row>
 | 
			
		||||
    <el-row>
 | 
			
		||||
      <el-col :span='12'>
 | 
			
		||||
        <el-form-item label="箱/托数" prop="packagingNum">
 | 
			
		||||
          <el-input-number v-model="form.packagingNum" :min="0" :max='9999999999' style="width:100%"></el-input-number>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
      <el-col :span='12'>
 | 
			
		||||
        <el-form-item label="装车总量" prop="quantity">
 | 
			
		||||
          <el-input-number v-model="form.quantity" :min="0" :max='9999999999' style="width:100%"></el-input-number>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
    </el-row>
 | 
			
		||||
  </el-form>
 | 
			
		||||
</template>
 | 
			
		||||
<script>
 | 
			
		||||
import { getProductAll } from '@/api/base/product'
 | 
			
		||||
import { deliveryLogDetCreate } from '@/api/base/delivery'
 | 
			
		||||
export default {
 | 
			
		||||
  name: 'LoadedPage',
 | 
			
		||||
  data() {
 | 
			
		||||
    return {
 | 
			
		||||
      form: {
 | 
			
		||||
        logId: '',
 | 
			
		||||
        deliveryCarCode: '',
 | 
			
		||||
        loadTime: null,
 | 
			
		||||
        contactPerson: '',
 | 
			
		||||
        contactPersonCall: '',
 | 
			
		||||
        productId: '',
 | 
			
		||||
        packagingSize: null,
 | 
			
		||||
        productDate: '',
 | 
			
		||||
        packagingNum: null,
 | 
			
		||||
        quantity: null
 | 
			
		||||
      },
 | 
			
		||||
      code: '',
 | 
			
		||||
      rules: {
 | 
			
		||||
        deliveryCarCode: [{ required: true, message: "装车单号不能为空", trigger: "blur" }],
 | 
			
		||||
        productId: [{ required: true, message: "装车产品不能为空", trigger: "change" }],
 | 
			
		||||
        packagingSize: [{ required: true, message: "装箱规格不能为空", trigger: "blur" }],
 | 
			
		||||
        packagingNum: [{ required: true, message: "箱/托数不能为空", trigger: "blur" }],
 | 
			
		||||
        quantity: [{ required: true, message: "装车总量不能为空", trigger: "blur" }]
 | 
			
		||||
      },
 | 
			
		||||
      productList: []
 | 
			
		||||
    }
 | 
			
		||||
  },
 | 
			
		||||
  methods: {
 | 
			
		||||
    init(id, code) {
 | 
			
		||||
      this.getSelectList()
 | 
			
		||||
      this.form.logId = id
 | 
			
		||||
      this.code = code
 | 
			
		||||
    },
 | 
			
		||||
    getSelectList() {
 | 
			
		||||
      getProductAll().then(res => {
 | 
			
		||||
        this.productList = res.data || []
 | 
			
		||||
      })
 | 
			
		||||
    },
 | 
			
		||||
    submitForm() {
 | 
			
		||||
      this.$refs['addOrUpdate'].validate((valid) => {
 | 
			
		||||
        if (valid) {
 | 
			
		||||
          console.log(this.form)
 | 
			
		||||
          deliveryLogDetCreate({ ...this.form }).then((res) => {
 | 
			
		||||
            if (res.code === 0) {
 | 
			
		||||
              this.$modal.msgSuccess("操作成功");
 | 
			
		||||
              this.$emit('successSubmit')
 | 
			
		||||
            }
 | 
			
		||||
          })
 | 
			
		||||
        } else {
 | 
			
		||||
          return false
 | 
			
		||||
        }
 | 
			
		||||
      })
 | 
			
		||||
    },
 | 
			
		||||
    formClear() {
 | 
			
		||||
      this.$refs.addOrUpdate.resetFields()
 | 
			
		||||
      this.code = ''
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</script>
 | 
			
		||||
							
								
								
									
										285
									
								
								src/views/delivery/deliveryLog/index.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										285
									
								
								src/views/delivery/deliveryLog/index.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,285 @@
 | 
			
		||||
<template>
 | 
			
		||||
  <div class="app-container">
 | 
			
		||||
    <!-- 搜索工作栏 -->
 | 
			
		||||
    <search-bar
 | 
			
		||||
      :formConfigs="formConfig"
 | 
			
		||||
      ref="searchBarForm"
 | 
			
		||||
      @headBtnClick="buttonClick"
 | 
			
		||||
    />
 | 
			
		||||
    <!-- 列表 -->
 | 
			
		||||
    <base-table
 | 
			
		||||
      :page="queryParams.pageNo"
 | 
			
		||||
      :limit="queryParams.pageSize"
 | 
			
		||||
      :table-props="tableProps"
 | 
			
		||||
      :table-data="list"
 | 
			
		||||
      :max-height="tableH"
 | 
			
		||||
    >
 | 
			
		||||
      <method-btn
 | 
			
		||||
        v-if="tableBtn.length"
 | 
			
		||||
        slot="handleBtn"
 | 
			
		||||
        :width="160"
 | 
			
		||||
        label="操作"
 | 
			
		||||
        :method-list="tableBtn"
 | 
			
		||||
        @clickBtn="handleClick"
 | 
			
		||||
      />
 | 
			
		||||
    </base-table>
 | 
			
		||||
    <pagination
 | 
			
		||||
      :page.sync="queryParams.pageNo"
 | 
			
		||||
      :limit.sync="queryParams.pageSize"
 | 
			
		||||
      :total="total"
 | 
			
		||||
      @pagination="getList"
 | 
			
		||||
    />
 | 
			
		||||
    <!-- 新增 -->
 | 
			
		||||
    <base-dialog
 | 
			
		||||
			:dialogTitle="addOrEditTitle"
 | 
			
		||||
			:dialogVisible="centervisible"
 | 
			
		||||
			@cancel="handleCancel"
 | 
			
		||||
			@confirm="handleConfirm"
 | 
			
		||||
			:before-close="handleCancel"
 | 
			
		||||
			width="50%"
 | 
			
		||||
    >
 | 
			
		||||
			<add-or-update ref="addOrUpdate" @successSubmit="successSubmit" />
 | 
			
		||||
		</base-dialog>
 | 
			
		||||
    <!-- 装车 -->
 | 
			
		||||
    <base-dialog
 | 
			
		||||
			dialogTitle="装车"
 | 
			
		||||
			:dialogVisible="centervisible2"
 | 
			
		||||
			@cancel="handleCancel2"
 | 
			
		||||
			@confirm="handleConfirm2"
 | 
			
		||||
			:before-close="handleCancel2"
 | 
			
		||||
			width="50%"
 | 
			
		||||
    >
 | 
			
		||||
			<loaded-page ref="loadedPage" @successSubmit="successSubmit2" />
 | 
			
		||||
		</base-dialog>
 | 
			
		||||
    <!-- 发货详情 -->
 | 
			
		||||
    <delivery-log-detail ref='deliveryLogDetail' v-if='showDetail' />
 | 
			
		||||
  </div>
 | 
			
		||||
</template>
 | 
			
		||||
<script>
 | 
			
		||||
import { parseTime } from '@/utils/ruoyi'
 | 
			
		||||
import { deliveryLogPage, deliveryLogDelete } from '@/api/base/delivery'
 | 
			
		||||
import AddOrUpdate from './components/addOrUpdate'
 | 
			
		||||
import LoadedPage from './components/loadedPage'
 | 
			
		||||
import DeliveryLogDetail from './components/deliveryLogDetail.vue'
 | 
			
		||||
const tableProps = [
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'orderName',
 | 
			
		||||
    label: '订单名',
 | 
			
		||||
    minWidth: 100,
 | 
			
		||||
    showOverflowtooltip: true
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'name',
 | 
			
		||||
    label: '发货单名称',
 | 
			
		||||
    minWidth: 100,
 | 
			
		||||
    showOverflowtooltip: true
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'deliveryTime',
 | 
			
		||||
    label: '发货时间',
 | 
			
		||||
    filter: parseTime,
 | 
			
		||||
    minWidth: 150
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'code',
 | 
			
		||||
    label: '发货单号',
 | 
			
		||||
    showOverflowtooltip: true
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'deliverPerName',
 | 
			
		||||
    label: '发货负责人',
 | 
			
		||||
    minWidth: 100
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'principal',
 | 
			
		||||
    label: '运输负责人',
 | 
			
		||||
    minWidth: 100
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'principalCall',
 | 
			
		||||
    label: '运输联系方式',
 | 
			
		||||
    minWidth: 110,
 | 
			
		||||
    showOverflowtooltip: true
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'principalCost',
 | 
			
		||||
    label: '运输费用'
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'remark',
 | 
			
		||||
    label: '备注',
 | 
			
		||||
    showOverflowtooltip: true
 | 
			
		||||
  }
 | 
			
		||||
]
 | 
			
		||||
export default {
 | 
			
		||||
  name: "DeliveryLog",
 | 
			
		||||
  data() {
 | 
			
		||||
    return {
 | 
			
		||||
      formConfig: [
 | 
			
		||||
        {
 | 
			
		||||
          type: 'input',
 | 
			
		||||
          label: '订单名',
 | 
			
		||||
          param: 'orderName'
 | 
			
		||||
        },
 | 
			
		||||
        {
 | 
			
		||||
          type: 'input',
 | 
			
		||||
          label: '发货单名称',
 | 
			
		||||
          param: 'name'
 | 
			
		||||
        },
 | 
			
		||||
        {
 | 
			
		||||
          type: 'input',
 | 
			
		||||
          label: '发货单号',
 | 
			
		||||
          param: 'code'
 | 
			
		||||
        },
 | 
			
		||||
        {
 | 
			
		||||
          type: 'button',
 | 
			
		||||
          btnName: '查询',
 | 
			
		||||
          name: 'search',
 | 
			
		||||
          color: 'primary'
 | 
			
		||||
        },
 | 
			
		||||
        {
 | 
			
		||||
          type: 'separate'
 | 
			
		||||
        },
 | 
			
		||||
        {
 | 
			
		||||
          type: 'button',
 | 
			
		||||
          btnName: '新增',
 | 
			
		||||
          name: 'add',
 | 
			
		||||
          color: 'success',
 | 
			
		||||
          plain: true
 | 
			
		||||
        }
 | 
			
		||||
      ],
 | 
			
		||||
      // 查询参数
 | 
			
		||||
      queryParams: {
 | 
			
		||||
        pageNo: 1,
 | 
			
		||||
        pageSize: 20,
 | 
			
		||||
        orderName: '',
 | 
			
		||||
        code: '',
 | 
			
		||||
        name: ''
 | 
			
		||||
      },
 | 
			
		||||
      tableProps,
 | 
			
		||||
      list: [],
 | 
			
		||||
      tableH: this.tableHeight(260),
 | 
			
		||||
      total: 0,
 | 
			
		||||
      tableBtn: [
 | 
			
		||||
      this.$auth.hasPermi('base:group-team:update')
 | 
			
		||||
          ? {
 | 
			
		||||
              type: 'loaded',
 | 
			
		||||
              btnName: '装车'
 | 
			
		||||
            }
 | 
			
		||||
          : undefined,
 | 
			
		||||
      this.$auth.hasPermi('base:group-team:update')
 | 
			
		||||
          ? {
 | 
			
		||||
              type: 'detail',
 | 
			
		||||
              btnName: '详情'
 | 
			
		||||
            }
 | 
			
		||||
          : undefined,
 | 
			
		||||
        this.$auth.hasPermi('base:group-team:update')
 | 
			
		||||
          ? {
 | 
			
		||||
              type: 'edit',
 | 
			
		||||
              btnName: '编辑'
 | 
			
		||||
            }
 | 
			
		||||
          : undefined,
 | 
			
		||||
        this.$auth.hasPermi('base:group-team:delete')
 | 
			
		||||
          ? {
 | 
			
		||||
              type: 'delete',
 | 
			
		||||
              btnName: '删除'
 | 
			
		||||
            }
 | 
			
		||||
          : undefined
 | 
			
		||||
      ].filter((v) => v),
 | 
			
		||||
      addOrEditTitle: '',
 | 
			
		||||
      centervisible: false,
 | 
			
		||||
      centervisible2: false,
 | 
			
		||||
      showDetail: false
 | 
			
		||||
    }
 | 
			
		||||
  },
 | 
			
		||||
  created() {
 | 
			
		||||
    window.addEventListener('resize', () => {
 | 
			
		||||
      this.tableH = this.tableHeight(260)
 | 
			
		||||
    })
 | 
			
		||||
    this.getList();
 | 
			
		||||
  },
 | 
			
		||||
  components: { AddOrUpdate, LoadedPage, DeliveryLogDetail },
 | 
			
		||||
  methods: {
 | 
			
		||||
    getList() {
 | 
			
		||||
      deliveryLogPage({...this.queryParams}).then(res => {
 | 
			
		||||
        this.list = res.data.list || []
 | 
			
		||||
        this.total = res.data.total || 0
 | 
			
		||||
      })
 | 
			
		||||
    },
 | 
			
		||||
    buttonClick(val) {
 | 
			
		||||
      if (val.btnName === 'search') {
 | 
			
		||||
        this.queryParams.name = val.name
 | 
			
		||||
        this.queryParams.orderName = val.orderName
 | 
			
		||||
        this.queryParams.code = val.code
 | 
			
		||||
        this.getList()
 | 
			
		||||
      } else {
 | 
			
		||||
        this.addOrEditTitle = '新增'
 | 
			
		||||
        this.centervisible = true
 | 
			
		||||
        this.$nextTick(() => {
 | 
			
		||||
          this.$refs.addOrUpdate.init()
 | 
			
		||||
        })
 | 
			
		||||
      }
 | 
			
		||||
    },
 | 
			
		||||
    handleClick(val) {
 | 
			
		||||
      console.log(val)
 | 
			
		||||
      switch (val.type) {
 | 
			
		||||
        case 'edit':
 | 
			
		||||
          this.addOrEditTitle = '编辑'
 | 
			
		||||
          this.centervisible = true
 | 
			
		||||
          this.$nextTick(() => {
 | 
			
		||||
            this.$refs.addOrUpdate.init(val.data.id)
 | 
			
		||||
          })
 | 
			
		||||
          break
 | 
			
		||||
        case 'delete':
 | 
			
		||||
          this.handleDelete(val.data)
 | 
			
		||||
          break
 | 
			
		||||
        case 'loaded':
 | 
			
		||||
          this.centervisible2 = true
 | 
			
		||||
          this.$nextTick(() => {
 | 
			
		||||
            this.$refs.loadedPage.init(val.data.id, val.data.code)
 | 
			
		||||
          })
 | 
			
		||||
          break
 | 
			
		||||
        default:
 | 
			
		||||
          this.showDetail = true
 | 
			
		||||
          this.$nextTick(() => {
 | 
			
		||||
            this.$refs.deliveryLogDetail.init(val.data)
 | 
			
		||||
          })
 | 
			
		||||
      }
 | 
			
		||||
    },
 | 
			
		||||
    // 新增
 | 
			
		||||
    handleCancel() {
 | 
			
		||||
      this.$refs.addOrUpdate.formClear()
 | 
			
		||||
      this.centervisible = false
 | 
			
		||||
      this.addOrEditTitle = ''
 | 
			
		||||
    },
 | 
			
		||||
    handleConfirm() {
 | 
			
		||||
      this.$refs.addOrUpdate.submitForm()
 | 
			
		||||
    },
 | 
			
		||||
    successSubmit() {
 | 
			
		||||
      this.handleCancel()
 | 
			
		||||
      this.getList()
 | 
			
		||||
    },
 | 
			
		||||
    // 删除
 | 
			
		||||
    handleDelete(val) {
 | 
			
		||||
      this.$modal.confirm('是否确认删除发货单名为"' + val.name + '"的数据项?').then(function() {
 | 
			
		||||
          return deliveryLogDelete({ id: val.id })
 | 
			
		||||
        }).then(() => {
 | 
			
		||||
          this.getList();
 | 
			
		||||
          this.$modal.msgSuccess("操作成功");
 | 
			
		||||
        }).catch(() => {});
 | 
			
		||||
    },
 | 
			
		||||
    // 装车
 | 
			
		||||
    handleCancel2() {
 | 
			
		||||
      this.$refs.loadedPage.formClear()
 | 
			
		||||
      this.centervisible2 = false
 | 
			
		||||
    },
 | 
			
		||||
    handleConfirm2() {
 | 
			
		||||
      this.$refs.loadedPage.submitForm()
 | 
			
		||||
    },
 | 
			
		||||
    successSubmit2() {
 | 
			
		||||
      this.handleCancel2()
 | 
			
		||||
      this.getList()
 | 
			
		||||
    },
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</script>
 | 
			
		||||
@@ -0,0 +1,365 @@
 | 
			
		||||
<template>
 | 
			
		||||
  <el-drawer
 | 
			
		||||
    title="发货进度"
 | 
			
		||||
    :visible.sync="centervisible"
 | 
			
		||||
    size="80%"
 | 
			
		||||
    class="deliveryLogDetail"
 | 
			
		||||
    @close='closeA'>
 | 
			
		||||
    <div class="box1">
 | 
			
		||||
      <div class="box_col">
 | 
			
		||||
        <div class="blodTip">订单名</div>
 | 
			
		||||
        <div class="lightTip">{{orderMsg.orderName ? orderMsg.orderName : '-'}}</div>
 | 
			
		||||
      </div>
 | 
			
		||||
      <div class="box_col">
 | 
			
		||||
        <div class="blodTip">订单数量</div>
 | 
			
		||||
        <div class="lightTip">{{orderMsg.orderNum ? orderMsg.orderNum : '-'}}</div>
 | 
			
		||||
      </div>
 | 
			
		||||
      <div class="box_col">
 | 
			
		||||
        <div class="blodTip">装货数量</div>
 | 
			
		||||
        <div class="lightTip">{{orderMsg.num ? orderMsg.num : '-'}}</div>
 | 
			
		||||
      </div>
 | 
			
		||||
      <div class="box_col">
 | 
			
		||||
        <div class="blodTip">累积占比(%)</div>
 | 
			
		||||
        <div class="lightTip">{{orderMsg.rate ? orderMsg.rate : '-'}}</div>
 | 
			
		||||
      </div>
 | 
			
		||||
      <div class="box_col">
 | 
			
		||||
        <div class="blodTip">累积运输费用</div>
 | 
			
		||||
        <div class="lightTip">{{orderMsg.cost ? orderMsg.cost : '-'}}</div>
 | 
			
		||||
      </div>
 | 
			
		||||
    </div>
 | 
			
		||||
    <div class="box2">
 | 
			
		||||
      <div class="boxTitle">
 | 
			
		||||
        <span class="blueTitle"></span>
 | 
			
		||||
        <span>发货清单</span>
 | 
			
		||||
      </div>
 | 
			
		||||
      <el-tabs v-model="activeName" @tab-click="toggleTab">
 | 
			
		||||
        <el-tab-pane label="数据列表" name="dataList">
 | 
			
		||||
          <!-- 列表 -->
 | 
			
		||||
          <base-table
 | 
			
		||||
            :page="queryParams.pageNo"
 | 
			
		||||
            :limit="queryParams.pageSize"
 | 
			
		||||
            :table-props="tableProps"
 | 
			
		||||
            :table-data="tableData"
 | 
			
		||||
            :max-height="tableH"
 | 
			
		||||
          >
 | 
			
		||||
            <method-btn
 | 
			
		||||
              v-if="tableBtn.length"
 | 
			
		||||
              slot="handleBtn"
 | 
			
		||||
              :width="150"
 | 
			
		||||
              label="操作"
 | 
			
		||||
              :method-list="tableBtn"
 | 
			
		||||
              @clickBtn="viewDetDetail"
 | 
			
		||||
            />
 | 
			
		||||
          </base-table>
 | 
			
		||||
          <pagination
 | 
			
		||||
            :page.sync="queryParams.pageNo"
 | 
			
		||||
            :limit.sync="queryParams.pageSize"
 | 
			
		||||
            :total="total"
 | 
			
		||||
            @pagination="getList"
 | 
			
		||||
          />
 | 
			
		||||
        </el-tab-pane>
 | 
			
		||||
        <el-tab-pane label="环形图" name="barChart">
 | 
			
		||||
          <div 
 | 
			
		||||
            id="logDetPieBar"
 | 
			
		||||
            style="width: 182px; height: 180px;"
 | 
			
		||||
          ></div>
 | 
			
		||||
        </el-tab-pane>
 | 
			
		||||
      </el-tabs>
 | 
			
		||||
    </div>
 | 
			
		||||
    <!-- 详情抽屉 -->
 | 
			
		||||
    <el-drawer
 | 
			
		||||
      title="发货详情"
 | 
			
		||||
      size="60%"
 | 
			
		||||
      :append-to-body="true"
 | 
			
		||||
      :visible.sync="innerDrawer"
 | 
			
		||||
      @close='closeB'>
 | 
			
		||||
      <div class="box3">
 | 
			
		||||
        <el-row>
 | 
			
		||||
          <el-col :span='12'>
 | 
			
		||||
            <span class="title">订单名:</span>
 | 
			
		||||
            <span class="text">{{orderMsg.orderName ? orderMsg.orderName : '-'}}</span>
 | 
			
		||||
          </el-col>
 | 
			
		||||
          <el-col :span='12'>
 | 
			
		||||
            <span class="title">发货单号:</span>
 | 
			
		||||
            <span class="text">{{logCode ? logCode : '-'}}</span>
 | 
			
		||||
          </el-col>
 | 
			
		||||
        </el-row>
 | 
			
		||||
      </div>
 | 
			
		||||
      <div class="box4">
 | 
			
		||||
        <div class="boxTitle">
 | 
			
		||||
          <span class="blueTitle"></span>
 | 
			
		||||
          <span>详情</span>
 | 
			
		||||
        </div>
 | 
			
		||||
        <base-table
 | 
			
		||||
          :page="queryParams2.pageNo"
 | 
			
		||||
          :limit="queryParams2.pageSize"
 | 
			
		||||
          :table-props="tableProps2"
 | 
			
		||||
          :table-data="tableData2"
 | 
			
		||||
          :max-height="tableH2"
 | 
			
		||||
        />
 | 
			
		||||
        <pagination
 | 
			
		||||
          :page.sync="queryParams2.pageNo"
 | 
			
		||||
          :limit.sync="queryParams2.pageSize"
 | 
			
		||||
          :total="total2"
 | 
			
		||||
          @pagination="getList2"
 | 
			
		||||
        />
 | 
			
		||||
      </div>
 | 
			
		||||
    </el-drawer>
 | 
			
		||||
  </el-drawer>
 | 
			
		||||
</template>
 | 
			
		||||
<script>
 | 
			
		||||
import { deliveryLogPage, deliveryLogDetPage } from '@/api/base/delivery'
 | 
			
		||||
import { parseTime } from '@/utils/ruoyi'
 | 
			
		||||
const tableProps = [
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'deliveryTime',
 | 
			
		||||
    label: '发货时间',
 | 
			
		||||
    filter: parseTime,
 | 
			
		||||
    minWidth: 150
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'code',
 | 
			
		||||
    label: '发货单号',
 | 
			
		||||
    showOverflowtooltip: true
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'orderNum',
 | 
			
		||||
    label: '订单数量'
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'num',
 | 
			
		||||
    label: '发货数量'
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'rate',
 | 
			
		||||
    label: '发货比列(%)'
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'principalCost',
 | 
			
		||||
    label: '运输费用'
 | 
			
		||||
  }
 | 
			
		||||
]
 | 
			
		||||
const tableProps2 = [
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'createTime',
 | 
			
		||||
    label: '添加时间',
 | 
			
		||||
    filter: parseTime,
 | 
			
		||||
    minWidth: 150
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'deliveryCarCode',
 | 
			
		||||
    label: '装车单号',
 | 
			
		||||
    showOverflowtooltip: true
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'loadTime',
 | 
			
		||||
    label: '装车时间',
 | 
			
		||||
    filter: parseTime,
 | 
			
		||||
    minWidth: 150
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'productName',
 | 
			
		||||
    label: '装车产品',
 | 
			
		||||
    showOverflowtooltip: true
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'packagingSize',
 | 
			
		||||
    label: '装箱规格(片/箱)'
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'packagingNum',
 | 
			
		||||
    label: '箱数'
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'quantity',
 | 
			
		||||
    label: '装车总量'
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'productDate',
 | 
			
		||||
    label: '产品批次',
 | 
			
		||||
    showOverflowtooltip: true
 | 
			
		||||
  }
 | 
			
		||||
]
 | 
			
		||||
export default {
 | 
			
		||||
  name: 'DeliveryLogDetDetail',
 | 
			
		||||
  data() {
 | 
			
		||||
    return {
 | 
			
		||||
      centervisible: false,
 | 
			
		||||
      activeName: 'dataList',
 | 
			
		||||
      // 查询参数
 | 
			
		||||
      queryParams: {
 | 
			
		||||
        pageNo: 1,
 | 
			
		||||
        pageSize: 100,
 | 
			
		||||
        orderId: ''
 | 
			
		||||
      },
 | 
			
		||||
      orderMsg: {},
 | 
			
		||||
      tableProps,
 | 
			
		||||
      tableData: [],
 | 
			
		||||
      tableH: this.tableHeight(350),
 | 
			
		||||
      tableBtn: [
 | 
			
		||||
        this.$auth.hasPermi('base:group-team:update')
 | 
			
		||||
          ? {
 | 
			
		||||
              type: 'detDetail',
 | 
			
		||||
              btnName: '查看发货详情'
 | 
			
		||||
            }
 | 
			
		||||
          : undefined
 | 
			
		||||
      ].filter((v) => v),
 | 
			
		||||
      innerDrawer: false,
 | 
			
		||||
      // 详情
 | 
			
		||||
      queryParams2: {
 | 
			
		||||
        pageNo: 1,
 | 
			
		||||
        pageSize: 20,
 | 
			
		||||
        logId: ''
 | 
			
		||||
      },
 | 
			
		||||
      tableProps2,
 | 
			
		||||
      tableData2: [],
 | 
			
		||||
      tableH2: this.tableHeight(275),
 | 
			
		||||
      total2: 0,
 | 
			
		||||
      logCode: ''
 | 
			
		||||
    }
 | 
			
		||||
  },
 | 
			
		||||
  mounted() {
 | 
			
		||||
    window.addEventListener('resize', () => {
 | 
			
		||||
      this.tableH = this.tableHeight(350)
 | 
			
		||||
    })
 | 
			
		||||
    window.addEventListener('resize', () => {
 | 
			
		||||
      this.tableH2 = this.tableHeight(275)
 | 
			
		||||
    })
 | 
			
		||||
  },
 | 
			
		||||
  methods: {
 | 
			
		||||
    init(params) {
 | 
			
		||||
      this.queryParams.orderId = params.orderId
 | 
			
		||||
      this.orderMsg = params
 | 
			
		||||
      this.centervisible = true
 | 
			
		||||
      this.getList()
 | 
			
		||||
    },
 | 
			
		||||
    getList() {
 | 
			
		||||
      deliveryLogPage({...this.queryParams}).then(res => {
 | 
			
		||||
        this.tableData = res.data.list || []
 | 
			
		||||
      })
 | 
			
		||||
    },
 | 
			
		||||
    toggleTab() {
 | 
			
		||||
 | 
			
		||||
    },
 | 
			
		||||
    getBar() {
 | 
			
		||||
      
 | 
			
		||||
    },
 | 
			
		||||
    viewDetDetail(val) {
 | 
			
		||||
      this.logCode = val.data.code
 | 
			
		||||
      this.innerDrawer = true
 | 
			
		||||
      this.queryParams2.logId = val.data.id
 | 
			
		||||
      this.getList2()
 | 
			
		||||
    },
 | 
			
		||||
    closeA() {
 | 
			
		||||
      // 清空数据
 | 
			
		||||
      this.activeName = 'dataList'
 | 
			
		||||
      this.queryParams.orderId = ''
 | 
			
		||||
      this.tableData = []
 | 
			
		||||
      this.orderMsg = {}
 | 
			
		||||
      this.innerDrawer = false
 | 
			
		||||
    },
 | 
			
		||||
    getList2() {
 | 
			
		||||
      deliveryLogDetPage({...this.queryParams2}).then(res => {
 | 
			
		||||
        this.tableData2 = res.data.list || []
 | 
			
		||||
        this.total2 = res.data.total || 0
 | 
			
		||||
      })
 | 
			
		||||
    },
 | 
			
		||||
    closeB() {
 | 
			
		||||
      this.logCode = ''
 | 
			
		||||
      this.queryParams2.pageNo = 1
 | 
			
		||||
      this.queryParams2.pageSize = 20
 | 
			
		||||
      this.queryParams2.logId = ''
 | 
			
		||||
      this.tableData2 = []
 | 
			
		||||
      this.total2 = 0
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</script>
 | 
			
		||||
<style scoped lang='scss'>
 | 
			
		||||
.box1 {
 | 
			
		||||
  height: 56px;
 | 
			
		||||
  .box_col {
 | 
			
		||||
    display: inline-block;
 | 
			
		||||
    width: 20%;
 | 
			
		||||
    padding: 8px 8px 8px 40px;
 | 
			
		||||
    .blodTip {
 | 
			
		||||
      height: 16px;
 | 
			
		||||
      font-weight: 600;
 | 
			
		||||
      color: rgba(0,0,0,0.85);
 | 
			
		||||
      margin-bottom: 8px;
 | 
			
		||||
    }
 | 
			
		||||
    .lightTip {
 | 
			
		||||
      height: 16px;
 | 
			
		||||
      font-weight: 400;
 | 
			
		||||
      color: rgba(102,102,102,0.75);
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
.box2 {
 | 
			
		||||
    padding:32px 32px 30px 30px;
 | 
			
		||||
    height: calc(100vh - 150px);
 | 
			
		||||
}
 | 
			
		||||
.boxTitle {
 | 
			
		||||
  display: inline-block;
 | 
			
		||||
  font-size: 16px;
 | 
			
		||||
  font-weight: 400;
 | 
			
		||||
  color: #000000;
 | 
			
		||||
  margin:0 10px 10px 0;
 | 
			
		||||
}
 | 
			
		||||
.blueTitle {
 | 
			
		||||
  content: '';
 | 
			
		||||
  display: inline-block;
 | 
			
		||||
  width: 4px;
 | 
			
		||||
  height: 18px;
 | 
			
		||||
  background-color: #0B58FF;
 | 
			
		||||
  border-radius: 1px;
 | 
			
		||||
  margin-right: 8px;
 | 
			
		||||
  vertical-align: bottom;
 | 
			
		||||
}
 | 
			
		||||
.box3 {
 | 
			
		||||
  padding: 8px 8px 8px 40px;
 | 
			
		||||
  .title {
 | 
			
		||||
    height: 16px;
 | 
			
		||||
    font-weight: 600;
 | 
			
		||||
    color: rgba(0,0,0,0.85);
 | 
			
		||||
  }
 | 
			
		||||
  .text {
 | 
			
		||||
    height: 16px;
 | 
			
		||||
    font-weight: 400;
 | 
			
		||||
    color: rgba(102,102,102,0.75);
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
.box4 {
 | 
			
		||||
  padding:32px 32px 30px 30px;
 | 
			
		||||
  height: calc(100vh - 125px);
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
<style lang='scss'>
 | 
			
		||||
.deliveryLogDetail {
 | 
			
		||||
  .el-tabs__nav::after {
 | 
			
		||||
    content: "";
 | 
			
		||||
    position: absolute;
 | 
			
		||||
    left: 0;
 | 
			
		||||
    bottom: 0;
 | 
			
		||||
    width: 100%;
 | 
			
		||||
    height: 2px;
 | 
			
		||||
    background-color: #e4e7ed;
 | 
			
		||||
    /* z-index: 1; */
 | 
			
		||||
  }
 | 
			
		||||
  .el-tabs__nav-wrap::after {
 | 
			
		||||
    width: 0;
 | 
			
		||||
  }
 | 
			
		||||
  .el-tabs__item {
 | 
			
		||||
    padding: 0 10px;
 | 
			
		||||
  }
 | 
			
		||||
  .el-tabs__item:hover {
 | 
			
		||||
    color: rgba(0, 0, 0, 0.85);
 | 
			
		||||
  }
 | 
			
		||||
  .el-tabs__item.is-active {
 | 
			
		||||
    color: rgba(0, 0, 0, 0.85);
 | 
			
		||||
  }
 | 
			
		||||
  .el-tabs__item {
 | 
			
		||||
    color: rgba(0, 0, 0, 0.45);
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
							
								
								
									
										130
									
								
								src/views/delivery/deliveryLogDet/index.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										130
									
								
								src/views/delivery/deliveryLogDet/index.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,130 @@
 | 
			
		||||
<template>
 | 
			
		||||
  <div class="app-container">
 | 
			
		||||
    <!-- 搜索工作栏 -->
 | 
			
		||||
    <search-bar
 | 
			
		||||
      :formConfigs="formConfig"
 | 
			
		||||
      ref="searchBarForm"
 | 
			
		||||
      @headBtnClick="buttonClick"
 | 
			
		||||
    />
 | 
			
		||||
    <!-- 列表 -->
 | 
			
		||||
    <base-table
 | 
			
		||||
      :page="queryParams.pageNo"
 | 
			
		||||
      :limit="queryParams.pageSize"
 | 
			
		||||
      :table-props="tableProps"
 | 
			
		||||
      :table-data="list"
 | 
			
		||||
      :max-height="tableH"
 | 
			
		||||
    >
 | 
			
		||||
      <method-btn
 | 
			
		||||
        v-if="tableBtn.length"
 | 
			
		||||
        slot="handleBtn"
 | 
			
		||||
        :width="80"
 | 
			
		||||
        label="操作"
 | 
			
		||||
        :method-list="tableBtn"
 | 
			
		||||
        @clickBtn="handleClick"
 | 
			
		||||
      />
 | 
			
		||||
    </base-table>
 | 
			
		||||
    <pagination
 | 
			
		||||
      :page.sync="queryParams.pageNo"
 | 
			
		||||
      :limit.sync="queryParams.pageSize"
 | 
			
		||||
      :total="total"
 | 
			
		||||
      @pagination="getList"
 | 
			
		||||
    />
 | 
			
		||||
    <!-- 详情抽屉 -->
 | 
			
		||||
    <delivery-log-det-detail ref='deliveryLogDetail'/>
 | 
			
		||||
  </div>
 | 
			
		||||
</template>
 | 
			
		||||
<script>
 | 
			
		||||
import { deliveryProgressPage } from '@/api/base/delivery'
 | 
			
		||||
import DeliveryLogDetDetail from './components/deliveryLogDetDetail.vue'
 | 
			
		||||
const tableProps = [
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'orderName',
 | 
			
		||||
    label: '订单名',
 | 
			
		||||
    showOverflowtooltip: true
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'customerName',
 | 
			
		||||
    label: '客户名称',
 | 
			
		||||
    showOverflowtooltip: true
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'unit',
 | 
			
		||||
    label: '单位'
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'orderNum',
 | 
			
		||||
    label: '订单数量'
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'num',
 | 
			
		||||
    label: '发货数量'
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'rate',
 | 
			
		||||
    label: '累积发货比例(%)'
 | 
			
		||||
  }
 | 
			
		||||
]
 | 
			
		||||
export default {
 | 
			
		||||
  name: "DeliveryLogDet",
 | 
			
		||||
  data() {
 | 
			
		||||
    return {
 | 
			
		||||
      formConfig: [
 | 
			
		||||
        {
 | 
			
		||||
          type: 'input',
 | 
			
		||||
          label: '订单名',
 | 
			
		||||
          param: 'orderName'
 | 
			
		||||
        },
 | 
			
		||||
        {
 | 
			
		||||
          type: 'button',
 | 
			
		||||
          btnName: '查询',
 | 
			
		||||
          name: 'search',
 | 
			
		||||
          color: 'primary'
 | 
			
		||||
        }
 | 
			
		||||
      ],
 | 
			
		||||
      // 查询参数
 | 
			
		||||
      queryParams: {
 | 
			
		||||
        pageNo: 1,
 | 
			
		||||
        pageSize: 20,
 | 
			
		||||
        orderName: ''
 | 
			
		||||
      },
 | 
			
		||||
      tableProps,
 | 
			
		||||
      list: [],
 | 
			
		||||
      tableH: this.tableHeight(260),
 | 
			
		||||
      total: 0,
 | 
			
		||||
      tableBtn: [
 | 
			
		||||
      this.$auth.hasPermi('base:group-team:update')
 | 
			
		||||
          ? {
 | 
			
		||||
              type: 'detail',
 | 
			
		||||
              btnName: '详情'
 | 
			
		||||
            }
 | 
			
		||||
          : undefined
 | 
			
		||||
      ].filter((v) => v)
 | 
			
		||||
    }
 | 
			
		||||
  },
 | 
			
		||||
  components: { DeliveryLogDetDetail },
 | 
			
		||||
  created() {
 | 
			
		||||
    window.addEventListener('resize', () => {
 | 
			
		||||
      this.tableH = this.tableHeight(260)
 | 
			
		||||
    })
 | 
			
		||||
    this.getList();
 | 
			
		||||
  },
 | 
			
		||||
  methods: {
 | 
			
		||||
    getList() {
 | 
			
		||||
      deliveryProgressPage({...this.queryParams}).then(res => {
 | 
			
		||||
        this.list = res.data.list || []
 | 
			
		||||
        this.total = res.data.total || 0
 | 
			
		||||
      })
 | 
			
		||||
    },
 | 
			
		||||
    buttonClick(val) {
 | 
			
		||||
      this.queryParams.orderName = val.orderName
 | 
			
		||||
      this.getList()
 | 
			
		||||
    },
 | 
			
		||||
    handleClick(val) {
 | 
			
		||||
      console.log(val)
 | 
			
		||||
      this.$nextTick(() => {
 | 
			
		||||
        this.$refs.deliveryLogDetail.init(val.data)
 | 
			
		||||
      })
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</script>
 | 
			
		||||
@@ -142,7 +142,7 @@ export default {
 | 
			
		||||
          {
 | 
			
		||||
            type: 'input',
 | 
			
		||||
            label: '关键字',
 | 
			
		||||
            placeholder: '关键字',
 | 
			
		||||
            placeholder: '姓名',
 | 
			
		||||
            param: 'workerName'
 | 
			
		||||
          },
 | 
			
		||||
          {
 | 
			
		||||
@@ -168,7 +168,7 @@ export default {
 | 
			
		||||
          {
 | 
			
		||||
            type: 'input',
 | 
			
		||||
            label: '关键字',
 | 
			
		||||
            placeholder: '关键字',
 | 
			
		||||
            placeholder: '姓名',
 | 
			
		||||
            param: 'workerName'
 | 
			
		||||
          },
 | 
			
		||||
          {
 | 
			
		||||
@@ -242,12 +242,13 @@ export default {
 | 
			
		||||
      this.getList()
 | 
			
		||||
    },
 | 
			
		||||
    handleClick(val) {
 | 
			
		||||
      console.log(val)
 | 
			
		||||
      switch (val.type) {
 | 
			
		||||
        case 'edit':
 | 
			
		||||
          this.addOrEditTitle = '编辑'
 | 
			
		||||
          this.centervisible = true
 | 
			
		||||
          this.$nextTick(() => {
 | 
			
		||||
            this.$refs.workerTeamAdd.init({'teamId': this.queryParams.teamId, id: val.data.id})
 | 
			
		||||
            this.$refs.workerTeamAdd.init({'teamId': this.queryParams.teamId, 'id': val.data.id, 'workName':val.data.workerName, 'majorName':val.data.workerMajorName})
 | 
			
		||||
          })
 | 
			
		||||
          break
 | 
			
		||||
        default:
 | 
			
		||||
@@ -266,6 +267,16 @@ export default {
 | 
			
		||||
        }).catch(() => {});
 | 
			
		||||
    },
 | 
			
		||||
    closeD() {
 | 
			
		||||
      this.teamData.teamName = ''
 | 
			
		||||
      this.teamData.leaderName = ''
 | 
			
		||||
      this.teamData.teamNum = ''
 | 
			
		||||
      this.teamData.leaderTelephone = ''
 | 
			
		||||
      this.teamData.teamId = ''
 | 
			
		||||
      this.queryParams.pageNo = 1
 | 
			
		||||
      this.queryParams.pageSize = 20
 | 
			
		||||
      this.queryParams.teamId = ''
 | 
			
		||||
      this.queryParams.workerName = ''
 | 
			
		||||
      this.total = 0
 | 
			
		||||
      this.$emit('closeDrawer')
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
 
 | 
			
		||||
@@ -1,6 +1,6 @@
 | 
			
		||||
<template>
 | 
			
		||||
  <el-form ref="form" :rules="rules" label-width="100px" :model="form">
 | 
			
		||||
    <el-form-item label="员工" prop="workerId">
 | 
			
		||||
    <el-form-item label="员工" prop="workerId" v-if='!isEdit'>
 | 
			
		||||
      <el-select v-model="form.workerId" placeholder="请选择" filterable style="width: 100%;" @change="selectWorker()">
 | 
			
		||||
        <el-option
 | 
			
		||||
          v-for="item in workerList"
 | 
			
		||||
@@ -10,6 +10,9 @@
 | 
			
		||||
        </el-option>
 | 
			
		||||
      </el-select>
 | 
			
		||||
    </el-form-item>
 | 
			
		||||
    <el-form-item label="员工" prop="workerId" v-if='isEdit'>
 | 
			
		||||
      <el-input v-model="workName" disabled></el-input>
 | 
			
		||||
    </el-form-item>
 | 
			
		||||
    <el-form-item label="专业" prop="majorName">
 | 
			
		||||
      <el-input v-model="form.majorName" disabled></el-input>
 | 
			
		||||
    </el-form-item>
 | 
			
		||||
@@ -19,7 +22,7 @@
 | 
			
		||||
  </el-form>
 | 
			
		||||
</template>
 | 
			
		||||
<script>
 | 
			
		||||
import { getWorkerList } from '@/api/base/worker'
 | 
			
		||||
import { otherWorkerList } from '@/api/base/worker'
 | 
			
		||||
import { teamDetCreate, teamDetUpdate, groupTeamDet } from '@/api/base/groupTeam'
 | 
			
		||||
export default {
 | 
			
		||||
  name: 'WorkerTeamAdd',
 | 
			
		||||
@@ -33,6 +36,8 @@ export default {
 | 
			
		||||
        majorName: '',
 | 
			
		||||
        id: ''
 | 
			
		||||
      },
 | 
			
		||||
      isEdit: false,
 | 
			
		||||
      workName: '',//编辑时用
 | 
			
		||||
      rules: {
 | 
			
		||||
        workerId: [{ required: true, message: '员工不能为空', trigger: 'change' }]
 | 
			
		||||
      }
 | 
			
		||||
@@ -41,7 +46,9 @@ export default {
 | 
			
		||||
  methods: {
 | 
			
		||||
    init(param) {
 | 
			
		||||
      this.form.teamId = param.teamId
 | 
			
		||||
      getWorkerList().then(res => {
 | 
			
		||||
      this.form.majorName = param.majorName
 | 
			
		||||
      this.workName = param.workName
 | 
			
		||||
      otherWorkerList({teamId:this.form.teamId}).then(res => {
 | 
			
		||||
        this.workerList = res.data || []
 | 
			
		||||
        if (param.id) {
 | 
			
		||||
          this.isEdit = true
 | 
			
		||||
@@ -49,7 +56,6 @@ export default {
 | 
			
		||||
          groupTeamDet({id: this.form.id}).then((res) => {
 | 
			
		||||
            if (res.code === 0) {
 | 
			
		||||
              this.form.workerId = res.data.workerId
 | 
			
		||||
              this.selectWorker()
 | 
			
		||||
              this.form.remark = res.data.remark
 | 
			
		||||
            }
 | 
			
		||||
          })
 | 
			
		||||
@@ -106,6 +112,8 @@ export default {
 | 
			
		||||
    },
 | 
			
		||||
    formClear() {
 | 
			
		||||
      this.$refs.form.resetFields()
 | 
			
		||||
      this.workName = ''
 | 
			
		||||
      this.form.majorName = ''
 | 
			
		||||
      this.isEdit = false
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
 
 | 
			
		||||
@@ -34,36 +34,42 @@
 | 
			
		||||
  </div>
 | 
			
		||||
</template>
 | 
			
		||||
<script>
 | 
			
		||||
import { groupTeamSchedulingPage } from '@/api/monitoring/teamProduction'
 | 
			
		||||
import { groupTeamSchedulingPage, groupClassesListAll } from '@/api/monitoring/teamProduction'
 | 
			
		||||
import { parseTime } from '@/utils/ruoyi'
 | 
			
		||||
import TeamProductionDetail from './components/teamProductionDetail'
 | 
			
		||||
const tableProps = [
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'createTime',
 | 
			
		||||
    label: '排班创建时间',
 | 
			
		||||
    filter: parseTime
 | 
			
		||||
    filter: parseTime,
 | 
			
		||||
    minWidth: 150
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'startDay',
 | 
			
		||||
    label: '上班日期'
 | 
			
		||||
    label: '上班日期',
 | 
			
		||||
    minWidth: 100
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'startTime',
 | 
			
		||||
    label: '上班时间',
 | 
			
		||||
    filter: parseTime
 | 
			
		||||
    filter: parseTime,
 | 
			
		||||
    minWidth: 150
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'endTime',
 | 
			
		||||
    label: '下班时间',
 | 
			
		||||
    filter: parseTime
 | 
			
		||||
    filter: parseTime,
 | 
			
		||||
    minWidth: 150
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'classesName',
 | 
			
		||||
    label: '班次名称'
 | 
			
		||||
    label: '班次名称',
 | 
			
		||||
    showOverflowtooltip: true
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'teamName',
 | 
			
		||||
    label: '班组名称'
 | 
			
		||||
    label: '班组名称',
 | 
			
		||||
    showOverflowtooltip: true
 | 
			
		||||
  }
 | 
			
		||||
]
 | 
			
		||||
const tableBtn = [
 | 
			
		||||
@@ -93,8 +99,9 @@ export default {
 | 
			
		||||
          type: 'datePicker',
 | 
			
		||||
          label: '上班日期',
 | 
			
		||||
          dateType: 'date',
 | 
			
		||||
          format: 'yyyy-MM-dd HH:mm:ss',
 | 
			
		||||
          valueFormat: "timestamp",
 | 
			
		||||
          format: 'yyyy-MM-dd',
 | 
			
		||||
          valueFormat: 'yyyy-MM-dd',
 | 
			
		||||
          // valueFormat: "timestamp",
 | 
			
		||||
          param: 'startDay',
 | 
			
		||||
          defaultSelect: '',
 | 
			
		||||
          width: 200
 | 
			
		||||
@@ -117,7 +124,7 @@ export default {
 | 
			
		||||
      tableProps,
 | 
			
		||||
      tableBtn,
 | 
			
		||||
      list: [],
 | 
			
		||||
      tableH: this.tableHeight(220),
 | 
			
		||||
      tableH: this.tableHeight(260),
 | 
			
		||||
      total: 0,
 | 
			
		||||
      paramVisible: false
 | 
			
		||||
    }
 | 
			
		||||
@@ -125,25 +132,30 @@ export default {
 | 
			
		||||
  components: { TeamProductionDetail },
 | 
			
		||||
  mounted() {
 | 
			
		||||
    window.addEventListener('resize', () => {
 | 
			
		||||
      this.tableH = this.tableHeight(220)
 | 
			
		||||
      this.tableH = this.tableHeight(260)
 | 
			
		||||
    })
 | 
			
		||||
    this.getGroupClass()
 | 
			
		||||
    this.getList()
 | 
			
		||||
  },
 | 
			
		||||
  methods: {
 | 
			
		||||
    buttonClick(val) {
 | 
			
		||||
      this.queryParams.pageNo = 1;
 | 
			
		||||
      this.queryParams.cnName = val.cnName
 | 
			
		||||
      this.queryParams.classesId = val.classesId
 | 
			
		||||
      this.queryParams.teamName = val.teamName
 | 
			
		||||
      this.queryParams.startDay = val.startDay
 | 
			
		||||
      this.getList()
 | 
			
		||||
    },
 | 
			
		||||
    getList() {
 | 
			
		||||
      groupTeamSchedulingPage().then(res => {
 | 
			
		||||
      groupTeamSchedulingPage({...this.queryParams}).then(res => {
 | 
			
		||||
        console.log(res)
 | 
			
		||||
        this.list = res.data.list || []
 | 
			
		||||
        this.total = res.data.total || 0
 | 
			
		||||
      })
 | 
			
		||||
    },
 | 
			
		||||
    getGroupClass() {
 | 
			
		||||
      
 | 
			
		||||
      groupClassesListAll().then(res => {
 | 
			
		||||
        this.formConfig[0].selectOptions = res.data || []
 | 
			
		||||
      })
 | 
			
		||||
    },
 | 
			
		||||
    handleClick(val) {
 | 
			
		||||
      console.log(val)
 | 
			
		||||
 
 | 
			
		||||
@@ -5,8 +5,8 @@
 | 
			
		||||
        <el-form-item label="工单名称" prop="name" v-if='!isBind'>
 | 
			
		||||
          <el-input v-model="form.name"></el-input>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
        <el-form-item label="产品名称" prop="orderId"  v-if='isBind'>
 | 
			
		||||
          <el-select v-model="form.orderId" placeholder="请选择" style="width: 100%;">
 | 
			
		||||
        <el-form-item label="工单名称" prop="workOrderId"  v-if='isBind'>
 | 
			
		||||
          <el-select v-model="form.workOrderId" placeholder="请选择" style="width: 100%;" @change="getWorkOrderMsg">
 | 
			
		||||
            <el-option
 | 
			
		||||
              v-for="item in workOrderList"
 | 
			
		||||
              :key="item.id"
 | 
			
		||||
@@ -25,7 +25,7 @@
 | 
			
		||||
    <el-row>
 | 
			
		||||
      <el-col :span='12'>
 | 
			
		||||
        <el-form-item label="产品名称" prop="planProductId">
 | 
			
		||||
          <el-select v-model="form.planProductId" placeholder="请选择" style="width: 100%;" @change="selectProduct">
 | 
			
		||||
          <el-select v-model="form.planProductId" placeholder="请选择" :disabled="isBind"  style="width: 100%;" @change="selectProduct">
 | 
			
		||||
            <el-option
 | 
			
		||||
              v-for="item in productList"
 | 
			
		||||
              :key="item.id"
 | 
			
		||||
@@ -49,7 +49,8 @@
 | 
			
		||||
            type="datetime"
 | 
			
		||||
            value-format="yyyy-MM-dd HH:mm:ss"
 | 
			
		||||
            style="width: 100%;"
 | 
			
		||||
            placeholder="选择日期">
 | 
			
		||||
            placeholder="选择日期"
 | 
			
		||||
            :disabled="isBind">
 | 
			
		||||
          </el-date-picker>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
@@ -60,7 +61,8 @@
 | 
			
		||||
            type="datetime"
 | 
			
		||||
            value-format="yyyy-MM-dd HH:mm:ss"
 | 
			
		||||
            style="width: 100%;"
 | 
			
		||||
            placeholder="选择日期">
 | 
			
		||||
            placeholder="选择日期"
 | 
			
		||||
            :disabled="isBind">
 | 
			
		||||
          </el-date-picker>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
@@ -68,19 +70,19 @@
 | 
			
		||||
    <el-row>
 | 
			
		||||
      <el-col :span='12'>
 | 
			
		||||
        <el-form-item label="计划投入数量" prop="planAssignQuantity">
 | 
			
		||||
          <el-input-number v-model="form.planAssignQuantity" :min="0" :max="9999999999999" style="width: 100%;"></el-input-number>
 | 
			
		||||
          <el-input-number v-model="form.planAssignQuantity" :min="0" :max="9999999999999" :disabled="isBind" style="width: 100%;"></el-input-number>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
      <el-col :span='12'>
 | 
			
		||||
        <el-form-item label="计划生产数量" prop="planQuantity">
 | 
			
		||||
          <el-input-number v-model="form.planQuantity" :min="0" :max="9999999999999" style="width: 100%;"></el-input-number>
 | 
			
		||||
          <el-input-number v-model="form.planQuantity" :min="0" :max="9999999999999" :disabled="isBind" style="width: 100%;"></el-input-number>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
    </el-row>
 | 
			
		||||
    <el-row>
 | 
			
		||||
      <el-col :span='12'>
 | 
			
		||||
        <el-form-item label="关联工艺" prop="processFlowId">
 | 
			
		||||
          <el-select v-model="form.processFlowId" placeholder="请选择" style="width: 100%;">
 | 
			
		||||
          <el-select v-model="form.processFlowId" placeholder="请选择" :disabled="isBind" style="width: 100%;">
 | 
			
		||||
            <el-option
 | 
			
		||||
              v-for="item in processFlowList"
 | 
			
		||||
              :key="item.id"
 | 
			
		||||
@@ -92,7 +94,7 @@
 | 
			
		||||
      </el-col>
 | 
			
		||||
      <el-col :span='12'>
 | 
			
		||||
        <el-form-item label="物料计算方式" prop="materialMethod">
 | 
			
		||||
          <el-radio-group v-model="form.materialMethod">
 | 
			
		||||
          <el-radio-group v-model="form.materialMethod" :disabled="isBind">
 | 
			
		||||
            <el-radio :label="1">产品基础</el-radio>
 | 
			
		||||
            <el-radio :label="2">工艺扩展</el-radio>
 | 
			
		||||
          </el-radio-group>
 | 
			
		||||
@@ -102,7 +104,7 @@
 | 
			
		||||
    <el-row>
 | 
			
		||||
      <el-col :span='12'>
 | 
			
		||||
        <el-form-item label="优先级" prop="priority">
 | 
			
		||||
          <el-select v-model="form.priority" placeholder="请选择" style="width: 100%;">
 | 
			
		||||
          <el-select v-model="form.priority" placeholder="请选择" style="width: 100%;" :disabled="isBind">
 | 
			
		||||
            <el-option
 | 
			
		||||
              v-for="item in getDictDatas(DICT_TYPE.ORDER_PRIORITY)"
 | 
			
		||||
              :key="item.value"
 | 
			
		||||
@@ -114,7 +116,7 @@
 | 
			
		||||
      </el-col>
 | 
			
		||||
      <el-col :span='12'>
 | 
			
		||||
        <el-form-item label="工单类型" prop="type">
 | 
			
		||||
          <el-select v-model="form.type" placeholder="请选择" style="width: 100%;">
 | 
			
		||||
          <el-select v-model="form.type" placeholder="请选择" style="width: 100%;" :disabled="isBind">
 | 
			
		||||
            <el-option
 | 
			
		||||
              v-for="item in workOrderTypeList"
 | 
			
		||||
              :key="item.id"
 | 
			
		||||
@@ -128,7 +130,7 @@
 | 
			
		||||
    <el-row>
 | 
			
		||||
      <el-col :span='12'>
 | 
			
		||||
        <el-form-item label="关联产线" prop="productLineId">
 | 
			
		||||
          <el-select v-model="form.productLineId" placeholder="请选择" multiple style="width: 100%;">
 | 
			
		||||
          <el-select v-model="form.productLineId" placeholder="请选择" multiple style="width: 100%;" :disabled="isBind">
 | 
			
		||||
            <el-option
 | 
			
		||||
              v-for="item in productLineList"
 | 
			
		||||
              :key="item.id"
 | 
			
		||||
@@ -140,7 +142,7 @@
 | 
			
		||||
      </el-col>
 | 
			
		||||
      <el-col :span='12'>
 | 
			
		||||
        <el-form-item label="负责人" prop="workers">
 | 
			
		||||
          <el-input v-model="form.workers"></el-input>
 | 
			
		||||
          <el-input v-model="form.workers" :disabled="isBind"></el-input>
 | 
			
		||||
        </el-form-item>
 | 
			
		||||
      </el-col>
 | 
			
		||||
    </el-row>
 | 
			
		||||
@@ -155,8 +157,9 @@
 | 
			
		||||
</template>
 | 
			
		||||
<script>
 | 
			
		||||
import { getProductAll } from '@/api/base/product'
 | 
			
		||||
import { getProcessFlowList, getWorkOrderCode, orderIssue, workOrderList } from '@/api/base/orderManage'
 | 
			
		||||
import { getProcessFlowList, getWorkOrderCode, orderIssue, workOrderList, getWorkOrderById } from '@/api/base/orderManage'
 | 
			
		||||
import { getLineAll } from '@/api/base/productionLine'
 | 
			
		||||
import moment from 'moment'
 | 
			
		||||
export default {
 | 
			
		||||
  name: 'AddWorkOrder',
 | 
			
		||||
  data() {
 | 
			
		||||
@@ -185,7 +188,8 @@ export default {
 | 
			
		||||
        planProductId: [{ required: true, message: "产品名称不能为空", trigger: "change" }],
 | 
			
		||||
        planAssignQuantity: [{ required: true, message: "计划投入数量不能为空", trigger: "blur" }],
 | 
			
		||||
        planQuantity: [{ required: true, message: "计划生产数量不能为空", trigger: "blur" }],
 | 
			
		||||
        productLineId: [{ required: true, message: "产品不能为空", trigger: "change" }]
 | 
			
		||||
        productLineId: [{ required: true, message: "产线不能为空", trigger: "change" }],
 | 
			
		||||
        planAssignmentQuantity: [{ required: true, message: "计划分配订单量不能为空", trigger: "blur" }]
 | 
			
		||||
      },
 | 
			
		||||
      productList: [],
 | 
			
		||||
      processFlowList: [],
 | 
			
		||||
@@ -202,7 +206,6 @@ export default {
 | 
			
		||||
  },
 | 
			
		||||
  methods: {
 | 
			
		||||
    init(id, param) {
 | 
			
		||||
      console.log(id)
 | 
			
		||||
      this.form.orderId = id
 | 
			
		||||
      this.getList()
 | 
			
		||||
      if (param === 'add') {
 | 
			
		||||
@@ -249,33 +252,29 @@ export default {
 | 
			
		||||
    addWorkOrderSubmit() {
 | 
			
		||||
      this.$refs['addWorkOrder'].validate((valid) => {
 | 
			
		||||
        if (valid) {
 | 
			
		||||
          this.form.planStartTime = this.planStartTime ? new Date(this.planStartTime).valueOf() : ''
 | 
			
		||||
          this.form.planFinishTime = this.planFinishTime ? new Date(this.planFinishTime).valueOf() : ''
 | 
			
		||||
          console.log(this.form)
 | 
			
		||||
          orderIssue({ ...this.form }).then(res => {
 | 
			
		||||
            if (res.code === 0) {
 | 
			
		||||
              this.$modal.msgSuccess("操作成功")
 | 
			
		||||
              this.$emit('addWorkOrderSubmit')
 | 
			
		||||
            }
 | 
			
		||||
          })
 | 
			
		||||
          // if (this.isEdit) {
 | 
			
		||||
          //   //编辑
 | 
			
		||||
          //   orderUpdate({ ...this.form }).then((res) => {
 | 
			
		||||
          //     if (res.code === 0) {
 | 
			
		||||
          //       this.$modal.msgSuccess("操作成功");
 | 
			
		||||
          //       this.$emit('successSubmit')
 | 
			
		||||
          //     }
 | 
			
		||||
          //   })
 | 
			
		||||
          // } else {
 | 
			
		||||
          //   this.form.status = 1
 | 
			
		||||
          //   this.form.triggerOrigin = 1
 | 
			
		||||
          //   orderCreate({ ...this.form }).then((res) => {
 | 
			
		||||
          //     if (res.code === 0) {
 | 
			
		||||
          //       this.$modal.msgSuccess("操作成功");
 | 
			
		||||
          //       this.$emit('successSubmit')
 | 
			
		||||
          //     }
 | 
			
		||||
          //   })
 | 
			
		||||
          // }
 | 
			
		||||
          if (this.isBind) {
 | 
			
		||||
            //绑定工单
 | 
			
		||||
            orderIssue({
 | 
			
		||||
              workOrderId: this.form.workOrderId,
 | 
			
		||||
              orderId: this.form.orderId,
 | 
			
		||||
              planAssignmentQuantity: this.form.planAssignmentQuantity
 | 
			
		||||
             }).then((res) => {
 | 
			
		||||
              if (res.code === 0) {
 | 
			
		||||
                this.$modal.msgSuccess("操作成功")
 | 
			
		||||
                this.$emit('addWorkOrderSubmit')
 | 
			
		||||
              }
 | 
			
		||||
            })
 | 
			
		||||
          } else {
 | 
			
		||||
            // 新增工单
 | 
			
		||||
            this.form.planStartTime = this.planStartTime ? new Date(this.planStartTime).valueOf() : ''
 | 
			
		||||
            this.form.planFinishTime = this.planFinishTime ? new Date(this.planFinishTime).valueOf() : ''
 | 
			
		||||
            orderIssue({ ...this.form }).then(res => {
 | 
			
		||||
              if (res.code === 0) {
 | 
			
		||||
                this.$modal.msgSuccess("操作成功")
 | 
			
		||||
                this.$emit('addWorkOrderSubmit')
 | 
			
		||||
              }
 | 
			
		||||
            })
 | 
			
		||||
          }
 | 
			
		||||
        } else {
 | 
			
		||||
          return false
 | 
			
		||||
        }
 | 
			
		||||
@@ -283,6 +282,37 @@ export default {
 | 
			
		||||
    },
 | 
			
		||||
    formClear() {
 | 
			
		||||
      this.$refs.addWorkOrder.resetFields()
 | 
			
		||||
      this.form.materialMethod = 1
 | 
			
		||||
      this.form.planAssignQuantity = 0
 | 
			
		||||
      this.form.planQuantity = 0
 | 
			
		||||
      this.planFinishTime = ''
 | 
			
		||||
      this.planStartTime = ''
 | 
			
		||||
      this.form.planFinishTime = ''
 | 
			
		||||
      this.form.planStartTime = ''
 | 
			
		||||
      this.isBind = false
 | 
			
		||||
    },
 | 
			
		||||
    // 绑定工单,选择工单时获取工单信息
 | 
			
		||||
    getWorkOrderMsg() {
 | 
			
		||||
      if (this.form.workOrderId) {
 | 
			
		||||
        getWorkOrderById({id:this.form.workOrderId}).then(res => {
 | 
			
		||||
          if (res.code === 0) {
 | 
			
		||||
            this.form.code = res.data.code
 | 
			
		||||
            this.form.planProductId = res.data.planProductId
 | 
			
		||||
            this.selectProduct(this.form.planProductId)
 | 
			
		||||
            this.form.productSpec = res.data.productSpec
 | 
			
		||||
            this.planStartTime = res.data.planStartTime ? moment.unix(res.data.planStartTime).format('YYYY-MM-DD HH:mm:ss') : null
 | 
			
		||||
            this.planFinishTime = res.data.planFinishTime ? moment.unix(res.data.planFinishTime).format('YYYY-MM-DD HH:mm:ss') : null
 | 
			
		||||
            this.form.planAssignQuantity = res.data.planAssignQuantity
 | 
			
		||||
            this.form.planQuantity = res.data.planQuantity
 | 
			
		||||
            this.form.processFlowId = res.data.processFlowId
 | 
			
		||||
            this.form.materialMethod = res.data.materialMethod
 | 
			
		||||
            this.form.priority = res.data.priority ? res.data.priority + '' : ''
 | 
			
		||||
            this.form.productLineId = res.data.productLineIds
 | 
			
		||||
            this.form.type = res.data.type
 | 
			
		||||
            this.form.workers = res.data.workers
 | 
			
		||||
          }
 | 
			
		||||
        })
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 
 | 
			
		||||
@@ -1,11 +0,0 @@
 | 
			
		||||
<template>
 | 
			
		||||
  <div>111</div>
 | 
			
		||||
</template>
 | 
			
		||||
<script>
 | 
			
		||||
export default {
 | 
			
		||||
  name: 'BindWorkOrder',
 | 
			
		||||
  data() {
 | 
			
		||||
    return {}
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</script>
 | 
			
		||||
@@ -50,28 +50,16 @@
 | 
			
		||||
      :before-close="addWorkOrderCancel"
 | 
			
		||||
      width='70%'
 | 
			
		||||
    >
 | 
			
		||||
      <add-work-order ref="addWorkOrder" @successSubmit="addWorkOrderSubmit" />
 | 
			
		||||
      <add-work-order ref="addWorkOrder" @addWorkOrderSubmit="addWorkOrderSubmit" />
 | 
			
		||||
    </base-dialog>
 | 
			
		||||
    <!-- 绑定工单 -->
 | 
			
		||||
    <!-- <base-dialog
 | 
			
		||||
      dialogTitle="绑定工单"
 | 
			
		||||
      :dialogVisible="bindWorkOrdervisible"
 | 
			
		||||
      @cancel="bindWorkOrderCancel"
 | 
			
		||||
      @confirm="bindWorkOrderConfirm"
 | 
			
		||||
      :before-close="bindWorkOrderCancel"
 | 
			
		||||
      width='70%'
 | 
			
		||||
    >
 | 
			
		||||
      <bind-work-order ref="bindWorkOrder" @successSubmit="bindWorkOrderSubmit" />
 | 
			
		||||
    </base-dialog> -->
 | 
			
		||||
  </div>
 | 
			
		||||
</template>
 | 
			
		||||
<script>
 | 
			
		||||
import { parseTime } from '@/utils/ruoyi'
 | 
			
		||||
import { getOrderPage, orderDelete } from '@/api/base/orderManage'
 | 
			
		||||
import { getOrderPage, orderDelete, customerList } from '@/api/base/orderManage'
 | 
			
		||||
import OrderAdd from './components/orderAdd'
 | 
			
		||||
import AddWorkOrder from './components/addWorkOrder'
 | 
			
		||||
import BindWorkOrder from './components/bindWorkOrder'
 | 
			
		||||
import { publicFormatter } from '@/utils/dict';
 | 
			
		||||
import { publicFormatter } from '@/utils/dict'
 | 
			
		||||
const tableProps = [
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'createTime',
 | 
			
		||||
@@ -81,7 +69,9 @@ const tableProps = [
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'name',
 | 
			
		||||
    label: '订单名称'
 | 
			
		||||
    label: '订单名称',
 | 
			
		||||
    minWidth: 120,
 | 
			
		||||
    showOverflowtooltip: true
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'code',
 | 
			
		||||
@@ -90,7 +80,8 @@ const tableProps = [
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'customerId',
 | 
			
		||||
    label: '客户(?)'
 | 
			
		||||
    label: '客户',
 | 
			
		||||
    showOverflowtooltip: true
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'triggerOrigin',
 | 
			
		||||
@@ -109,19 +100,22 @@ const tableProps = [
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'planQuantity',
 | 
			
		||||
    label: '计划加工量'
 | 
			
		||||
    label: '计划加工量',
 | 
			
		||||
    width: 90
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'actualQuantity',
 | 
			
		||||
    label: '实际加工量'
 | 
			
		||||
    label: '实际加工量',
 | 
			
		||||
    width: 90
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'planProductId',
 | 
			
		||||
    label: '产品(?)'
 | 
			
		||||
    prop: 'productName',
 | 
			
		||||
    label: '产品',
 | 
			
		||||
    showOverflowtooltip: true
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'unit',
 | 
			
		||||
    label: '单位(?)'
 | 
			
		||||
    label: '单位'
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'price',
 | 
			
		||||
@@ -229,26 +223,39 @@ export default {
 | 
			
		||||
      centervisible: false,
 | 
			
		||||
      priorityList: this.getDictDatas(this.DICT_TYPE.ORDER_PRIORITY),
 | 
			
		||||
      workIssueTitle: '',
 | 
			
		||||
      addWorkOrdervisible: false
 | 
			
		||||
      // bindWorkOrdervisible: false
 | 
			
		||||
      addWorkOrdervisible: false,
 | 
			
		||||
      orderDetailVisible: false
 | 
			
		||||
    }
 | 
			
		||||
  },
 | 
			
		||||
  components: { OrderAdd, AddWorkOrder, BindWorkOrder },
 | 
			
		||||
  components: { OrderAdd, AddWorkOrder },
 | 
			
		||||
  created() {
 | 
			
		||||
    window.addEventListener('resize', () => {
 | 
			
		||||
      this.tableH = this.tableHeight(260)
 | 
			
		||||
    })
 | 
			
		||||
    this.getSelectList()
 | 
			
		||||
    this.getList();
 | 
			
		||||
    this.getList()
 | 
			
		||||
  },
 | 
			
		||||
  methods: {
 | 
			
		||||
    getSelectList() {
 | 
			
		||||
      console.log(this.getDictDatas(this.DICT_TYPE.ORDER_PRIORITY))
 | 
			
		||||
    },
 | 
			
		||||
    getList() {
 | 
			
		||||
      getOrderPage({...this.queryParams}).then(res => {
 | 
			
		||||
        this.list = res.data.records || []
 | 
			
		||||
        let arr = res.data.records || []
 | 
			
		||||
        this.total = res.data.total || 0
 | 
			
		||||
        if (arr.length > 0) {
 | 
			
		||||
          customerList().then(result => {
 | 
			
		||||
            let tempData = result.data || []
 | 
			
		||||
            if (tempData.length > 0) {
 | 
			
		||||
              arr.map(item => {
 | 
			
		||||
                for (let i of tempData) {
 | 
			
		||||
                  if (item.customerId === i.id) {
 | 
			
		||||
                    item.customerId = i.name
 | 
			
		||||
                  }
 | 
			
		||||
                }
 | 
			
		||||
              })
 | 
			
		||||
              this.list = arr
 | 
			
		||||
            }
 | 
			
		||||
          })
 | 
			
		||||
        }else {
 | 
			
		||||
          this.list = arr
 | 
			
		||||
        }
 | 
			
		||||
      })
 | 
			
		||||
    },
 | 
			
		||||
    buttonClick(val) {
 | 
			
		||||
@@ -256,7 +263,7 @@ export default {
 | 
			
		||||
      if (val.btnName === 'search') {
 | 
			
		||||
        this.queryParams.name = val.name
 | 
			
		||||
        this.queryParams.status = val.status
 | 
			
		||||
        if (val.timeVal.length > 0) {
 | 
			
		||||
        if (val.timeVal && val.timeVal.length > 0) {
 | 
			
		||||
          this.queryParams.lastIssuedTime[0] = val.timeVal[0] + ' 00:00:00'
 | 
			
		||||
          this.queryParams.lastIssuedTime[1] = val.timeVal[1] + ' 23:59:59'
 | 
			
		||||
        } else {
 | 
			
		||||
@@ -285,6 +292,7 @@ export default {
 | 
			
		||||
          this.handleDelete(val.data)
 | 
			
		||||
          break
 | 
			
		||||
        case 'detail':
 | 
			
		||||
          this.$router.push({ name: 'OrderDetailData', params: { orderId: val.data.id }})
 | 
			
		||||
          break
 | 
			
		||||
        case 'add':
 | 
			
		||||
          this.workIssueTitle = '新增工单'
 | 
			
		||||
 
 | 
			
		||||
							
								
								
									
										314
									
								
								src/views/order/base/orderManage/orderDetailData.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										314
									
								
								src/views/order/base/orderManage/orderDetailData.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,314 @@
 | 
			
		||||
<template>
 | 
			
		||||
  <div class="orderDetailData">
 | 
			
		||||
    <div class="box1">
 | 
			
		||||
      <div class="boxTitle">
 | 
			
		||||
        <span class="blueTitle"></span>
 | 
			
		||||
        <span>订单编码: 432784632747238</span>
 | 
			
		||||
      </div>
 | 
			
		||||
      <div style="padding-left: 14px;">
 | 
			
		||||
        <el-row>
 | 
			
		||||
          <el-col :span='4'>
 | 
			
		||||
            <div class="blodTip">订单名</div>
 | 
			
		||||
            <div class="lightTip">{{orderMsg.name}}</div>
 | 
			
		||||
          </el-col>
 | 
			
		||||
          <el-col :span='4'>
 | 
			
		||||
            <div class="blodTip">产品信息</div>
 | 
			
		||||
            <div class="lightTip">{{orderMsg.productName}}</div>
 | 
			
		||||
          </el-col>
 | 
			
		||||
          <el-col :span='4'>
 | 
			
		||||
            <div class="blodTip">产品规格</div>
 | 
			
		||||
            <div class="lightTip">{{orderMsg.specifications}}</div>
 | 
			
		||||
          </el-col>
 | 
			
		||||
          <el-col :span='4'>
 | 
			
		||||
            <div class="blodTip">客户</div>
 | 
			
		||||
            <div class="lightTip">{{orderMsg.customerName}}</div>
 | 
			
		||||
          </el-col>
 | 
			
		||||
          <el-col :span='4'>
 | 
			
		||||
            <div class="blodTip">包装规格</div>
 | 
			
		||||
            <div class="lightTip">{{ getDictDataLabel(DICT_TYPE.PACK_SPEC, orderMsg.packSpec)}}</div>
 | 
			
		||||
          </el-col>
 | 
			
		||||
          <el-col :span='4'>
 | 
			
		||||
            <div class="blodTip">物料计算方式</div>
 | 
			
		||||
            <div class="lightTip">{{orderMsg.materialMethod ? (orderMsg.materialMethod === 1 ? '产品基础' : '工艺扩展') : ''}}</div>
 | 
			
		||||
          </el-col>
 | 
			
		||||
        </el-row>
 | 
			
		||||
        <el-row>
 | 
			
		||||
          <el-col :span='4'>
 | 
			
		||||
            <div class="blodTip">创建时间</div>
 | 
			
		||||
            <div class="lightTip">{{ parseTime(orderMsg.triggerTime) }}</div>
 | 
			
		||||
          </el-col>
 | 
			
		||||
          <el-col :span='4'>
 | 
			
		||||
            <div class="blodTip">计划开始时间</div>
 | 
			
		||||
            <div class="lightTip">{{ parseTime(orderMsg.planStartTime) }}</div>
 | 
			
		||||
          </el-col>
 | 
			
		||||
          <el-col :span='4'>
 | 
			
		||||
            <div class="blodTip">计划完成时间</div>
 | 
			
		||||
            <div class="lightTip">{{ parseTime(orderMsg.planFinishTime) }}</div>
 | 
			
		||||
          </el-col>
 | 
			
		||||
          <el-col :span='4'>
 | 
			
		||||
            <div class="blodTip">计划加工数量</div>
 | 
			
		||||
            <div class="lightTip">{{orderMsg.planQuantity}}</div>
 | 
			
		||||
          </el-col>
 | 
			
		||||
          <el-col :span='4'>
 | 
			
		||||
            <div class="blodTip">加工平方数(平方米)</div>
 | 
			
		||||
            <div class="lightTip">{{orderMsg.planArea}}</div>
 | 
			
		||||
          </el-col>
 | 
			
		||||
          <el-col :span='4'>
 | 
			
		||||
            <div class="blodTip">预计用时(时)</div>
 | 
			
		||||
            <div class="lightTip">{{ orderMsg.expectTime }}</div>
 | 
			
		||||
          </el-col>
 | 
			
		||||
        </el-row>
 | 
			
		||||
        <el-row>
 | 
			
		||||
          <el-col :span='4'>
 | 
			
		||||
            <div class="blodTip">状态</div>
 | 
			
		||||
            <div class="lightTip">{{getDictDataLabel(DICT_TYPE.ORDER_STATUS, orderMsg.status)}}</div>
 | 
			
		||||
          </el-col>
 | 
			
		||||
          <el-col :span='4'>
 | 
			
		||||
            <div class="blodTip">实际开始时间</div>
 | 
			
		||||
            <div class="lightTip">{{ parseTime(orderMsg.startProduceTime) }}</div>
 | 
			
		||||
          </el-col>
 | 
			
		||||
          <el-col :span='4'>
 | 
			
		||||
            <div class="blodTip">实际完成时间</div>
 | 
			
		||||
            <div class="lightTip">{{ parseTime(orderMsg.finishProduceTime) }}</div>
 | 
			
		||||
          </el-col>
 | 
			
		||||
          <el-col :span='4'>
 | 
			
		||||
            <div class="blodTip">实际生产数量</div>
 | 
			
		||||
            <div class="lightTip">{{orderMsg.actualQuantity	}}</div>
 | 
			
		||||
          </el-col>
 | 
			
		||||
          <el-col :span='4'>
 | 
			
		||||
            <div class="blodTip">完成比%</div>
 | 
			
		||||
            <div class="lightTip">{{orderMsg.completeProp}}</div>
 | 
			
		||||
          </el-col>
 | 
			
		||||
          <el-col :span='4'>
 | 
			
		||||
            <div class="blodTip">废片数量</div>
 | 
			
		||||
            <div class="lightTip">{{orderMsg.nokQuantity}}</div>
 | 
			
		||||
          </el-col>
 | 
			
		||||
        </el-row>
 | 
			
		||||
      </div>
 | 
			
		||||
    </div>
 | 
			
		||||
    <div class="box2">
 | 
			
		||||
      <div class="boxTitle">
 | 
			
		||||
        <span class="blueTitle"></span>
 | 
			
		||||
        <span>工单信息</span>
 | 
			
		||||
      </div>
 | 
			
		||||
      <!-- 列表 -->
 | 
			
		||||
      <base-table
 | 
			
		||||
        :page="queryParams.pageNo"
 | 
			
		||||
        :limit="queryParams.pageSize"
 | 
			
		||||
        :table-props="tableProps1"
 | 
			
		||||
        :table-data="list1"
 | 
			
		||||
        :max-height="tableH"
 | 
			
		||||
      />
 | 
			
		||||
    </div>
 | 
			
		||||
    <div class="box3">
 | 
			
		||||
      <div class="boxTitle">
 | 
			
		||||
        <span class="blueTitle"></span>
 | 
			
		||||
        <span>预计用料信息</span>
 | 
			
		||||
      </div>
 | 
			
		||||
      <!-- 列表 -->
 | 
			
		||||
      <base-table
 | 
			
		||||
        :page="queryParams.pageNo"
 | 
			
		||||
        :limit="queryParams.pageSize"
 | 
			
		||||
        :table-props="tableProps2"
 | 
			
		||||
        :table-data="list2"
 | 
			
		||||
        :max-height="tableH"
 | 
			
		||||
      />
 | 
			
		||||
    </div>
 | 
			
		||||
  </div>
 | 
			
		||||
</template>
 | 
			
		||||
<script>
 | 
			
		||||
import { parseTime } from '@/utils/ruoyi'
 | 
			
		||||
import { publicFormatter } from '@/utils/dict';
 | 
			
		||||
const tableProps1 = [
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'issueTime',
 | 
			
		||||
    label: '下发时间',
 | 
			
		||||
    filter: parseTime,
 | 
			
		||||
    minWidth: 150
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'name',
 | 
			
		||||
    label: '工单名',
 | 
			
		||||
    minWidth: 100,
 | 
			
		||||
    showOverflowtooltip: true
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'code',
 | 
			
		||||
    label: '工单编码',
 | 
			
		||||
    minWidth: 150
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'planQuantity',
 | 
			
		||||
    label: '计划加工量',
 | 
			
		||||
    width: 90
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'actualQuantity',
 | 
			
		||||
    label: '实际加工量',
 | 
			
		||||
    width: 90
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'actualArea',
 | 
			
		||||
    label: '加工平方数',
 | 
			
		||||
    width: 90
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'status',
 | 
			
		||||
    label: '状态',
 | 
			
		||||
    filter: publicFormatter('order_status')
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'startProduceTime',
 | 
			
		||||
    label: '开始时间',
 | 
			
		||||
    filter: parseTime,
 | 
			
		||||
    minWidth: 150
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'finishProduceTime',
 | 
			
		||||
    label: '结束时间',
 | 
			
		||||
    filter: parseTime,
 | 
			
		||||
    minWidth: 150
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'productLineNames',
 | 
			
		||||
    label: '关联产线',
 | 
			
		||||
    filter: (val) => val.join(','),
 | 
			
		||||
    showOverflowtooltip: true
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'workers',
 | 
			
		||||
    label: '负责人'
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'remark',
 | 
			
		||||
    label: '备注'
 | 
			
		||||
  }
 | 
			
		||||
]
 | 
			
		||||
const tableProps2 = [
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'materialName',
 | 
			
		||||
    label: '物料名称'
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'unit',
 | 
			
		||||
    label: '单位',
 | 
			
		||||
    filter: publicFormatter('unit_dict')
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'num',
 | 
			
		||||
    label: '剩余生产预计消耗'
 | 
			
		||||
  }
 | 
			
		||||
]
 | 
			
		||||
import { orderDetail, bomUseNum } from '@/api/base/orderManage'
 | 
			
		||||
export default {
 | 
			
		||||
  name: 'OrderDetailData',
 | 
			
		||||
  data() {
 | 
			
		||||
    return {
 | 
			
		||||
      orderId: '',
 | 
			
		||||
      tableProps1,
 | 
			
		||||
      tableProps2,
 | 
			
		||||
      list1: [],
 | 
			
		||||
      list2: [],
 | 
			
		||||
      tableH: this.tableHeight(510) / 2,
 | 
			
		||||
      // 查询参数
 | 
			
		||||
      queryParams: {
 | 
			
		||||
        pageNo: 1,
 | 
			
		||||
        pageSize: 500
 | 
			
		||||
      },
 | 
			
		||||
      orderMsg: {}
 | 
			
		||||
    }
 | 
			
		||||
  },
 | 
			
		||||
  mounted() {
 | 
			
		||||
    window.addEventListener('resize', () => {
 | 
			
		||||
      this.tableH = this.tableHeight(510) / 2
 | 
			
		||||
    })
 | 
			
		||||
    this.orderId = this.$route.params.orderId
 | 
			
		||||
    this.getMsg()
 | 
			
		||||
  },
 | 
			
		||||
  watch: {
 | 
			
		||||
    $route: 'initData'
 | 
			
		||||
  },
 | 
			
		||||
  methods: {
 | 
			
		||||
    initData(to) {
 | 
			
		||||
      if (to.name === 'OrderDetailData') {
 | 
			
		||||
        this.orderId = this.$route.params.orderId
 | 
			
		||||
        this.getMsg()
 | 
			
		||||
      }
 | 
			
		||||
    },
 | 
			
		||||
    getMsg() {
 | 
			
		||||
      orderDetail({
 | 
			
		||||
        id: this.orderId
 | 
			
		||||
      }).then(res => {
 | 
			
		||||
        this.orderMsg = res.data
 | 
			
		||||
        this.list1 = res.data.coreWorkOrderRespVOS
 | 
			
		||||
        bomUseNum({
 | 
			
		||||
          productId: this.orderMsg.planProductId
 | 
			
		||||
        }).then(res2 => {
 | 
			
		||||
          if (res2.data && res2.data.length > 0) {
 | 
			
		||||
            let arr = res2.data
 | 
			
		||||
            arr.map(item => {
 | 
			
		||||
              if (item) {
 | 
			
		||||
                item.num = item.num * this.orderMsg.remainingQuantity
 | 
			
		||||
              }
 | 
			
		||||
            })
 | 
			
		||||
            this.list2 = arr
 | 
			
		||||
          }else {
 | 
			
		||||
            this.list2 = []
 | 
			
		||||
          }
 | 
			
		||||
        })
 | 
			
		||||
      })
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</script>
 | 
			
		||||
<style lang='scss' scoped>
 | 
			
		||||
.orderDetailData {
 | 
			
		||||
  background-color: rgb(242, 244, 249);
 | 
			
		||||
  .box1, .box2, .box3 {
 | 
			
		||||
    background-color: #fff;
 | 
			
		||||
    border-radius: 9px;
 | 
			
		||||
  }
 | 
			
		||||
  .box2 {
 | 
			
		||||
    height: calc((100vh - 360px) / 2);
 | 
			
		||||
    padding: 12px 16px 0;
 | 
			
		||||
    margin: 8px 0;
 | 
			
		||||
  }
 | 
			
		||||
  .box1 {
 | 
			
		||||
    height: 215px;
 | 
			
		||||
    padding: 16px 16px 0 16px;
 | 
			
		||||
    .blodTip {
 | 
			
		||||
      height: 16px;
 | 
			
		||||
      font-weight: 600;
 | 
			
		||||
      color: rgba(0,0,0,0.85);
 | 
			
		||||
      margin-bottom: 8px;
 | 
			
		||||
    }
 | 
			
		||||
    .lightTip {
 | 
			
		||||
      height: 16px;
 | 
			
		||||
      font-weight: 400;
 | 
			
		||||
      color: rgba(102,102,102,0.75);
 | 
			
		||||
      margin-bottom: 12px;
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
  .box3 {
 | 
			
		||||
    padding: 16px;
 | 
			
		||||
    height: calc((100vh - 360px) / 2);
 | 
			
		||||
    }
 | 
			
		||||
  .boxTitle {
 | 
			
		||||
    display: inline-block;
 | 
			
		||||
    font-size: 16px;
 | 
			
		||||
    font-weight: 400;
 | 
			
		||||
    color: #000000;
 | 
			
		||||
    margin:0 10px 20px 0;
 | 
			
		||||
  }
 | 
			
		||||
  .blueTitle {
 | 
			
		||||
    content: '';
 | 
			
		||||
    display: inline-block;
 | 
			
		||||
    width: 4px;
 | 
			
		||||
    height: 18px;
 | 
			
		||||
    background-color: #0B58FF;
 | 
			
		||||
    border-radius: 1px;
 | 
			
		||||
    margin-right: 8px;
 | 
			
		||||
    vertical-align: bottom;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
							
								
								
									
										383
									
								
								src/views/order/monitoring/orderCompletionMonitoring/index.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										383
									
								
								src/views/order/monitoring/orderCompletionMonitoring/index.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,383 @@
 | 
			
		||||
<template>
 | 
			
		||||
  <div class="app-container orderMonitoring">
 | 
			
		||||
    <!-- 搜索工作栏 -->
 | 
			
		||||
    <search-bar
 | 
			
		||||
      :formConfigs="formConfig"
 | 
			
		||||
      ref="searchBarForm"
 | 
			
		||||
      @headBtnClick="buttonClick"
 | 
			
		||||
    />
 | 
			
		||||
    <el-tabs v-model="activeName" @tab-click="handleClick">
 | 
			
		||||
      <el-tab-pane label="数据列表" name="dataList">
 | 
			
		||||
        <!-- 列表 -->
 | 
			
		||||
        <base-table
 | 
			
		||||
          :page="queryParams.pageNo"
 | 
			
		||||
          :limit="queryParams.pageSize"
 | 
			
		||||
          :table-props="tableProps"
 | 
			
		||||
          :table-data="list"
 | 
			
		||||
          :max-height="tableH"
 | 
			
		||||
        >
 | 
			
		||||
          <method-btn
 | 
			
		||||
            v-if="tableBtn.length"
 | 
			
		||||
            slot="handleBtn"
 | 
			
		||||
            :width="250"
 | 
			
		||||
            label="操作"
 | 
			
		||||
            :method-list="tableBtn"
 | 
			
		||||
            @clickBtn="handleClick"
 | 
			
		||||
          />
 | 
			
		||||
        </base-table>
 | 
			
		||||
      </el-tab-pane>
 | 
			
		||||
      <el-tab-pane label="柱状图" name="barChart">
 | 
			
		||||
        <div class="boxTitle">
 | 
			
		||||
          <span class="blueTitle"></span>
 | 
			
		||||
          <span>各订单环形图</span>
 | 
			
		||||
        </div>
 | 
			
		||||
        <div 
 | 
			
		||||
          id="orderPieBar"
 | 
			
		||||
          style="width: 182px; height: 180px;"
 | 
			
		||||
        ></div>
 | 
			
		||||
      </el-tab-pane>
 | 
			
		||||
    </el-tabs>
 | 
			
		||||
  </div>
 | 
			
		||||
</template>
 | 
			
		||||
<script>
 | 
			
		||||
import * as echarts from 'echarts'
 | 
			
		||||
import { parseTime } from '@/utils/ruoyi'
 | 
			
		||||
import { publicFormatter } from '@/utils/dict'
 | 
			
		||||
import { orderMonitor, orderList } from '@/api/base/orderManage'
 | 
			
		||||
const tableProps = [
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'name',
 | 
			
		||||
    label: '订单名称'
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'customerName',
 | 
			
		||||
    label: '客户'
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'productname',
 | 
			
		||||
    label: '产品'
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'planStartTime',
 | 
			
		||||
    label: '计划开始时间',
 | 
			
		||||
    filter: parseTime,
 | 
			
		||||
    minWidth: 150
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'planFinishTime',
 | 
			
		||||
    label: '计划完成时间',
 | 
			
		||||
    filter: parseTime,
 | 
			
		||||
    minWidth: 150
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'status',
 | 
			
		||||
    label: '订单状态',
 | 
			
		||||
    filter: publicFormatter('order_priority')
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'startProduceTime',
 | 
			
		||||
    label: '实际开始时间',
 | 
			
		||||
    filter: parseTime,
 | 
			
		||||
    minWidth: 150
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'finishProduceTime',
 | 
			
		||||
    label: '实际完成时间',
 | 
			
		||||
    filter: parseTime,
 | 
			
		||||
    minWidth: 150
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'productLines',
 | 
			
		||||
    label: '加工线',
 | 
			
		||||
    filter: (val) => val ? val.join(',') : '',
 | 
			
		||||
    minWidth: 180
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'planQuantity',
 | 
			
		||||
    label: '计划生产量',
 | 
			
		||||
    width: 100
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'actualquantity',
 | 
			
		||||
    label: '实际产出量',
 | 
			
		||||
    width: 100
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'completeRate',
 | 
			
		||||
    label: '订单完成率',
 | 
			
		||||
    width: 100
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    prop: 'workOrderNum',
 | 
			
		||||
    label: '关联工单数量',
 | 
			
		||||
    width: 100
 | 
			
		||||
  }
 | 
			
		||||
]
 | 
			
		||||
export default {
 | 
			
		||||
  name: 'OrderCompletionMonitoring',
 | 
			
		||||
  data() {
 | 
			
		||||
    return {
 | 
			
		||||
      formConfig: [
 | 
			
		||||
        {
 | 
			
		||||
          type: 'select',
 | 
			
		||||
          label: '订单名称',
 | 
			
		||||
          selectOptions: [],
 | 
			
		||||
          param: 'name'
 | 
			
		||||
        },
 | 
			
		||||
        {
 | 
			
		||||
          type: 'datePicker',
 | 
			
		||||
          label: '时间段',
 | 
			
		||||
          dateType: 'daterange',
 | 
			
		||||
          format: 'yyyy-MM-dd',
 | 
			
		||||
          valueFormat: "yyyy-MM-dd",
 | 
			
		||||
          rangeSeparator: '-',
 | 
			
		||||
          startPlaceholder: '开始时间',
 | 
			
		||||
          endPlaceholder: '结束时间',
 | 
			
		||||
          param: 'timeVal',
 | 
			
		||||
          defaultSelect: [],
 | 
			
		||||
          width: 250
 | 
			
		||||
        },
 | 
			
		||||
        {
 | 
			
		||||
          type: 'button',
 | 
			
		||||
          btnName: '查询',
 | 
			
		||||
          name: 'search',
 | 
			
		||||
          color: 'primary'
 | 
			
		||||
        }
 | 
			
		||||
      ],
 | 
			
		||||
      activeName: 'barChart',
 | 
			
		||||
      // 查询参数
 | 
			
		||||
      queryParams: {
 | 
			
		||||
        pageNo: 1,
 | 
			
		||||
        pageSize: 20,
 | 
			
		||||
        name: null,
 | 
			
		||||
        startProduceTime: []
 | 
			
		||||
      },
 | 
			
		||||
      tableProps,
 | 
			
		||||
      list: [],
 | 
			
		||||
      tableH: this.tableHeight(270),
 | 
			
		||||
      total: 0,
 | 
			
		||||
      tableBtn: [
 | 
			
		||||
      this.$auth.hasPermi('base:group-team:update')
 | 
			
		||||
          ? {
 | 
			
		||||
              type: 'orderDetail',
 | 
			
		||||
              btnName: '工单详情'
 | 
			
		||||
            }
 | 
			
		||||
          : undefined,
 | 
			
		||||
      this.$auth.hasPermi('base:group-team:update')
 | 
			
		||||
          ? {
 | 
			
		||||
              type: 'qualityDetail',
 | 
			
		||||
              btnName: '质量详情'
 | 
			
		||||
            }
 | 
			
		||||
          : undefined,
 | 
			
		||||
      this.$auth.hasPermi('base:group-team:update')
 | 
			
		||||
          ? {
 | 
			
		||||
              type: 'sendOutDetail',
 | 
			
		||||
              btnName: '发货详情'
 | 
			
		||||
            }
 | 
			
		||||
          : undefined
 | 
			
		||||
      ].filter((v) => v),
 | 
			
		||||
    }
 | 
			
		||||
  },
 | 
			
		||||
  mounted() {
 | 
			
		||||
    window.addEventListener('resize', () => {
 | 
			
		||||
      this.tableH = this.tableHeight(270)
 | 
			
		||||
    })
 | 
			
		||||
    this.getOrderList()
 | 
			
		||||
    this.getPage()
 | 
			
		||||
  },
 | 
			
		||||
  methods: {
 | 
			
		||||
    getOrderList() {
 | 
			
		||||
      orderList({}).then(res => {
 | 
			
		||||
        this.formConfig[0].selectOptions = res.data || []
 | 
			
		||||
      })
 | 
			
		||||
    },
 | 
			
		||||
    getPage() {
 | 
			
		||||
      orderMonitor({...this.queryParams}).then(res => {
 | 
			
		||||
        this.list = res.data || []
 | 
			
		||||
        this.getPieChart()
 | 
			
		||||
      })
 | 
			
		||||
    },
 | 
			
		||||
    // 饼图
 | 
			
		||||
    getPieChart() {
 | 
			
		||||
      var chartDom = document.getElementById('orderPieBar');
 | 
			
		||||
      var myChart = echarts.init(chartDom);
 | 
			
		||||
      var option;
 | 
			
		||||
 | 
			
		||||
      option = {
 | 
			
		||||
        color:['#288AFF','#7164FF','#fff','#63BDFF','#8EF0AB','#FFCE6A'],
 | 
			
		||||
        series: [
 | 
			
		||||
          {
 | 
			
		||||
            name: 'Access From',
 | 
			
		||||
            type: 'pie',
 | 
			
		||||
            radius: ['92%', '100%'],
 | 
			
		||||
            avoidLabelOverlap: false,
 | 
			
		||||
            label: {
 | 
			
		||||
              show: true,
 | 
			
		||||
              position: 'center'
 | 
			
		||||
            },
 | 
			
		||||
            emphasis: {
 | 
			
		||||
              disabled: true,
 | 
			
		||||
              scale:false,
 | 
			
		||||
              scaleSize: 0
 | 
			
		||||
            },
 | 
			
		||||
            labelLine: {
 | 
			
		||||
              show: false
 | 
			
		||||
            },
 | 
			
		||||
            data: [
 | 
			
		||||
              { value: 1000, name: '1' }
 | 
			
		||||
            ]
 | 
			
		||||
          },
 | 
			
		||||
          {
 | 
			
		||||
            name: 'Access From',
 | 
			
		||||
            type: 'pie',
 | 
			
		||||
            radius: ['84%', '92%'],
 | 
			
		||||
            avoidLabelOverlap: false,
 | 
			
		||||
            label: {
 | 
			
		||||
              show: false,
 | 
			
		||||
              position: 'center'
 | 
			
		||||
            },
 | 
			
		||||
            emphasis: {
 | 
			
		||||
              disabled: true,
 | 
			
		||||
              scale:false,
 | 
			
		||||
              scaleSize: 0
 | 
			
		||||
            },
 | 
			
		||||
            labelLine: {
 | 
			
		||||
              show: false
 | 
			
		||||
            },
 | 
			
		||||
            data: [
 | 
			
		||||
              { value: 50 ,name: '2' },
 | 
			
		||||
              { value: 500, name: 'xxx' }
 | 
			
		||||
            ]
 | 
			
		||||
          },
 | 
			
		||||
          {
 | 
			
		||||
            name: 'Access From',
 | 
			
		||||
            type: 'pie',
 | 
			
		||||
            radius: ['76%', '84%'],
 | 
			
		||||
            avoidLabelOverlap: false,
 | 
			
		||||
            label: {
 | 
			
		||||
              show: false,
 | 
			
		||||
              position: 'center'
 | 
			
		||||
            },
 | 
			
		||||
            emphasis: {
 | 
			
		||||
              disabled: true,
 | 
			
		||||
              scale:false,
 | 
			
		||||
              scaleSize: 0
 | 
			
		||||
            },
 | 
			
		||||
            labelLine: {
 | 
			
		||||
              show: false
 | 
			
		||||
            },
 | 
			
		||||
            data: [
 | 
			
		||||
              { value: 250, name: '3' },
 | 
			
		||||
              { value: 750, name: 'xxx' }
 | 
			
		||||
            ]
 | 
			
		||||
          },
 | 
			
		||||
          {
 | 
			
		||||
            name: 'Access From',
 | 
			
		||||
            type: 'pie',
 | 
			
		||||
            radius: ['68%', '76%'],
 | 
			
		||||
            avoidLabelOverlap: false,
 | 
			
		||||
            label: {
 | 
			
		||||
              show: false,
 | 
			
		||||
              position: 'center'
 | 
			
		||||
            },
 | 
			
		||||
            emphasis: {
 | 
			
		||||
              disabled: true,
 | 
			
		||||
              scale:false,
 | 
			
		||||
              scaleSize: 0
 | 
			
		||||
            },
 | 
			
		||||
            labelLine: {
 | 
			
		||||
              show: false
 | 
			
		||||
            },
 | 
			
		||||
            data: [
 | 
			
		||||
              { value: 800, name: '4' },
 | 
			
		||||
              { value: 1048, name: 'xxx' }
 | 
			
		||||
            ]
 | 
			
		||||
          },
 | 
			
		||||
          {
 | 
			
		||||
            name: 'Access From',
 | 
			
		||||
            type: 'pie',
 | 
			
		||||
            radius: ['60%', '68%'],
 | 
			
		||||
            avoidLabelOverlap: false,
 | 
			
		||||
            label: {
 | 
			
		||||
              show: false,
 | 
			
		||||
              position: 'center'
 | 
			
		||||
            },
 | 
			
		||||
            emphasis: {
 | 
			
		||||
              disabled: true,
 | 
			
		||||
              scale:false,
 | 
			
		||||
              scaleSize: 0
 | 
			
		||||
            },
 | 
			
		||||
            labelLine: {
 | 
			
		||||
              show: false
 | 
			
		||||
            },
 | 
			
		||||
            data: [
 | 
			
		||||
              { value: 1000, name: '5' },
 | 
			
		||||
              { value: 1048, name: 'xxx' }
 | 
			
		||||
            ]
 | 
			
		||||
          }
 | 
			
		||||
        ]
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
      option && myChart.setOption(option)
 | 
			
		||||
    },
 | 
			
		||||
    // 查询
 | 
			
		||||
    buttonClick(val) {
 | 
			
		||||
      this.queryParams.name = val.name
 | 
			
		||||
      if (val.timeVal && val.timeVal.length > 0) {
 | 
			
		||||
        this.queryParams.startProduceTime[0] = val.timeVal[0] + ' 00:00:00'
 | 
			
		||||
        this.queryParams.startProduceTime[1] = val.timeVal[1] + ' 23:59:59'
 | 
			
		||||
      } else {
 | 
			
		||||
        this.queryParams.startProduceTime = []
 | 
			
		||||
      }
 | 
			
		||||
      this.getPage()
 | 
			
		||||
    },
 | 
			
		||||
    handleClick() {}
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</script>
 | 
			
		||||
<style lang='scss'>
 | 
			
		||||
.orderMonitoring {
 | 
			
		||||
  .el-tabs__nav::after {
 | 
			
		||||
    content: "";
 | 
			
		||||
    position: absolute;
 | 
			
		||||
    left: 0;
 | 
			
		||||
    bottom: 0;
 | 
			
		||||
    width: 100%;
 | 
			
		||||
    height: 2px;
 | 
			
		||||
    background-color: #e4e7ed;
 | 
			
		||||
    /* z-index: 1; */
 | 
			
		||||
  }
 | 
			
		||||
  .el-tabs__nav-wrap::after {
 | 
			
		||||
    width: 0;
 | 
			
		||||
  }
 | 
			
		||||
  .el-tabs__item {
 | 
			
		||||
    padding: 0 10px;
 | 
			
		||||
  }
 | 
			
		||||
  .el-tabs__item:hover {
 | 
			
		||||
    color: rgba(0, 0, 0, 0.85);
 | 
			
		||||
  }
 | 
			
		||||
  .el-tabs__item.is-active {
 | 
			
		||||
    color: rgba(0, 0, 0, 0.85);
 | 
			
		||||
  }
 | 
			
		||||
  .el-tabs__item {
 | 
			
		||||
    color: rgba(0, 0, 0, 0.45);
 | 
			
		||||
  }
 | 
			
		||||
  .boxTitle {
 | 
			
		||||
    display: inline-block;
 | 
			
		||||
    font-size: 16px;
 | 
			
		||||
    font-weight: 400;
 | 
			
		||||
    color: #000000;
 | 
			
		||||
    margin:0 10px 20px 0;
 | 
			
		||||
  }
 | 
			
		||||
  .blueTitle {
 | 
			
		||||
    content: '';
 | 
			
		||||
    display: inline-block;
 | 
			
		||||
    width: 4px;
 | 
			
		||||
    height: 18px;
 | 
			
		||||
    background-color: #0B58FF;
 | 
			
		||||
    border-radius: 1px;
 | 
			
		||||
    margin-right: 8px;
 | 
			
		||||
    vertical-align: bottom;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
		Reference in New Issue
	
	Block a user