chuangte/yh-ui
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

更新

Browse Source
This commit is contained in:
磷叶 2025-02-17 18:03:30 +08:00
parent 3ef03a59d3
commit 3d8d48c06b
10 changed files with 1419 additions and 162 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

124
src/components/Business/Price/PriceSelect.vue Normal file
View File

@ -0,0 +1,124 @@
<template>
<el-select
v-model="selectedValue"
filterable
remote
reserve-keyword
placeholder="请输入工序名称/代码"
:remote-method="remoteSearch"
:loading="loading"
@change="handleChange"
@focus="handleFocus"
>
<el-option
v-for="item in options"
:key="item.priceId"
:label="label(item)"
:value="item.priceId"
>
<span style="float: left">{{ item.name | dv}}</span>
<span style="float: right; color: #8492a6; font-size: 13px">{{ item.code | dv}}</span>
</el-option>
<el-option v-if="options.length === 0 && !loading" style="height: 0px" disabled label="" :value="null"/>
<div style="text-align: center; color: #8492a6; font-size: 13px">
共{{ total }}条数据
</div>
</el-select>
</template>
<script>
import { listPrice } from '@/api/yh/price'
export default {
name: 'PriceSelect',
props: {
value: {
type: String,
default: null,
},
name: {
type: String,
default: null,
},
code: {
type: String,
default: null,
},
query: {
type: Object,
default: () => ({}),
}
},
data() {
return {
options: [],
loading: false,
queryParams: {
pageNum: 1,
pageSize: 100,
orderByColumn: 'name',
isAsc: 'asc',
keyword: null,
},
total: 0,
}
},
computed: {
selectedValue: {
get() {
return this.value
},
set(value) {
this.$emit('input', value)
}
},
label() {
return (item) => {
return item.name + (item.code ? '(' + item.code + ')' : '');
}
}
},
watch: {
value(nv, ov ) {
let obj = this.options.find(item => item.priceId == nv);
if (obj == null) {
this.options.push({priceId: nv, name: this.name, code: this.code});
}
}
},
created() {
if (this.value != null) {
this.options = [{priceId: this.value, name: this.name, code: this.code}]
}
},
methods: {
handleFocus() {
if (this.options == null || this.options.length == 0) {
this.getOptions();
}
},
handleChange(val) {
let obj = this.options.find(item => item.priceId == val);
this.$emit('change', obj);
},
// 远程搜索方法
async remoteSearch(keyword) {
this.queryParams.keywords = keyword.split(' ');
this.getOptions();
},
// 获取选项列表
getOptions() {
this.loading = true
this.queryParams = {
...this.queryParams,
...this.query
}
listPrice(this.queryParams).then(res => {
this.options = res.rows;
this.total = res.total;
}).finally(() => {
this.loading = false;
})
},
}
}
</script>

371
src/components/Business/ProdOrder/ProdOrderNewDrawer.vue Normal file
View File

@ -0,0 +1,371 @@
<template>
<el-drawer
:visible.sync="drawerVisible"
:size="drawerSize"
title="选择订单"
:destroy-on-close="true"
:with-header="false"
@open="onOpen"
append-to-body
:before-close="beforeClose"
>
<div class="order-drawer">
<!-- 搜索区域 -->
<div class="search-box">
<div class="search-container">
<el-input
v-model="queryParams.keyword"
placeholder="搜索订单编号/物料编码"
clearable
prefix-icon="el-icon-search"
@input="getList"
/>
<el-button
type="text"
class="select-btn"
@click="toggleSelectAll"
>
{{ isAllSelected ? '取消全选' : '全选' }}
</el-button>
</div>
</div>
<!-- 订单列表区域 -->
<div
class="order-list"
v-infinite-scroll="loadMore"
:infinite-scroll-immediate="false"
infinite-scroll-distance="10"
>
<div
v-for="item in orderList"
:key="item.id"
class="order-item"
:class="{ 'is-selected': selectedIds.includes(item.id) }"
@click="toggleSelection(item)"
>
<div class="order-content">
<div class="order-header">
<span class="order-no">{{ item.erpBillNo | dv}}</span>
<span class="order-status">
<dict-tag :options="dict.type.prod_order_erp_status" :value="item.erpStatus" size="mini"/>
<boolean-tag :value="!item.erpIsRework" true-text="正常" false-text="返工" size="mini" style="margin-left: 4px;"/>
</span>
</div>
<div class="order-details">
<div class="detail-item">
<div class="label">车间:</div>
<div class="value">{{ item.workShopName | dv}}</div>
</div>
<div class="detail-item">
<div class="label">物料:</div>
<div class="value">{{ item.materialNumber | dv}}</div>
</div>
</div>
</div>
<div class="check-icon">
<i
v-show="selectedIds.includes(item.id)"
class="el-icon-check"
></i>
</div>
</div>
<div v-if="loading" class="loading-tip">
<i class="el-icon-loading"></i>
加载中...
</div>
<div v-if="isFinished" class="loading-tip">
没有更多数据了
</div>
</div>
<!-- 底部操作区 -->
<div class="drawer-actions">
<div class="info">已选：{{ selectedIds.length }} 条</div>
<el-button @click="drawerVisible = false">取消</el-button>
<el-button type="primary" @click="confirmSelection">确定</el-button>
</div>
</div>
</el-drawer>
</template>
<script>
import { listProdOrder, listProdOrderByIds } from '@/api/yh/prodOrder'
import BooleanTag from '@/components/BooleanTag/index.vue'
export default {
name: 'ProdOrderNewDrawer',
components: {
BooleanTag
},
dicts: ['prod_order_erp_status'],
props: {
show: {
type: Boolean,
default: false
},
multiple: {
type: Boolean,
default: true
},
defaultIds: {
type: Array,
default: () => []
},
query: {
type: Object,
default: () => ({})
},
listApi: {
type: Function,
default: listProdOrder
},
loadApi: {
type: Function,
default: listProdOrderByIds
}
},
data() {
return {
orderList: [],
loading: false,
selectedIds: [],
queryParams: {
pageNum: 1,
pageSize: 10,
keyword: null,
},
total: null,
isAllSelected: false,
}
},
computed: {
drawerVisible: {
get() {
return this.show
},
set(val) {
this.$emit('update:show', val)
}
},
drawerSize() {
return window.innerWidth < 768 ? '100%' : '600px'
},
isFinished() {
return this.total != null && this.orderList.length >= this.total;
}
},
methods: {
onOpen() {
this.selectedIds = [...this.defaultIds];
this.isAllSelected = false;
this.getList();
},
getList() {
this.queryParams.pageNum = 0;
this.queryParams = {
...this.queryParams,
...this.query
}
this.orderList = [];
this.total = null;
this.isAllSelected = false;
this.loadMore();
},
async loadMore() {
if (this.loading) {
return;
}
if (this.isFinished) {
return;
}
this.loading = true
this.queryParams.pageNum ++
try {
// 这里替换为实际的API调用
const res = await this.listApi(this.queryParams);
if (res.code === 200) {
this.orderList.push(...res.rows)
this.total = res.total;
if (this.isAllSelected) {
const newIds = res.rows
.map(user => user.id)
.filter(id => !this.selectedIds.includes(id))
this.selectedIds.push(...newIds)
}
}
} finally {
this.loading = false
}
},
toggleSelection(item) {
if (!this.multiple) {
this.selectedIds = [item.id]
this.confirmSelection();
} else {
const index = this.selectedIds.indexOf(item.id)
if (index === -1) {
this.selectedIds.push(item.id)
} else {
this.selectedIds.splice(index, 1)
}
}
},
async confirmSelection() {
if (this.selectedIds == null || this.selectedIds.length == 0) {
this.$message.warning('请选择订单');
return;
}
let res = await this.loadApi(this.selectedIds);
if (res.code == 200) {
this.$emit('confirm', res.data)
this.drawerVisible = false
}
},
toggleSelectAll() {
if (this.isAllSelected) {
this.selectedIds = []
this.isAllSelected = false
} else {
this.selectedIds = this.orderList.map(item => item.id)
this.isAllSelected = true
}
},
beforeClose(done) {
if (this.selectedIds != null && this.selectedIds.length > 0) {
this.$confirm('是否选中当前数据？').then(() => {
done();
this.confirmSelection();
}).catch(() => {
done();
});
} else {
done();
}
}
},
}
</script>
<style lang="scss" scoped>
.order-drawer {
height: 100%;
display: flex;
flex-direction: column;
.search-box {
margin-top: 8px;
padding: 0 16px 8px;
border-bottom: 1px solid #eee;
.search-container {
display: flex;
align-items: center;
gap: 8px;
.el-input {
flex: 1;
}
.select-btn {
white-space: nowrap;
padding: 0 12px;
}
}
}
.order-list {
flex: 1;
overflow-y: auto;
padding: 8px 16px;
.order-item {
display: flex;
align-items: center;
padding: 8px;
border-radius: 6px;
cursor: pointer;
transition: all 0.2s;
margin-bottom: 4px;
&:hover {
background-color: #f5f7fa;
}
&.is-selected {
background-color: #ecf5ff;
.order-no {
color: #409eff;
font-weight: bold;
}
}
.order-content {
flex: 1;
.order-header {
display: flex;
align-items: center;
margin-bottom: 2px;
.order-no {
font-size: 14px;
font-weight: 500;
margin-right: 8px;
}
.order-status {
display: flex;
align-items: center;
}
}
.order-details {
color: #606266;
font-size: 12px;
display: flex;
gap: 8px;
.detail-item {
display: flex;
align-items: center;
.label {
width: fit-content;
}
.value {
flex: 1;
}
}
}
}
.check-icon {
width: 20px;
color: #409eff;
}
}
}
.loading-tip {
text-align: center;
color: #909399;
padding: 8px 0;
font-size: 12px;
}
.drawer-actions {
padding: 12px 16px;
border-top: 1px solid #eee;
display: flex;
justify-content: flex-end;
gap: 8px;
align-items: center;
.info {
flex: 1;
font-size: 14px;
color: #606266;
}
}
}
</style>

115
src/components/Business/User/UserNewDrawer.vue
View File

@ -11,8 +11,8 @@
>
<div class="user-drawer">
<!-- 搜索区域 -->
<div class="search-area">
<div class="search-wrapper">
<div class="search-box">
<div class="search-container">
<el-input
v-model="queryParams.keyword"
placeholder="搜索用户名称/工号"
@ -22,7 +22,7 @@
/>
<el-button
type="text"
class="select-all-btn"
class="select-btn"
@click="toggleSelectAll"
>
{{ isAllSelected ? '取消全选' : '全选' }}
@ -45,33 +45,34 @@
@click="toggleSelection(user)"
>
<div class="user-avatar">
<el-avatar :size="40">{{ user.nickName.charAt(0) }}</el-avatar>
<el-avatar :size="32">{{ user.nickName.charAt(0) }}</el-avatar>
</div>
<div class="user-info">
<div class="user-primary">
<span class="user-name">{{ user.nickName }}</span>
<span class="user-no">{{ user.userNo }}</span>
<div class="user-content">
<div class="user-header">
<span class="user-name">{{ user.nickName | dv}}</span>
<span class="user-no">{{ user.userNo | dv}}</span>
</div>
<div class="user-department">{{ user.deptName }}</div>
<div class="user-details">{{ user.deptName | dv}}</div>
</div>
<div class="user-selected">
<div class="check-icon">
<i
v-show="selectedIds.includes(user.userId)"
class="el-icon-check"
></i>
</div>
</div>
<div v-if="loading" class="loading-more">
<div v-if="loading" class="loading-tip">
<i class="el-icon-loading"></i>
加载中...
</div>
<div v-if="isFinished" class="loading-more">
<div v-if="isFinished" class="loading-tip">
没有更多数据了
</div>
</div>
<!-- 底部操作区 -->
<div class="drawer-footer">
<div class="drawer-actions">
<div class="info">已选：{{ selectedIds.length }} 条</div>
<el-button @click="drawerVisible = false">取消</el-button>
<el-button type="primary" @click="confirmSelection">确定</el-button>
</div>
@ -141,20 +142,20 @@ export default {
},
methods: {
onOpen() {
this.selectedIds = [...this.defaultIds];
this.isAllSelected = false;
this.getList();
this.selectedIds = [...this.defaultIds];
this.isAllSelected = false;
this.getList();
},
getList() {
this.queryParams.pageNum = 0;
this.queryParams = {
...this.queryParams,
...this.query
}
this.userList = [];
this.total = null;
this.isAllSelected = false;
this.loadMore();
this.queryParams.pageNum = 0;
this.queryParams = {
...this.queryParams,
...this.query
}
this.userList = [];
this.total = null;
this.isAllSelected = false;
this.loadMore();
},
async loadMore() {
if (this.loading) {
@ -238,23 +239,23 @@ export default {
display: flex;
flex-direction: column;
.search-area {
margin-top: 16px;
padding: 0 20px 16px;
.search-box {
margin-top: 8px;
padding: 0 16px 8px;
border-bottom: 1px solid #eee;
.search-wrapper {
.search-container {
display: flex;
align-items: center;
gap: 12px;
gap: 8px;
.el-input {
flex: 1;
}
.select-all-btn {
.select-btn {
white-space: nowrap;
padding: 0 15px;
padding: 0 12px;
}
}
}
@ -262,15 +263,16 @@ export default {
.user-list {
flex: 1;
overflow-y: auto;
padding: 12px 20px;
padding: 8px 16px;
.user-item {
display: flex;
align-items: center;
padding: 12px;
border-radius: 8px;
padding: 8px;
border-radius: 6px;
cursor: pointer;
transition: all 0.3s;
transition: all 0.2s;
margin-bottom: 4px;
&:hover {
background-color: #f5f7fa;
@ -285,54 +287,65 @@ export default {
}
.user-avatar {
margin-right: 12px;
margin-right: 8px;
.el-avatar {
width: 32px;
height: 32px;
font-size: 14px;
}
}
.user-info {
.user-content {
flex: 1;
.user-primary {
.user-header {
display: flex;
align-items: center;
margin-bottom: 4px;
margin-bottom: 2px;
.user-name {
font-size: 16px;
font-size: 14px;
font-weight: 500;
margin-right: 8px;
}
.user-no {
color: #909399;
font-size: 13px;
font-size: 12px;
}
}
.user-department {
.user-details {
color: #606266;
font-size: 13px;
font-size: 12px;
}
}
.user-selected {
width: 24px;
.check-icon {
width: 20px;
color: #409eff;
}
}
}
.loading-more {
.loading-tip {
text-align: center;
color: #909399;
padding: 12px 0;
padding: 8px 0;
font-size: 12px;
}
.drawer-footer {
padding: 16px 20px;
.drawer-actions {
padding: 12px 16px;
border-top: 1px solid #eee;
display: flex;
justify-content: flex-end;
gap: 12px;
gap: 8px;
.info {
flex: 1;
font-size: 14px;
color: #606266;
}
}
}
</style>

236
src/views/yh/report/edit-v2/components/ReportProductList.vue
View File

@ -3,7 +3,7 @@
<el-row type="flex" style="margin-bottom: 10px; justify-content: space-between;">
<el-input
v-model="searchKey"
placeholder="请输入工序名称/代码"
placeholder="请输入工序名称/代码/表面处理/颜色"
clearable
size="mini"
style="width: 300px;"
@ -13,9 +13,11 @@
>
<el-button slot="append" icon="el-icon-search" @click="handleSearch"></el-button>
</el-input>
<el-row type="flex" style="justify-content: flex-end;">
<el-button type="text" size="mini" :disabled="rows.length === 0" @click="handleBatchEditUserProduct" icon="el-icon-edit">TODO:修改所选员工产量</el-button>
<el-row type="flex" style="justify-content: flex-end;align-items: center;">
<div style="font-size: 12px; color: #999; margin-right: 10px;line-height: 1em;">自动汇总良品:<el-switch v-model="autoSumNum" style="height: 20px" size="mini" /></div>
<el-button type="text" size="mini" :disabled="rows.length === 0" @click="handleBatchEditUserProduct" icon="el-icon-edit">修改所选员工产量</el-button>
<el-button type="text" size="mini" :disabled="rows.length === 0" @click="handleCopy" icon="el-icon-document-copy">复制所选工序</el-button>
<el-button type="text" size="mini" :disabled="rows.length === 0" @click="handleBatchDel" icon="el-icon-delete">删除所选工序</el-button>
</el-row>
</el-row>
@ -24,37 +26,56 @@
size="mini"
stripe
:header-cell-style="headerCellStyle"
class="mini-table"
class="mini-table table-form"
ref="table"
accordion
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" align="center"/>
<el-table-column type="index" min-width="30" align="right" label="#"/>
<table-form-col label="TODO:工序选择" prop-prefix="productList" prop="priceId" required :rules="rules.priceId">
<el-input slot-scope="d" v-model="d.row.priceId" placeholder="请输入工序"/>
<el-table-column type="index" min-width="10" align="right" label="#"/>
<table-form-col label="工序" prop-prefix="productList" prop="priceId" required :rules="rules.productList.priceId">
<price-select
slot-scope="d"
v-model="d.row.priceId"
:name="d.row.priceName"
:code="d.row.priceCode"
:query="priceQuery"
@change="(val) => handlePriceChange(d.row, val)"
/>
</table-form-col>
<table-form-col label="成品" prop-prefix="productList" prop="isEnd" :rules="rules.isEnd" required width="60">
<table-form-col label="成品" prop-prefix="productList" prop="isEnd" :rules="rules.productList.isEnd" required width="60">
<el-checkbox slot-scope="d" v-model="d.row.isEnd"/>
</table-form-col>
<!-- <table-form-col label="不良品" prop-prefix="productList" prop="defectNum">
<el-input-number slot-scope="d" v-model="d.row.defectNum" placeholder="请输入数量" :min="0" :precision="0" controls-position="right" style="width: 100%"/>
</table-form-col> -->
<table-form-col label="表面处理" prop-prefix="productList" prop="surface" :rules="rules.surface" header-icon="el-icon-edit" @click-header="handleBatchEdit('surface')">
<el-input slot-scope="d" v-model="d.row.surface" placeholder="请输入表面处理"/>
<table-form-col label="表面处理" prop-prefix="productList" prop="surface" :rules="rules.productList.surface" header-icon="el-icon-edit" @click-header="handleBatchEdit('surface')">
<el-select slot-scope="d" v-model="d.row.surface" placeholder="请选择表面处理" filterable clearable allow-create>
<el-option v-for="item in dict.type.surface" :key="item.value" :label="item.label" :value="item.value"/>
</el-select>
</table-form-col>
<table-form-col label="颜色" prop-prefix="productList" prop="color" :rules="rules.color" header-icon="el-icon-edit" @click-header="handleBatchEdit('color')">
<el-input slot-scope="d" v-model="d.row.color" placeholder="请输入颜色"/>
<table-form-col label="颜色" prop-prefix="productList" prop="color" :rules="rules.productList.color" header-icon="el-icon-edit" @click-header="handleBatchEdit('color')">
<el-select slot-scope="d" v-model="d.row.color" placeholder="请选择颜色" filterable clearable allow-create>
<el-option v-for="item in dict.type.color_code" :key="item.value" :label="item.label" :value="item.value"/>
</el-select>
</table-form-col>
<table-form-col label="良品" prop-prefix="productList" prop="num" required :rules="rules.num" header-icon="el-icon-edit" @click-header="handleBatchEdit('num')">
<table-form-col label="良品" prop-prefix="productList" prop="num" required :rules="rules.productList.num" header-icon="el-icon-edit" @click-header="handleBatchEdit('num')">
<el-input slot-scope="d" v-model="d.row.num" placeholder="请输入数量">
<template #append>
{{d.row.priceUnit | dv}}
</template>
</el-input>
</table-form-col>
<el-table-column label="操作" align="center" width="160">
<table-form-col label="单价" prop-prefix="productList" prop="pricePrice" align="right" width="80" :rules="rules.productList.pricePrice">
<span slot-scope="d" style="font-size: 12px;">{{d.row.pricePrice | dv}}</span>
</table-form-col>
<table-form-col label="详细" prop-prefix="productList" prop="pricePrice" align="right" width="80" :rules="rules.productList.pricePrice">
<div slot-scope="d" @click="handleDetail(d.row)">
<div style="font-size: 12px;">员工:{{d.row.userProdList.length}}</div>
<div style="font-size: 12px;" v-if="d.row.orderProdList.length > 0">订单:{{d.row.orderProdList.length}}</div>
</div>
</table-form-col>
<el-table-column label="操作" align="center" width="120">
<template #header>
<el-button size="small" icon="el-icon-plus" type="text" @click="handleAdd" >新增工序</el-button>
</template>
@ -77,13 +98,13 @@
icon="el-icon-document-copy"
size="small"
>复制</el-button>
<el-button
<!-- <el-button
type="text"
@click="handleDel(d.$index, d.row)"
icon="el-icon-delete"
size="small"
style="color: #f56c6c;"
>删除</el-button>
>删除</el-button> -->
</template>
</el-table-column>
<el-table-column type="expand" width="20" align="left">
@ -94,16 +115,19 @@
<report-product-user-list
v-model="d.row.userProdList"
:prop-prefix="`productList[${d.$index}].userProdList`"
:rules="rules.userProdList"
:rules="rules.productList.userProdList"
:prod="d.row"
:form="form"
@change-num="handleChangeUserNum(d.row)"
/>
</el-tab-pane>
<el-tab-pane :label="`订单产量(${d.row.orderProdList.length})`">
<report-product-order-list
v-model="d.row.orderProdList"
:prop-prefix="`productList[${d.$index}].orderProdList`"
:rules="rules.orderProdList"
:rules="rules.productList.orderProdList"
:prod="d.row"
:form="form"
/>
</el-tab-pane>
</el-tabs>
@ -114,6 +138,7 @@
<user-product-batch-dialog
:show.sync="showUserEditDialog"
@submit="onSubmitUserProductBatch"
/>
</div>
</template>
@ -126,11 +151,15 @@ import { isEmpty } from '@/utils/index'
import ReportProductUserList from '@/views/yh/report/edit-v2/components/ReportProductUserList.vue'
import ReportProductOrderList from '@/views/yh/report/edit-v2/components/ReportProductOrderList.vue'
import UserProductBatchDialog from '@/views/yh/report/edit-v2/components/UserProductBatchDialog.vue'
import { IncomeMode, PriceStatus } from '@/utils/constants'
import { notNullDecimal } from '@/utils/index'
import Decimal from 'decimal.js'
import PriceSelect from '@/components/Business/Price/PriceSelect.vue'
export default {
name: "ReportProductList",
dicts: ['price_type'],
components: { HoverShow, BooleanTag, TableFormCol, ReportProductUserList, ReportProductOrderList, UserProductBatchDialog},
dicts: ['price_type', 'surface', 'color_code'],
components: { HoverShow, BooleanTag, TableFormCol, ReportProductUserList, ReportProductOrderList, UserProductBatchDialog, PriceSelect},
props: {
form: {
type: Object,
@ -140,7 +169,12 @@ export default {
},
rules: {
type: Object,
default: () => ({})
default: () => ({
productList: {
userProdList: {},
orderProdList: {},
}
})
}
},
data() {
@ -152,9 +186,122 @@ export default {
searchKey: '', // 搜索关键字
filteredProductList: [], // 过滤后的工序列表
showUserEditDialog: false, // 批量修改员工产量弹窗
fieldMap: { // 字段映射
surface: '表面处理',
color: '颜色',
num: '良品',
},
autoSumNum: true, // 自动汇总良品
}
},
computed: {
priceQuery() {
return {
deptId: this.form.deptId,
status: PriceStatus.PASS, // 已审核
disabled: false,
excludePriceIds: this.form.productList.map(item => item.priceId)
}
}
},
created() {
this.handleSearch();
},
methods: {
handleDetail(row) {
// 展开行
this.$refs.table.toggleRowExpansion(row);
},
handlePriceChange(row, val) {
if (val == null) {
return;
}
row.priceCategory = val.category;
row.priceSize = val.size;
row.priceName = val.name;
row.priceSubName = val.subName;
row.pricePattern = val.pattern;
row.priceSpec = val.spec;
row.pricePrice = val.price;
row.priceUnit = val.unit;
row.priceClassify = val.classify;
row.priceQuantityNumerator = val.quantityNumerator;
row.priceQuantityDenominator = val.quantityDenominator;
row.priceCode = val.code;
},
// 当用户数量发生变化时，自动汇总良品
handleChangeUserNum(row) {
if (this.autoSumNum) {
this.calcRowNum(row);
}
},
// 批量修改员工产量
onSubmitUserProductBatch(data) {
if (data == null || isEmpty(data.list)) {
return;
}
// 分值模式
if (IncomeMode.SCORE === data.mode) {
// 计算总分
let totalScore = new Decimal(0);
data.list.forEach(item => {
totalScore = totalScore.plus(notNullDecimal(item.score));
})
// 计算员工产量
this.rows.forEach(row => {
let rowNum = notNullDecimal(row.num); // 本行的总产量
row.userProdList = data.list.map(item => {
return {
userId: item.userId,
userName: item.userName,
userNo: item.userNo,
num: rowNum.mul(notNullDecimal(item.score)).div(totalScore).toNumber().toFixed(2)
}
})
// 若员工产量相加含有误差，则由第一个员工抹平
let totalNum = notNullDecimal(0);
if (row.userProdList != null && !isEmpty(row.userProdList)) {
row.userProdList.forEach(item => {
totalNum = notNullDecimal(item.num).add(totalNum);
})
if (totalNum.toNumber() !== rowNum.toNumber()) {
let subtract = rowNum.sub(totalNum); // 差值
row.userProdList[0].num = notNullDecimal(row.userProdList[0].num).add(subtract).toNumber();
}
}
})
}
// 数量模式
else if (IncomeMode.COUNT === data.mode) {
this.rows.forEach(row => {
// 覆盖员工产量
row.userProdList = data.list.map(item => {
return {
userId: item.userId,
userName: item.userName,
userNo: item.userNo,
num: item.num
}
})
// 若需要自动汇总良品，则计算总产量
if (this.autoSumNum) {
this.calcRowNum(row);
}
})
this.$message.success("批量编辑成功");
}
this.showUserEditDialog = false;
},
// 计算单行总产量
calcRowNum(row) {
let totalCount = notNullDecimal(0);
row.userProdList.forEach(item => {
totalCount = notNullDecimal(item.num).add(totalCount);
})
row.num = totalCount.toNumber();
},
// 批量修改员工产量
handleBatchEditUserProduct() {
this.showUserEditDialog = true;
@ -162,19 +309,20 @@ export default {
// 批量编辑属性
handleBatchEdit(prop) {
if (this.rows.length === 0) {
this.$message.warning('请先勾选要编辑的工序');
this.$message.warning('请先勾选要批量修改的数据行');
return;
}
this.$prompt('请输入要编辑的属性值', '提示', {
let fieldName = this.fieldMap[prop];
this.$prompt(`请输入要批量修改的${fieldName}`, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
inputValue: '',
inputPlaceholder: '请输入属性值',
inputPlaceholder: `请输入${fieldName}`,
}).then(({ value }) => {
this.rows.forEach(row => {
row[prop] = value;
})
this.$message.success(`批量编辑成功，一共修改了${this.rows.length}行工序`);
this.$message.success(`批量编辑成功，一共修改了${this.rows.length}行数据`);
this.handleSearch();
})
},
@ -235,6 +383,18 @@ export default {
surface: null,
color: null,
sort: this.getNewSort(),
// vo
priceName: null,
priceCode: null,
priceUnit: null,
pricePrice: null,
priceCategory: null,
priceSize: null,
pricePattern: null,
priceSpec: null,
priceClassify: null,
priceQuantityNumerator: null,
priceQuantityDenominator: null,
userProdList: [],
orderProdList: [],
}
@ -281,6 +441,25 @@ export default {
this.form.productList.splice(index, 1)
})
},
// 批量删除工序
handleBatchDel() {
if (this.rows.length === 0) {
this.$message.warning('请先勾选要删除的工序');
return;
}
this.$confirm('是否删除所选工序?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
for (let i = 0; i < this.rows.length; i++) {
this.form.productList.splice(this.form.productList.indexOf(this.rows[i]), 1);
}
this.$message.success(`删除成功，一共删除了${this.rows.length}行工序`);
this.rows = [];
this.handleSearch();
});
},
handleSearch() {
if (!this.searchKey) {
this.filteredProductList = this.form.productList;
@ -288,10 +467,11 @@ export default {
}
const key = this.searchKey.toLowerCase();
this.filteredProductList = this.form.productList.filter(item => {
const priceId = (item.priceId || '').toLowerCase();
const priceName = (item.priceName || '').toLowerCase();
const priceCode = (item.priceCode || '').toLowerCase();
const surface = (item.surface || '').toLowerCase();
const color = (item.color || '').toLowerCase();
return priceId.includes(key) || surface.includes(key) || color.includes(key);
return priceName.includes(key) || priceCode.includes(key) || surface.includes(key) || color.includes(key);
});
}
}

59
src/views/yh/report/edit-v2/components/ReportProductOrderList.vue
View File

@ -5,7 +5,9 @@
size="mini"
stripe
class="mini-table"
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" align="center"/>
<el-table-column align="center" label="#" width="50" type="index"/>
<table-form-col label="订单" :prop-prefix="propPrefix" prop="orderId" required :rules="rules.orderId">
<template slot-scope="d">
@ -17,7 +19,7 @@
{{d.row.orderMaterialNumber | dv}}
</template>
</table-form-col>
<table-form-col label="产量" :prop-prefix="propPrefix" prop="num" required :rules="rules.num">
<table-form-col label="产量" :prop-prefix="propPrefix" prop="num" required :rules="rules.num" header-icon="el-icon-edit" @click-header="handleBatchEdit('num')">
<el-input slot-scope="d" v-model="d.row.num" placeholder="请输入产量">
<template #append>
{{prod.priceUnit | dv}}
@ -39,10 +41,11 @@
</el-table-column>
</el-table>
<prod-order-drawer
<prod-order-new-drawer
:show.sync="showOrderDialog"
@select="handleOrderSelect"
@confirm="handleOrderConfirm"
multiple
:query="orderQuery"
/>
</div>
@ -50,11 +53,12 @@
<script>
import TableFormCol from '@/components/TableFormCol/index.vue'
import ProdOrderDrawer from '@/components/Business/ProdOrder/ProdOrderDrawer.vue';
import ProdOrderNewDrawer from '@/components/Business/ProdOrder/ProdOrderNewDrawer.vue';
import {ProdOrderErpStatus} from "@/utils/constants";
export default {
name: "ReportProductOrderList",
components: { TableFormCol, ProdOrderDrawer },
components: { TableFormCol, ProdOrderNewDrawer },
props: {
// 数据
value: {
@ -73,10 +77,29 @@ export default {
type: Object,
default: () => ({})
},
form: {
type: Object,
default: () => ({})
}
},
data () {
return {
showOrderDialog: false,
rows: [],
fieldMap: { // 字段映射
num: '产量',
}
}
},
computed: {
orderQuery() {
return {
erpStatusList: [ProdOrderErpStatus.START_WORK],
materialCategory: this.prod.priceCategory,
materialSize: this.prod.priceSize,
materialGraphics: this.prod.pricePattern,
excludeIds: this.value.map(item => item.orderId),
}
}
},
methods: {
@ -95,9 +118,9 @@ export default {
})
},
// 选择订单
handleOrderSelect(orderList) {
handleOrderConfirm(orderList) {
let list = orderList.map(item => ({
orderId: item.orderId,
orderId: item.id,
num: null,
// vo
orderErpBillNo: item.erpBillNo,
@ -110,6 +133,28 @@ export default {
}
this.showOrderDialog = false;
},
// 批量编辑属性
handleBatchEdit(prop) {
if (this.rows.length === 0) {
this.$message.warning('请先勾选要批量修改的数据行');
return;
}
let fieldName = this.fieldMap[prop];
this.$prompt(`请输入要批量修改的${fieldName}`, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
inputValue: '',
inputPlaceholder: `请输入${fieldName}`,
}).then(({ value }) => {
this.rows.forEach(row => {
row[prop] = value;
})
this.$message.success(`批量编辑成功，一共修改了${this.rows.length}行数据`);
})
},
handleSelectionChange(selection) {
this.rows = selection;
}
}
}
</script>

60
src/views/yh/report/edit-v2/components/ReportProductUserList.vue
View File

@ -5,15 +5,17 @@
size="mini"
stripe
class="mini-table"
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" align="center"/>
<el-table-column align="center" label="#" width="50" type="index"/>
<table-form-col label="员工" :prop-prefix="propPrefix" prop="userId" required :rules="rules.userId">
<template slot-scope="d">
{{d.row.userName | dv}} ({{d.row.userNo | dv}})
</template>
</table-form-col>
<table-form-col label="产量" :prop-prefix="propPrefix" prop="num" required :rules="rules.num">
<el-input slot-scope="d" v-model="d.row.num" placeholder="请输入产量">
<table-form-col label="产量" :prop-prefix="propPrefix" prop="num" required :rules="rules.num" header-icon="el-icon-edit" @click-header="handleBatchEdit('num')">
<el-input slot-scope="d" v-model="d.row.num" placeholder="请输入产量" @change="handleChangeNum">
<template #append>
{{prod.priceUnit | dv}}
</template>
@ -37,6 +39,8 @@
<user-new-drawer
:show.sync="showUserDialog"
@confirm="handleUserConfirm"
:list-api="listUserWithShift"
:query="userQuery"
/>
</div>
@ -45,7 +49,7 @@
<script>
import TableFormCol from '@/components/TableFormCol/index.vue'
import UserNewDrawer from '@/components/Business/User/UserNewDrawer.vue'
import {listUserWithShift} from "@/api/system/user";
export default {
name: "ReportProductUserList",
components: {TableFormCol, UserNewDrawer },
@ -67,19 +71,64 @@ export default {
type: Object,
default: () => ({})
},
form: {
type: Object,
default: () => ({})
}
},
data () {
return {
showUserDialog: false,
rows: [],
fieldMap: { // 字段映射
num: '产量',
}
}
},
computed: {
deptQuery() {
userQuery() {
return {
shiftDate: this.form.reportDate,
targetDeptId: this.form.deptId,
excludeUserIds: this.value.map(item => item.userId),
}
}
},
methods: {
listUserWithShift,
handleChangeNum() {
this.emitChangeNum();
},
emitChangeNum() {
console.log('emitChangeNum');
this.$emit('change-num');
},
handleSelectionChange(selection) {
this.rows = selection;
},
handleBatchEdit(prop) {
if (this.rows.length === 0) {
this.$message.warning('请先勾选要批量修改的数据行');
return;
}
let fieldName = this.fieldMap[prop];
this.$prompt(`请输入要批量修改的${fieldName}`, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
inputValue: '',
inputPlaceholder: `请输入${fieldName}`,
}).then(({ value }) => {
this.rows.forEach(row => {
row[prop] = value;
})
this.$message.success(`批量编辑成功，一共修改了${this.rows.length}行数据`);
if (prop === 'num') {
this.emitChangeNum();
}
})
},
// 新增
handleAdd() {
this.showUserDialog = true;
@ -92,12 +141,13 @@ export default {
type: "warning"
}).then(() => {
this.value.splice(index, 1);
this.emitChangeNum();
})
},
handleUserConfirm(userList) {
let list = userList.map(item => ({
userId: item.userId,
num: 0,
num: null,
// vo
userName: item.nickName,
userNo: item.userNo,

348
src/views/yh/report/edit-v2/components/UserProdPreview.vue Normal file
View File

@ -0,0 +1,348 @@
<template>
<el-dialog
title="员工产量明细"
:visible.sync="visible"
width="90%"
close-on-click-modal
append-to-body
>
<div class="preview-container" v-if="data != null">
<!-- 汇总信息 -->
<div class="summary-info">
<div class="info-item">
<span class="label">日期：</span>
<span class="value">{{ data.reportDate | dv}}</span>
</div>
<div class="info-item">
<span class="label">总金额：</span>
<span class="value highlight">{{ totalAmount | dv}} 元</span>
</div>
</div>
<!-- 透视表 -->
<el-table
v-if="tableData.length"
:data="tableData"
style="width: 100%"
size="small"
border
:header-cell-style="{ background: '#f5f7fa' }"
:cell-style="{ padding: '8px 4px' }"
>
<!-- 员工列 -->
<el-table-column
prop="userName"
label="员工"
fixed="left"
min-width="100"
align="center"
>
<template slot-scope="scope">
<span class="user-name">{{ scope.row.userName }}</span>
</template>
</el-table-column>
<!-- 动态生成工序列 -->
<el-table-column
v-for="process in processList"
:key="process.priceId"
:label="process.priceName"
align="center"
min-width="200"
>
<template slot="header" slot-scope="scope">
<div class="process-header">
<div class="process-title">
<div class="process-name" :title="process.priceName">{{ process.priceName }}</div>
<div class="process-code" :title="process.priceCode">{{ process.priceCode }}</div>
</div>
<div class="process-info">
<span class="info-item">
<i class="el-icon-box"></i>
<span>{{ process.num }}{{ process.priceUnit }}</span>
</span>
<span class="info-item">
<i class="el-icon-money"></i>
<span>{{ process.pricePrice }}元/{{ process.priceUnit }}</span>
</span>
</div>
</div>
</template>
<template slot-scope="scope">
<template v-if="scope.row.products[process.priceId]">
<div class="prod-cell">
<div class="prod-num">
<span class="num">{{ scope.row.products[process.priceId].num }}</span>
<span class="unit">{{ process.priceUnit }}</span>
</div>
<div class="prod-amount">
<span class="amount">{{ calculateIncome(scope.row.products[process.priceId].num, process.pricePrice) }}</span>
<span class="unit">元</span>
</div>
</div>
</template>
<span v-else>-</span>
</template>
</el-table-column>
<!-- 合计列 -->
<el-table-column
label="合计金额"
fixed="right"
min-width="120"
align="center"
class-name="total-column"
>
<template slot-scope="scope">
<span class="total-income">{{ scope.row.totalAmount }}元</span>
</template>
</el-table-column>
</el-table>
<!-- 添加空状态 -->
<el-empty v-else description="暂无数据" />
</div>
<div slot="footer">
<el-button @click="visible = false">关 闭</el-button>
</div>
</el-dialog>
</template>
<script>
import { calcMulDecimal } from "@/utils/money";
import Decimal from "decimal.js";
import { notNullDecimal } from '@/utils';
export default {
name: "UserProdPreview",
props: {
show: {
type: Boolean,
default: false
},
data: {
type: Object,
default: () => ({})
}
},
data() {
return {
visible: false
}
},
computed: {
// 获取所有工序列表
processList() {
return (this.data?.productList || []).filter(item =>
item && item.userProdList && item.userProdList.length > 0
);
},
// 计算表格数据
tableData() {
if (!this.data || !this.data.productList) {
return [];
}
const userMap = new Map();
// 遍历所有工序
this.processList.forEach(process => {
if (!process.userProdList) return;
// 遍历工序下的所有用户产量
process.userProdList.forEach(userProd => {
if (!userProd || !userProd.userId) {
return;
}
if (!userMap.has(userProd.userId)) {
userMap.set(userProd.userId, {
userId: userProd.userId,
userName: userProd.userName || '',
products: {},
totalAmount: 0
});
}
const userData = userMap.get(userProd.userId);
userData.products[process.priceId] = {
num: userProd.num || 0,
amount: this.calculateIncome(userProd.num, process.pricePrice)
};
userData.totalAmount = new Decimal(userData.totalAmount)
.plus(userData.products[process.priceId].amount)
.toNumber();
});
});
return Array.from(userMap.values());
},
// 计算总金额
totalAmount() {
if (!this.tableData.length) {
return '0.00';
}
return this.tableData.reduce((sum, row) => {
return new Decimal(sum).plus(row.totalAmount || 0).toNumber();
}, 0).toFixed(2);
}
},
watch: {
show: {
handler(val) {
this.visible = val;
},
immediate: true
},
visible(val) {
if (!val) {
this.$emit('update:show', false);
}
}
},
methods: {
// 计算工资
calculateIncome(num, price) {
if (!num || !price) {
return '0.00';
}
return calcMulDecimal(num, price).toFixed(2);
}
}
}
</script>
<style lang="scss" scoped>
.preview-container {
.summary-info {
background-color: #f5f7fa;
border-radius: 4px;
padding: 16px;
margin-bottom: 16px;
display: flex;
gap: 24px;
.info-item {
.label {
color: #606266;
margin-right: 8px;
}
.value {
color: #303133;
font-weight: 500;
&.highlight {
color: #409EFF;
}
}
}
}
:deep(.el-table) {
.process-header {
padding: 4px;
.process-title {
margin-bottom: 4px;
.process-name {
font-weight: 500;
color: #303133;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.process-code {
font-size: 12px;
color: #909399;
margin-top: 2px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
.process-info {
display: flex;
justify-content: space-around;
font-size: 12px;
color: #909399;
margin-top: 4px;
padding-top: 4px;
border-top: 1px dashed #ebeef5;
.info-item {
display: flex;
align-items: center;
gap: 4px;
i {
font-size: 14px;
}
}
}
}
.prod-cell {
display: flex;
flex-direction: column;
gap: 4px;
.prod-num {
color: #303133;
font-weight: 500;
.unit {
font-size: 12px;
color: #909399;
margin-left: 2px;
}
}
.prod-amount {
font-size: 12px;
color: #67c23a;
.unit {
margin-left: 2px;
}
}
}
.total-column {
background-color: #fafafa;
}
.total-income {
color: #409EFF;
font-weight: 500;
}
}
}
// 添加响应式布局支持
@media screen and (max-width: 1024px) {
.preview-container {
:deep(.el-table) {
.process-header {
.process-title {
.process-name, .process-code {
text-align: center;
}
}
.process-info {
flex-direction: column;
align-items: center;
gap: 4px;
padding-top: 6px;
}
}
}
}
}
</style>

113
src/views/yh/report/edit-v2/components/UserProductBatchDialog.vue
View File

@ -1,7 +1,7 @@
<template>
<el-drawer :visible.sync="visible" append-to-body title="批量编辑员工产量" size="800px">
<el-drawer :visible.sync="visible" append-to-body title="批量编辑员工产量" size="700px">
<el-row style="padding: 16px;">
<el-form :model="form" :rules="rules" ref="form">
<el-form :model="form" :rules="rules" ref="form" size="mini">
<el-row>
<form-col :span="24" label="工资模式">
<el-radio-group v-model="form.mode">
@ -9,55 +9,54 @@
<el-radio-button :label="IncomeMode.SCORE">计分</el-radio-button>
</el-radio-group>
<div v-show="form.mode === IncomeMode.SCORE" style="color: red; ">
请注意！计分模式下，需要提前输入选中行的 <strong>总产量</strong> ，否则无法计算员工产量！
请注意！计分模式下，需要提前输入选中行的 <strong>良品数</strong> ，否则无法计算员工产量！
</div>
</form-col>
<form-col :span="24" label="更新工序总产量" label-width="8em" v-if="form.mode === IncomeMode.COUNT">
<!-- <form-col :span="24" label="更新工序" v-if="form.mode === IncomeMode.COUNT">
<el-switch v-model="form.updateTotal" active-text="开启" inactive-text="关闭"/>
<div style="color: red; " v-show="form.updateTotal">
请注意！开启之后，将会根据员工产量汇总并覆盖原有的工序总产量。
请注意！开启之后，将会根据员工良品数汇总并覆盖原有的工序良品数。
</div>
</form-col>
</form-col> -->
</el-row>
<!-- <el-row class="edit-table-operate">
<el-button type="primary" plain @click="handleAdd" icon="el-icon-plus" size="mini">添加员工</el-button>
</el-row> -->
<el-table :data="form.list" border size="mini">
<el-table :data="form.list" size="mini" @selection-change="handleSelectionChange">
<el-table-column type="selection" align="center"/>
<el-table-column label="序号" type="index" width="50" align="center"/>
<el-table-column label="员工" align="center">
<template #header>
<span class="required-label">
员工
</span>
</template>
<table-form-col label="员工" prop-prefix="list" prop="userId" :rules="rules.list.userId" required>
<template slot-scope="d">
<form-col table label-width="0">
<!-- <user-input v-model="d.row.userId" :list-api="listUserWithShift" :query="userQueryParams" open-type="drawer" /> -->
{{d.row.userName | dv}}
</form-col>
{{d.row.userName | dv}} ({{d.row.userNo | dv}})
</template>
</el-table-column>
<el-table-column align="center">
<template #header>
<span class="required-label" v-if="form.mode === IncomeMode.COUNT">
良品数
</span>
<span class="required-label" v-if="form.mode === IncomeMode.SCORE">
分数
</span>
</template>
<template slot-scope="d">
<form-col table label-width="0" v-if="form.mode === IncomeMode.COUNT" :prop="`list[${d.$index}].num`" :rules="rules.list.num">
<el-input-number v-model="d.row.num" type="number" placeholder="请输入员工产量" :min="1" style="width: 100%"/>
</form-col>
<form-col table label-width="0" v-if="form.mode === IncomeMode.SCORE" :prop="`list[${d.$index}].score`" :rules="rules.list.score">
<el-input-number v-model="d.row.score" type="number" placeholder="请输入员工分数" :min="0" style="width: 100%"/>
</form-col>
</template>
</el-table-column>
</table-form-col>
<table-form-col label="良品数"
v-if="form.mode === IncomeMode.COUNT"
prop-prefix="list"
prop="num"
:rules="rules.list.num"
required
header-icon="el-icon-edit"
@click-header="handleBatchEdit('num')">
<el-input slot-scope="d" v-model="d.row.num" type="number" placeholder="请输入良品数" size="mini"/>
</table-form-col>
<table-form-col label="分数"
v-if="form.mode === IncomeMode.SCORE"
prop-prefix="list"
prop="score"
:rules="rules.list.score"
required
header-icon="el-icon-edit"
@click-header="handleBatchEdit('score')">
<el-input slot-scope="d" v-model="d.row.score" type="number" placeholder="请输入分数" size="mini">
<template #append>
分
</template>
</el-input>
</table-form-col>
<el-table-column label="操作" align="center" width="100">
<template #header>
<el-button type="text" @click="handleAdd" icon="el-icon-plus" >添加员工</el-button>
<el-button type="text" @click="handleAdd" icon="el-icon-plus" size="mini">添加员工</el-button>
</template>
<template slot-scope="d">
<el-button type="text" size="mini" icon="el-icon-delete" @click="handleDel(d.$index)">删除</el-button>
@ -66,9 +65,9 @@
</el-table>
</el-form>
</el-row>
<el-row type="flex" justify="end" style="padding: 16px;">
<el-button @click="visible = false" icon="el-icon-close">取 消</el-button>
<el-button type="primary" @click="onSubmit()" icon="el-icon-check">确 定</el-button>
<el-row type="flex" justify="space-between" style="padding: 16px;">
<el-button style="flex:1" @click="visible = false" size="small" icon="el-icon-close">取 消</el-button>
<el-button style="flex:2" type="primary" @click="onSubmit()" size="small" icon="el-icon-check">确 定</el-button>
</el-row>
<user-new-drawer
@ -88,10 +87,11 @@ import UserInput from "@/components/Business/User/UserInput.vue";
import {IncomeMode} from "@/utils/constants";
import UserNewDrawer from "@/components/Business/User/UserNewDrawer.vue";
import {listUserWithShift} from "@/api/system/user";
import TableFormCol from '@/components/TableFormCol/index.vue'
export default {
name: "UserProductBatchDialog",
components: {UserNewDrawer, UserInput, FormCol},
components: {UserNewDrawer, UserInput, FormCol, TableFormCol},
props: {
show: {
type: Boolean,
@ -131,17 +131,43 @@ export default {
rules: {
list: {
num: [
{required: true, message: '请输入员工产量', trigger: 'blur'},
{required: true, message: '请输入员工良品数', trigger: 'blur'},
],
score: [
{required: true, message: '请输入员工分数', trigger: 'blur'},
]
}
},
rows: [],
fieldMap: {
num: '良品数',
score: '分数',
}
}
},
methods: {
listUserWithShift,
handleSelectionChange(selection) {
this.rows = selection;
},
handleBatchEdit(prop) {
if (this.rows.length === 0) {
this.$message.warning('请先勾选要批量修改的数据行');
return;
}
let fieldName = this.fieldMap[prop];
this.$prompt(`请输入要批量修改的${fieldName}`, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
inputValue: '',
inputPlaceholder: `请输入${fieldName}`,
}).then(({ value }) => {
this.rows.forEach(row => {
row[prop] = value;
})
this.$message.success(`批量编辑成功，一共修改了${this.rows.length}行数据`);
})
},
onSubmit() {
this.$refs.form.validate(valid => {
if (valid) {
@ -153,7 +179,7 @@ export default {
this.$emit('submit', this.form);
})
} else {
this.$message.warning("表单校验不通过，请检查")
this.$message.warning("表单校验未通过，请检查数据")
}
})
},
@ -174,6 +200,7 @@ export default {
this.form.list.push({
userId: item.userId,
userName: item.nickName,
userNo: item.userNo,
num: null,
score: 10,
})

145
src/views/yh/report/edit-v2/index.vue
View File

@ -4,6 +4,7 @@
<template #title>
{{title}}
<el-button type="text" @click="previewUserProd = true" style="margin-left: 16px" icon="el-icon-view">员工产量汇总</el-button>
<span style="font-size: 12px; color: #999; margin-left: 16px;">自动保存时间：{{saveTime | dv}}</span>
</template>
<el-button plain @click="cancel" icon="el-icon-close" size="small">取消</el-button>
<el-button type="primary" plain @click="submitForm(false)" icon="el-icon-check" size="small">仅保存</el-button>
@ -28,15 +29,15 @@
:picker-options="DatePickerOptions.DISABLE_FUTURE"
/>
</form-col>
<form-col :span="span" label="总金额">
<!-- <form-col :span="span" label="总金额">
{{totalPrice.toNumber() | dv}} 元
</form-col>
</form-col> -->
<form-col :span="24" label="备注">
<el-input v-model="form.remark" placeholder="请输入备注" type="textarea" maxlength="200" show-word-limit :autosize="{minRows: 2, maxRows: 10}"/>
</form-col>
</el-row>
<el-tabs>
<el-tabs v-if="init">
<el-tab-pane :label="`工序产量 (${form.productList.length}) `">
<report-product-list :form="form" :rules="rules" />
</el-tab-pane>
@ -44,6 +45,9 @@
</el-form>
</div>
<user-prod-preview :data="form" :show.sync="previewUserProd"/>
</div>
</template>
@ -58,14 +62,16 @@ import Decimal from "decimal.js";
import {DatePickerOptions} from "@/utils/constants";
import ReportProductList from '@/views/yh/report/edit-v2/components/ReportProductList.vue';
import { parseTime } from '@/utils/ruoyi.js';
import UserProdPreview from '@/views/yh/report/edit-v2/components/UserProdPreview.vue';
export default {
name: "ReportEditV2",
name: "ReportEdit",
components: {
EditHeader,
DeptTreeSelect,
FormCol,
ReportProductList
ReportProductList,
UserProdPreview
},
data() {
return {
@ -74,7 +80,6 @@ export default {
index: null,
showMore: false,
DatePickerOptions,
title: null,
loading: false,
gutter: 8,
span: 8,
@ -91,40 +96,123 @@ export default {
reportDate: [
{ required: true, message: "报表日期不能为空", trigger: "blur" }
],
}
productList: {
priceId: [
{ required: true, message: "工序不能为空", trigger: "blur" }
],
isEnd: [
{ required: true, message: "是否成品不能为空", trigger: "blur" }
],
num: [
{ required: true, message: "良品不能为空", trigger: "blur" }
],
userProdList: {
userId: [
{ required: true, message: "员工不能为空", trigger: "blur" }
],
num: [
{ required: true, message: "产量不能为空", trigger: "blur" }
]
},
orderProdList: {
orderId: [
{ required: true, message: "订单不能为空", trigger: "blur" }
],
num: [
{ required: true, message: "产量不能为空", trigger: "blur" }
]
}
}
},
autoSaveInterval: null,
saveTime: null,
init: false,
}
},
computed: {
...mapGetters(['deptId']),
// 总价
totalPrice() {
let total = new Decimal(0);
if (this.form != null && !isEmpty(this.form.productList)) {
this.form.productList.forEach(item => {
total = total.plus(notNullDecimal(item.totalAmount));
})
// totalPrice() {
// let total = new Decimal(0);
// if (this.form != null && !isEmpty(this.form.productList)) {
// this.form.productList.forEach(item => {
// total = total.plus(notNullDecimal(item.totalAmount));
// })
// }
// return total;
// },
// 标题
title() {
if (this.form.reportId == null) {
return "新增报表";
} else {
return "修改报表";
}
return total;
}
},
created() {
let localSave = this.getLocalSave();
this.form.reportId = this.$route.params.reportId;
if (this.form.reportId == null) {
this.title = "新增报表";
this.reset();
if (localSave != null && localSave.reportId == this.form.reportId) {
this.$confirm('是否恢复上次保存的数据？', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.form = localSave;
this.init = true;
}).catch(() => {
this.initData();
}).finally(() => {
this.startAutoSave();
});
} else {
this.title = "修改报表";
this.getDetail(this.form.reportId);
this.initData();
this.startAutoSave();
}
this.getPriceOptions(); // 获取工序选项
},
beforeDestroy() {
this.stopAutoSave();
},
activated() {
this.startAutoSave();
},
deactivated() {
this.stopAutoSave();
},
methods: {
// 获取工序选项
getPriceOptions() {
// TODO: 调用获取工序列表接口
initData() {
if (this.form.reportId == null) {
this.reset();
this.init = true;
} else {
this.getDetail(this.form.reportId);
}
},
handlePriceChange(priceId, row) {
// TODO: 根据选择的工序更新行数据
// 开启自动保存
startAutoSave() {
// 10秒自动保存一次
if (this.autoSaveInterval == null) {
this.autoSaveInterval = setInterval(() => {
this.saveTime = parseTime(new Date(), '{y}-{m}-{d} {h}:{i}:{s}');
localStorage.setItem('report', JSON.stringify(this.form));
}, 1000 * 10);
}
},
// 停止自动保存
stopAutoSave() {
if (this.autoSaveInterval != null) {
clearInterval(this.autoSaveInterval);
this.autoSaveInterval = null;
}
},
// 清空保存的数据
clearLocalSave() {
localStorage.removeItem('report');
},
// 获取保存的数据
getLocalSave() {
return JSON.parse(localStorage.getItem('report'));
},
handleEditProduct(row, index) {
this.row = row;
@ -146,18 +234,20 @@ export default {
});
},
cancel() {
this.clearLocalSave();
this.$tab.closeBack();
},
getDetail(reportId) {
this.loading = true;
getReport(reportId, {needProductList: true, needUserProd: true, needOrderProd: true}).then(response => {
this.form = response.data;
this.init = true;
}).finally(() => {
this.loading = false;
})
},
submitForm(submit) {
this.form.totalAmount = this.totalPrice;
// this.form.totalAmount = this.totalPrice;
this.$refs["form"].validate(valid => {
if (valid) {
this.$confirm(`确认${submit ? '保存并提交' : '保存'}当前报表？`, '提示', {
@ -170,6 +260,7 @@ export default {
updateReport(this.form, submit).then(res => {
if (res.code === 200) {
this.$modal.msgSuccess("修改成功");
this.clearLocalSave();
this.$tab.closeBack();
}
}).finally(() => {
@ -179,6 +270,7 @@ export default {
addReport(this.form, submit).then(res => {
if (res.code === 200) {
this.$modal.msgSuccess("新增成功");
this.clearLocalSave();
this.$tab.closeBack();
}
}).finally(() => {
@ -209,6 +301,7 @@ export default {
height: 100%;
display: flex;
flex-direction: column;
padding-bottom: 32px;
.edit-header {
flex-shrink: 0;

10
src/views/yh/reportProd/index.vue
View File

@ -67,6 +67,7 @@
:default-sort="defaultSort"
@sort-change="onSortChange"
@expand-change="onExpandChange"
size="mini"
>
<el-table-column type="selection" width="55" align="center" v-if="listConfig.showSelection"/>
<el-table-column type="expand" width="55" align="left" fixed="left">
@ -112,6 +113,9 @@
<template v-else-if="column.key === 'priceType'">
<dict-tag :value="d.row.priceType" :options="dict.type.price_type"/>
</template>
<template v-else-if="column.key === 'isEnd'">
<boolean-tag :value="d.row.isEnd"/>
</template>
<template v-else-if="column.key === 'reportStatus'">
<dict-tag :value="d.row.reportStatus" :options="dict.type.report_status"/>
</template>
@ -224,6 +228,7 @@ import {calcMulDecimal} from "@/utils/money";
import ReportUserProdDescriptions from "@/views/yh/reportProd/components/ReportUserProdDescriptions.vue";
import {formatFraction, isEmpty} from "@/utils";
import ReportOrderProdDescriptions from "@/views/yh/reportProd/components/ReportOrderProdDescriptions.vue";
import BooleanTag from '@/components/BooleanTag/index.vue'
// 默认排序字段
const defaultSort = {
@ -235,7 +240,7 @@ export default {
name: "ReportProd",
mixins: [$showColumns, $listConfig, $showSearch],
dicts: ['price_type', 'report_status'],
components: {ReportOrderProdDescriptions, ReportUserProdDescriptions, ReportUserProd, SearchFormItem, FormCol},
components: {ReportOrderProdDescriptions, ReportUserProdDescriptions, ReportUserProd, SearchFormItem, FormCol, BooleanTag},
props: {
query: {
type: Object,
@ -278,7 +283,8 @@ export default {
{key: 'priceDeptName', visible: true, label: '车间', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},
{key: 'priceName', visible: true, label: '工序', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},
{key: 'priceSubName', visible: true, label: '子工序', minWidth: null, sortable: true, overflow: false, align: 'center', width: "100"},
{key: 'priceType', visible: true, label: '类型', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},
{key: 'priceType', visible: false, label: '类型', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},
{key: 'isEnd', visible: true, label: '成品', minWidth: null, sortable: true, overflow: false, align: 'center', width: "80"},
{key: 'surface', visible: false, label: '表面处理', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},
{key: 'color', visible: false, label: '颜色', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},
{key: 'num', visible: true, label: '良品', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},