用户中心和采购计划完善
This commit is contained in:
48
pages/workbench/cost/components/Bar.vue
Normal file
48
pages/workbench/cost/components/Bar.vue
Normal file
@@ -0,0 +1,48 @@
|
||||
<template>
|
||||
<view class="charts-box">
|
||||
<qiun-data-charts
|
||||
type="column"
|
||||
:chartData="chartData"
|
||||
:opts="chartOpts"
|
||||
/>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'InventoryTrend',
|
||||
// 接收父组件传入的日期参数(YYYY-mm格式)
|
||||
props: {
|
||||
chartData: {
|
||||
type: Object,
|
||||
default: {
|
||||
categories: [], // 日期(1日-当前日或当月总天数)
|
||||
series: [] // 库存趋势数据
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 图表配置
|
||||
chartOpts: {
|
||||
title: { text:'月度收支', left:'center' },
|
||||
tooltip:{ trigger:'axis' },
|
||||
legend:{ data:['支出','收入(CNY)','收入(USD)'], bottom:0 },
|
||||
}
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.charts-box {
|
||||
width: 100%;
|
||||
height: 300px;
|
||||
padding: 16rpx;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
border-radius: 12rpx;
|
||||
box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
</style>
|
||||
102
pages/workbench/cost/components/Line.vue
Normal file
102
pages/workbench/cost/components/Line.vue
Normal file
@@ -0,0 +1,102 @@
|
||||
<template>
|
||||
<view class="charts-box">
|
||||
<qiun-data-charts
|
||||
type="line"
|
||||
:chartData="chartData"
|
||||
:opts="chartOpts"
|
||||
/>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { monthDataAnalysis } from "@/api/oa/wms/oaWarehouse";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
// 图表数据(符合uCharts格式)
|
||||
chartData: {
|
||||
categories: [], // 月份
|
||||
series: [] // 入库量、出库量数据
|
||||
},
|
||||
// 图表配置项
|
||||
chartOpts: {
|
||||
legend: true, // 显示图例
|
||||
dataLabel: false, // 不显示数据标签
|
||||
column: {
|
||||
type: "group" // 分组柱状图
|
||||
},
|
||||
xAxis: {
|
||||
fontColor: "#666",
|
||||
fontSize: 12
|
||||
},
|
||||
yAxis: {
|
||||
fontColor: "#666",
|
||||
fontSize: 12,
|
||||
gridColor: "#eee"
|
||||
},
|
||||
color: ["#007aff", "#ff9500"] // 入库、出库颜色
|
||||
}
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
// 页面就绪后获取数据
|
||||
this.getServerData();
|
||||
},
|
||||
methods: {
|
||||
getServerData() {
|
||||
// 显示加载提示
|
||||
uni.showLoading({
|
||||
title: '加载数据中...',
|
||||
mask: true
|
||||
});
|
||||
|
||||
// 调用接口获取数据(当前年份作为参数)
|
||||
const currentYear = new Date().getFullYear() + '-01';
|
||||
monthDataAnalysis({ month: currentYear }).then(res => {
|
||||
// 隐藏加载提示
|
||||
uni.hideLoading();
|
||||
|
||||
// 格式化接口数据为uCharts所需格式
|
||||
this.chartData = {
|
||||
categories: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
|
||||
series: [
|
||||
{
|
||||
name: "入库量",
|
||||
data: res.data.inData["月"] || [] // 从接口取入库数据
|
||||
},
|
||||
{
|
||||
name: "出库量",
|
||||
data: res.data.outData["月"] || [] // 从接口取出库数据
|
||||
}
|
||||
]
|
||||
};
|
||||
}).catch(err => {
|
||||
// 隐藏加载提示
|
||||
uni.hideLoading();
|
||||
|
||||
// 错误处理
|
||||
uni.showToast({
|
||||
title: '数据加载失败',
|
||||
icon: 'none',
|
||||
duration: 2000
|
||||
});
|
||||
console.error('获取出入库数据失败:', err);
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.charts-box {
|
||||
width: 100%;
|
||||
height: 300px; /* 固定图表高度,适配手机屏幕 */
|
||||
padding: 16rpx;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
border-radius: 12rpx;
|
||||
box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
</style>
|
||||
59
pages/workbench/cost/components/Pie.vue
Normal file
59
pages/workbench/cost/components/Pie.vue
Normal file
@@ -0,0 +1,59 @@
|
||||
<template>
|
||||
<view class="charts-box">
|
||||
<qiun-data-charts type="pie" :chartData="chartData" :opts="chartOpts" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
projectList: {
|
||||
required: true,
|
||||
type: Array
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
chartData: {},
|
||||
chartOpts: {
|
||||
color: ["#1890FF", "#91CB74", "#FAC858", "#EE6666", "#73C0DE", "#3CA272", "#FC8452", "#9A60B4", "#ea7ccc"],
|
||||
padding: [5, 5, 5, 5],
|
||||
enableScroll: false,
|
||||
extra: {
|
||||
pie: {
|
||||
activeOpacity: 0.5,
|
||||
activeRadius: 10,
|
||||
offsetAngle: 0,
|
||||
labelWidth: 15,
|
||||
border: false,
|
||||
borderWidth: 3,
|
||||
borderColor: "#FFFFFF"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
projectList: {
|
||||
handler(newVal) {
|
||||
const pieData = this.projectList
|
||||
// .filter(p => p.totalPrice > 0)
|
||||
.map(p => ({
|
||||
name: p.projectName,
|
||||
value: p.totalPrice,
|
||||
}));
|
||||
this.chartData = {
|
||||
series: [{
|
||||
data: pieData
|
||||
}]
|
||||
}
|
||||
},
|
||||
immediate: true,
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
179
pages/workbench/cost/components/RecentRecords.vue
Normal file
179
pages/workbench/cost/components/RecentRecords.vue
Normal file
@@ -0,0 +1,179 @@
|
||||
<template>
|
||||
<view class="recent-records-container">
|
||||
<view class="table-header">
|
||||
<text class="title">最近记录</text>
|
||||
</view>
|
||||
|
||||
<scroll-view
|
||||
scroll-x="true"
|
||||
class="table-scroll"
|
||||
show-scrollbar="false"
|
||||
>
|
||||
<view class="table-wrapper">
|
||||
<!-- 表头 -->
|
||||
<view class="table-row header-row">
|
||||
<view class="table-cell">物料名称</view>
|
||||
<view class="table-cell">型号</view>
|
||||
<view class="table-cell">当前库存</view>
|
||||
<view class="table-cell">安全库存</view>
|
||||
<view class="table-cell">在途数量</view>
|
||||
<view class="table-cell">库存状态</view>
|
||||
</view>
|
||||
|
||||
<!-- 表体 -->
|
||||
<view
|
||||
class="table-row"
|
||||
v-for="(item, index) in tableData"
|
||||
:key="index"
|
||||
:class="{ 'odd-row': index % 2 === 1 }"
|
||||
>
|
||||
<view class="table-cell">{{ item.name }}</view>
|
||||
<view class="table-cell">{{ item.model }}</view>
|
||||
<view class="table-cell">{{ item.inventory }}</view>
|
||||
<view class="table-cell">{{ item.threshold }}</view>
|
||||
<view class="table-cell">{{ item.taskInventory }}</view>
|
||||
<view class="table-cell">
|
||||
<view
|
||||
class="status-tag"
|
||||
:class="calcInventoryStatus(item.inventory, item.taskInventory, item.threshold).type"
|
||||
>
|
||||
{{ calcInventoryStatus(item.inventory, item.taskInventory, item.threshold).status }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 空状态 -->
|
||||
<view v-if="tableData.length === 0" class="empty-state">
|
||||
<uni-icons type="empty" size="60" color="#cccccc"></uni-icons>
|
||||
<text class="empty-text">暂无记录</text>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'RecentRecords',
|
||||
props: {
|
||||
// 接收表格数据
|
||||
tableData: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 计算库存状态
|
||||
calcInventoryStatus(inventory, inTransit, threshold) {
|
||||
const total = inventory + inTransit;
|
||||
|
||||
if (total > threshold + 10) {
|
||||
return { status: '库存积压', type: 'warning' };
|
||||
} else if (total > threshold) {
|
||||
return { status: '正常', type: 'success' };
|
||||
} else if (total <= threshold && total > threshold - 2) {
|
||||
return { status: '库存预警', type: 'danger' };
|
||||
} else {
|
||||
return { status: '库存不足', type: 'info' };
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.recent-records-container {
|
||||
width: 100%;
|
||||
background-color: #ffffff;
|
||||
border-radius: 12rpx;
|
||||
box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.table-header {
|
||||
padding: 20rpx 16rpx;
|
||||
border-bottom: 1px solid #f5f5f5;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.table-scroll {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.table-wrapper {
|
||||
width: 100%;
|
||||
min-width: 900rpx; /* 确保表格有足够宽度展示内容 */
|
||||
}
|
||||
|
||||
.table-row {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
border-bottom: 1px solid #f5f5f5;
|
||||
}
|
||||
|
||||
.table-row:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.header-row {
|
||||
background-color: #f9f9f9;
|
||||
}
|
||||
|
||||
.odd-row {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
||||
.table-cell {
|
||||
flex: 1;
|
||||
padding: 20rpx 10rpx;
|
||||
font-size: 24rpx;
|
||||
color: #666666;
|
||||
text-align: center;
|
||||
word-break: break-all;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.status-tag {
|
||||
padding: 4rpx 12rpx;
|
||||
border-radius: 14rpx;
|
||||
font-size: 22rpx;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.status-tag.success {
|
||||
background-color: #00b42a;
|
||||
}
|
||||
|
||||
.status-tag.warning {
|
||||
background-color: #ff7d00;
|
||||
}
|
||||
|
||||
.status-tag.danger {
|
||||
background-color: #f53f3f;
|
||||
}
|
||||
|
||||
.status-tag.info {
|
||||
background-color: #86909c;
|
||||
}
|
||||
|
||||
.empty-state {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 80rpx 0;
|
||||
}
|
||||
|
||||
.empty-text {
|
||||
font-size: 26rpx;
|
||||
color: #999999;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
</style>
|
||||
106
pages/workbench/cost/components/SummaryCards.vue
Normal file
106
pages/workbench/cost/components/SummaryCards.vue
Normal file
@@ -0,0 +1,106 @@
|
||||
<template>
|
||||
<view class="summary-cards-container">
|
||||
<scroll-view
|
||||
scroll-x="true"
|
||||
class="cards-scroll"
|
||||
show-scrollbar="false"
|
||||
>
|
||||
<view class="cards-wrapper">
|
||||
<view
|
||||
class="summary-card"
|
||||
v-for="(card, index) in cardsData"
|
||||
:key="index"
|
||||
>
|
||||
<view class="card-title">{{ card.title }}</view>
|
||||
<view class="card-value">人民币:{{ card.valueCNY }}</view>
|
||||
<view class="card-value">美元:{{ card.valueUSD }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'SummaryCards',
|
||||
props: {
|
||||
// 接收卡片数据,格式为数组对象
|
||||
cardsData: {
|
||||
type: Array,
|
||||
default: () => [
|
||||
{ title: '当前总库存量', value: 0, trend: 0 },
|
||||
{ title: '在途物料数量', value: 0, trend: 0 },
|
||||
{ title: '今日入库量', value: 0, trend: 0 },
|
||||
{ title: '今日出库量', value: 0, trend: 0 },
|
||||
{ title: '预警信息', value: 0, trend: 0 }
|
||||
]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 格式化数字,添加千位分隔符
|
||||
formatNumber(num) {
|
||||
return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',');
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.summary-cards-container {
|
||||
width: 100%;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.cards-scroll {
|
||||
width: 100%;
|
||||
white-space: nowrap;
|
||||
padding: 10rpx 0;
|
||||
}
|
||||
|
||||
.cards-wrapper {
|
||||
display: inline-flex;
|
||||
gap: 16rpx;
|
||||
padding: 0 16rpx;
|
||||
}
|
||||
|
||||
.summary-card {
|
||||
min-width: 240rpx;
|
||||
background-color: #ffffff;
|
||||
border-radius: 12rpx;
|
||||
padding: 20rpx;
|
||||
box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
.card-title {
|
||||
font-size: 26rpx;
|
||||
color: #666666;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.card-value {
|
||||
font-size: 34rpx;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
margin-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.card-trend {
|
||||
font-size: 22rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 4rpx;
|
||||
}
|
||||
|
||||
.trend-up {
|
||||
color: #00b42a;
|
||||
}
|
||||
|
||||
.trend-down {
|
||||
color: #f53f3f;
|
||||
}
|
||||
|
||||
.trend-flat {
|
||||
color: #888888;
|
||||
}
|
||||
</style>
|
||||
289
pages/workbench/cost/cost.vue
Normal file
289
pages/workbench/cost/cost.vue
Normal file
@@ -0,0 +1,289 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<!-- 加载状态 -->
|
||||
<view v-if="loading" class="loading-view">
|
||||
<uni-loading-icon size="24" color="#007aff"></uni-loading-icon>
|
||||
<text class="loading-text">加载中...</text>
|
||||
</view>
|
||||
|
||||
<!-- 内容区域(加载完成后显示) -->
|
||||
<view v-else>
|
||||
<!-- 月份选择 -->
|
||||
<view class="date-picker-container">
|
||||
<picker mode="date" @change="onDateChange" fields="month" :value="currentDate" class="date-picker">
|
||||
<view class="picker-view">
|
||||
<text>{{ formattedDate }}</text>
|
||||
</view>
|
||||
</picker>
|
||||
</view>
|
||||
<fad-collapse title="指标汇总">
|
||||
<SummaryCardsVue :cardsData="cardData"/>
|
||||
</fad-collapse>
|
||||
|
||||
<fad-collapse title="月度收支">
|
||||
<!-- <BarVue :chart-data="barChartData"></BarVue> -->
|
||||
</fad-collapse>
|
||||
|
||||
<fad-collapse title="近六月趋势">
|
||||
|
||||
</fad-collapse>
|
||||
|
||||
<fad-collapse title="项目支出占比">
|
||||
<PieVue :project-list="projectList"></PieVue>
|
||||
</fad-collapse>
|
||||
|
||||
<fad-collapse title="明细表格">
|
||||
|
||||
</fad-collapse>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
barData,
|
||||
findFinanceList2
|
||||
} from '@/api/oa/finance/finance';
|
||||
import {
|
||||
getExchangeRate
|
||||
} from '@/api/oa/finance/exchangeRate';
|
||||
import {
|
||||
projectData2
|
||||
} from '@/api/oa/project';
|
||||
|
||||
import SummaryCardsVue from './components/SummaryCards.vue';
|
||||
import PieVue from './components/Pie.vue'
|
||||
import BarVue from './components/Bar.vue';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
loading: true,
|
||||
currentDate: '',
|
||||
cardData: [], // 改为数组,存储汇总卡片数据(核心)
|
||||
monthlyDataMap: {}, // 初始化月度数据映射(用于图表/卡片)
|
||||
currentList: [], // barData接口返回的列表
|
||||
projectList: [], // projectData2接口返回的列表
|
||||
financeList: [], // findFinanceList2接口返回的列表
|
||||
queryFinanceParams: {}, // 接口请求参数(需确保已定义)
|
||||
dateForProject: '' ,// 项目接口日期参数(需确保已定义)
|
||||
barChartData: {},
|
||||
exchangeRate: 7,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
formattedDate() {
|
||||
const [year, month] = this.currentDate.split('-');
|
||||
return `${year}年${month}月`;
|
||||
}
|
||||
},
|
||||
components: {
|
||||
SummaryCardsVue,
|
||||
PieVue,
|
||||
BarVue
|
||||
},
|
||||
onLoad() {
|
||||
// 初始化日期为当前月份
|
||||
const now = new Date();
|
||||
const year = now.getFullYear();
|
||||
const month = now.getMonth() + 1;
|
||||
this.currentDate = `${year}-${month.toString().padStart(2, '0')}-01`;
|
||||
this.loadAllData()
|
||||
},
|
||||
methods: {
|
||||
async loadAllExchangeRates(months) {
|
||||
for (const m of months) {
|
||||
if (!this.monthlyDataMap[m]) this.monthlyDataMap[m] = {};
|
||||
if (this.monthlyDataMap[m].exchangeRate) continue;
|
||||
this.monthlyDataMap[m].exchangeRate = this.exchangeRate;
|
||||
}
|
||||
},
|
||||
onDateChange(e) {
|
||||
const value = e.detail.value;
|
||||
this.currentDate = value + '-01';
|
||||
|
||||
this.loadAllData()
|
||||
},
|
||||
async loadAllData() {
|
||||
this.loading = true;
|
||||
this.exchangeRate = await getExchangeRate()
|
||||
barData(this.queryFinanceParams)
|
||||
.then(res => {
|
||||
this.currentList = res.data;
|
||||
})
|
||||
.then(async () => {
|
||||
const months = this.currentList.map(i => i.month);
|
||||
await this.loadAllExchangeRates(months);
|
||||
return Promise.all([
|
||||
projectData2(this.currentDate),
|
||||
findFinanceList2({
|
||||
date: this.currentDate
|
||||
})
|
||||
]);
|
||||
})
|
||||
.then(([projRes, finRes]) => {
|
||||
this.projectList = projRes.data;
|
||||
this.financeList = finRes.data;
|
||||
this.computeSummaries();
|
||||
})
|
||||
.finally(() => {
|
||||
this.loading = false;
|
||||
console.log('loadAllData done', this.monthlyDataMap);
|
||||
this.$nextTick(this.initCharts);
|
||||
});
|
||||
},
|
||||
computeSummaries() {
|
||||
// 1. 获取当前选中月份(格式:YYYY-MM,从currentDate提取)
|
||||
const currentMonth = this.currentDate.slice(0, 7);
|
||||
|
||||
// 2. 初始化月度数据映射(确保每个月份的基础结构存在)
|
||||
this.currentList.forEach(item => {
|
||||
const month = item.month;
|
||||
if (!this.monthlyDataMap[month]) {
|
||||
this.monthlyDataMap[month] = {
|
||||
outTotal: 0,
|
||||
inCNY: 0,
|
||||
inUSD: 0,
|
||||
exchangeRate: this.monthlyDataMap[month]?.exchangeRate || 0 // 保留已有汇率
|
||||
};
|
||||
}
|
||||
// 赋值出库总额(从barData接口获取)
|
||||
this.monthlyDataMap[month].outTotal = item.totalOut;
|
||||
});
|
||||
|
||||
// 3. 初始化统计变量(月度/项目收支)
|
||||
const initStats = {
|
||||
monthlyOutCNY: 0, // 月度总支出(人民币)
|
||||
monthlyOutUSD: 0, // 月度总支出(美元)
|
||||
monthlyInCNY: 0, // 月度总收入(人民币)
|
||||
monthlyInUSD: 0, // 月度总收入(美元)
|
||||
projectOutCNY: 0, // 项目支出(人民币)
|
||||
projectOutUSD: 0, // 项目支出(美元)
|
||||
projectInCNY: 0, // 项目收入(人民币)
|
||||
projectInUSD: 0 // 项目收入(美元)
|
||||
};
|
||||
Object.assign(this, initStats);
|
||||
|
||||
// 4. 遍历财务明细,计算收支数据
|
||||
this.financeList.forEach(finItem => {
|
||||
const itemMonth = finItem.date.slice(0, 7); // 明细所属月份
|
||||
const amount = Number(finItem.amount) || 0; // 金额(转数字,避免NaN)
|
||||
const isOut = finItem.type === '0'; // 0=支出,1=收入(按业务定义)
|
||||
const currency = finItem.currency === 'USD' ? 'USD' : 'CNY'; // 货币类型
|
||||
|
||||
// 4.1 更新月度收入数据(存入monthlyDataMap)
|
||||
const monthData = this.monthlyDataMap[itemMonth];
|
||||
if (monthData && !isOut) {
|
||||
monthData[`in${currency}`] += amount;
|
||||
}
|
||||
|
||||
// 4.2 计算「当前选中月份」的统计数据
|
||||
if (itemMonth === currentMonth) {
|
||||
if (isOut) {
|
||||
// 支出:更新月度总支出 + 项目支出(有projectId才统计项目)
|
||||
this[`monthlyOut${currency}`] += amount;
|
||||
if (finItem.projectId) {
|
||||
this[`projectOut${currency}`] += amount;
|
||||
}
|
||||
} else {
|
||||
// 收入:更新月度总收入 + 项目收入(有projectId才统计项目)
|
||||
this[`monthlyIn${currency}`] += amount;
|
||||
if (finItem.projectId) {
|
||||
this[`projectIn${currency}`] += amount;
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// 5. 构建汇总卡片数据(核心:适配SummaryCards组件)
|
||||
console.log(this.monthlyDataMap, '月度数据')
|
||||
this.cardData = [
|
||||
{
|
||||
title: '月度总支出',
|
||||
valueCNY: Number(this.monthlyOutCNY.toFixed(2)), // 保留2位小数,转数字
|
||||
valueUSD: Number(this.monthlyOutUSD.toFixed(2))
|
||||
},
|
||||
{
|
||||
title: '月度总收入',
|
||||
valueCNY: Number(this.monthlyInCNY.toFixed(2)),
|
||||
valueUSD: Number(this.monthlyInUSD.toFixed(2))
|
||||
},
|
||||
{
|
||||
title: '项目支出',
|
||||
valueCNY: Number(this.projectOutCNY.toFixed(2)),
|
||||
valueUSD: Number(this.projectOutUSD.toFixed(2))
|
||||
},
|
||||
{
|
||||
title: '项目收入',
|
||||
valueCNY: Number(this.projectInCNY.toFixed(2)),
|
||||
valueUSD: Number(this.projectInUSD.toFixed(2))
|
||||
}
|
||||
];
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.container {
|
||||
padding: 16rpx;
|
||||
background-color: #f5f5f5;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
/* 日期选择器在折叠卡片额外内容中的样式 */
|
||||
.picker-view {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: #666;
|
||||
font-size: 24rpx;
|
||||
padding: 4rpx 8rpx;
|
||||
}
|
||||
|
||||
.icon-margin {
|
||||
margin-right: 8rpx;
|
||||
}
|
||||
|
||||
/* 图表样式调整 */
|
||||
.chart-item {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* 加载状态样式 */
|
||||
.loading-view {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 100rpx 0;
|
||||
}
|
||||
|
||||
.loading-text {
|
||||
margin-top: 20rpx;
|
||||
font-size: 28rpx;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
/* 折叠卡片间距 */
|
||||
.fad-collapse {
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
|
||||
.date-picker-container {
|
||||
background-color: #fff;
|
||||
border-radius: 8rpx;
|
||||
padding: 16rpx;
|
||||
box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
.date-picker {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.picker-view {
|
||||
text-align: center;
|
||||
font-size: 28rpx;
|
||||
color: #007aff;
|
||||
padding: 8rpx 0;
|
||||
}
|
||||
</style>
|
||||
@@ -109,6 +109,12 @@ export default {
|
||||
category: '财务中心',
|
||||
access: ['vice', 'baomi', 'ceo'] // 需要特定权限才能访问
|
||||
},
|
||||
// {
|
||||
// text: '项目成本',
|
||||
// icon: '/static/images/cost.png',
|
||||
// url: '/pages/workbench/cost/cost',
|
||||
// category: '财务中心',
|
||||
// },
|
||||
{
|
||||
text: '智慧库房',
|
||||
icon: '/static/images/smartStock.png',
|
||||
@@ -133,11 +139,35 @@ export default {
|
||||
url: '/pages/workbench/wms/out',
|
||||
category: '库房管理',
|
||||
},
|
||||
// {
|
||||
// text: '我的申请',
|
||||
// icon: '/static/images/apply.png',
|
||||
// url: '/pages/workbench/workflow/apply/apply',
|
||||
// category: '办公流程'
|
||||
// },
|
||||
// {
|
||||
// text: '代办任务',
|
||||
// icon: '/static/images/todo.png',
|
||||
// url: '/pages/workbench/workflow/todo/todo',
|
||||
// category: '办公流程'
|
||||
// },
|
||||
// {
|
||||
// text: '已办任务',
|
||||
// icon: '/static/images/finished.png',
|
||||
// url: '/pages/workbench/workflow/finished/finished',
|
||||
// category: '办公流程'
|
||||
// },
|
||||
{
|
||||
text: '线上营销',
|
||||
icon: '/static/images/yingxiao.png',
|
||||
url: '/pages/workbench/sales/sales',
|
||||
},
|
||||
{
|
||||
text: "用户管理",
|
||||
icon: '/static/images/user.png',
|
||||
url: '/pages/workbench/user/user',
|
||||
// access: ['vice', 'ceo']
|
||||
}
|
||||
],
|
||||
};
|
||||
},
|
||||
|
||||
22
pages/workbench/process/process.vue
Normal file
22
pages/workbench/process/process.vue
Normal file
@@ -0,0 +1,22 @@
|
||||
<template>
|
||||
<view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
664
pages/workbench/user/user.vue
Normal file
664
pages/workbench/user/user.vue
Normal file
@@ -0,0 +1,664 @@
|
||||
<template>
|
||||
<view class="report-schedule">
|
||||
<!-- header始终显示 -->
|
||||
<view class="search-bar">
|
||||
<view class="search-container">
|
||||
<view class="task-type-button-container">
|
||||
<view class="task-type-button" @click="openDrawer">
|
||||
<uni-icons type="settings" color="#2979ff" size="22"></uni-icons>
|
||||
</view>
|
||||
</view>
|
||||
<view class="search-input custom-search-input">
|
||||
<input v-model="queryParams.userName" class="input" type="text" placeholder="搜索用户名称" @confirm="onSearch"
|
||||
@keyup.enter="onSearch" />
|
||||
<view class="search-icon" @click="onSearch">
|
||||
<uni-icons type="search" color="#bbb" size="20"></uni-icons>
|
||||
</view>
|
||||
<view v-if="searchName" class="clear-icon" @click="onClearSearch">
|
||||
<uni-icons type="closeempty" color="#bbb" size="18"></uni-icons>
|
||||
</view>
|
||||
</view>
|
||||
<view class="add-button" @click="handleAdd">
|
||||
<uni-icons type="plusempty" color="#2979ff" size="22"></uni-icons>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 筛选抽屉 -->
|
||||
<uni-drawer ref="drawerRef" mode="left" :width="320">
|
||||
<view class="drawer-content">
|
||||
<view class="drawer-title">筛选</view>
|
||||
<view class="drawer-form">
|
||||
<view class="drawer-form-item">
|
||||
<text class="drawer-label">手机号</text>
|
||||
<uni-easyinput v-model="queryParams.phonenumber" placeholder="请输入手机号" />
|
||||
</view>
|
||||
<view class="drawer-form-item">
|
||||
<text class="drawer-label">状态</text>
|
||||
<oa-dict-select v-model="queryParams.status" dictType="sys_normal_disable"/>
|
||||
</view>
|
||||
</view>
|
||||
<view class="drawer-btns">
|
||||
<button class="drawer-btn-primary" @click="applyFilterAndClose">确定</button>
|
||||
<button class="drawer-btn" @click="resetFilterAndClose">重置</button>
|
||||
<button class="drawer-btn" @click="closeDrawer">关闭</button>
|
||||
</view>
|
||||
</view>
|
||||
</uni-drawer>
|
||||
|
||||
<view>
|
||||
<!-- 自定义列表,右滑菜单(uni-ui实现) -->
|
||||
<scroll-view scroll-y style="height: 100vh;" @scrolltolower="loadMore">
|
||||
<view v-if="reportScheduleList.length">
|
||||
<uni-swipe-action>
|
||||
<block v-for="(item, index) in reportScheduleList" :key="item.userId">
|
||||
<uni-swipe-action-item :right-options="getSwipeOptions(item)" @click="swipeActionClick($event, item)"
|
||||
style="margin-bottom: 16rpx;">
|
||||
<view class="card">
|
||||
<view class="card-title">
|
||||
<text class="project">{{ item.nickName }}</text>
|
||||
</view>
|
||||
<view class="card-content">
|
||||
<view>用户名称:{{ item.userName }}</view>
|
||||
<view>部门:{{ item.dept.deptName }}</view>
|
||||
<view>手机号码:{{ item.phonenumber }}</view>
|
||||
<view>注册时间:{{ item.createTime }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</uni-swipe-action-item>
|
||||
</block>
|
||||
</uni-swipe-action>
|
||||
</view>
|
||||
<view v-else class="empty">暂无数据</view>
|
||||
<view class="load-more-tips">
|
||||
<u-loading-icon v-if="loadingMore" text="加载中..." size="20" textSize="14" />
|
||||
<text v-else-if="!hasMore && reportScheduleList.length">没有更多了</text>
|
||||
</view>
|
||||
</scroll-view>
|
||||
|
||||
<!-- 新增/编辑弹窗 -->
|
||||
<uni-popup ref="popupRef" type="bottom">
|
||||
<view class="popup-content">
|
||||
<view class="uni-form">
|
||||
<view class="uni-form-item">
|
||||
<text class="uni-form-label">用户昵称</text>
|
||||
<uni-easyinput v-model="form.nickName" placeholder="请输入用户昵称" />
|
||||
</view>
|
||||
<view class="uni-form-item">
|
||||
<text class="uni-form-label">手机号码</text>
|
||||
<uni-easyinput type='phone' :disabled="form.userId" v-model="form.phonenumber" placeholder="请输入用户手机号" />
|
||||
</view>
|
||||
<view class="uni-form-item">
|
||||
<text class="uni-form-label">用户邮箱</text>
|
||||
<uni-easyinput type="email" v-model="form.email" placeholder="请输入用户邮箱" />
|
||||
</view>
|
||||
<view class="uni-form-item">
|
||||
<text class="uni-form-label">用户名称</text>
|
||||
<uni-easyinput v-model="form.userName" placeholder="请输入用户名称" />
|
||||
</view>
|
||||
<view class="uni-form-item" v-if="form.userId">
|
||||
<text class="uni-form-label">用户密码</text>
|
||||
<uni-easyinput type="password" v-model="form.password" placeholder="请输入用户密码" />
|
||||
</view>
|
||||
<view class="uni-form-item">
|
||||
<text class="uni-form-label">用户性别</text>
|
||||
<oa-dict-select v-model="form.sex" dictType="sys_user_sex"></oa-dict-select>
|
||||
</view>
|
||||
<view class="uni-form-item">
|
||||
<text class="uni-form-label">薪资</text>
|
||||
<uni-easyinput v-model="form.laborCost" placeholder="请输入薪资(工人为日薪)" />
|
||||
</view>
|
||||
<view class="uni-form-item">
|
||||
<text class="uni-form-label">保险金</text>
|
||||
<uni-easyinput v-model="form.insure" placeholder="请输入保险金" />
|
||||
</view>
|
||||
<view class="uni-form-item">
|
||||
<text class="uni-form-label">岗位</text>
|
||||
<uni-data-select v-model="form.postIds" multiple :localdata="roleOptions"></uni-data-select>
|
||||
</view>
|
||||
<view class="uni-form-item">
|
||||
<text class="uni-form-label">角色</text>
|
||||
<uni-data-select v-model="form.roleIds" multiple :localdata="roleOptions"></uni-data-select>
|
||||
</view>
|
||||
<view class="uni-form-item">
|
||||
<text class="uni-form-label">部门</text>
|
||||
<uni-data-picker :localdata="deptOptions" v-model="form.deptId"></uni-data-picker>
|
||||
</view>
|
||||
<view class="uni-form-item">
|
||||
<text class="uni-form-label">备注</text>
|
||||
<u-input v-model="form.remark" type="textarea" placeholder="请输入备注" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="popup-btns">
|
||||
<u-button type="primary" @click="submitForm">确定</u-button>
|
||||
<u-button @click="closePopup">取消</u-button>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
addUser,
|
||||
changeUserStatus,
|
||||
delUser,
|
||||
deptTreeSelect,
|
||||
getUser,
|
||||
listUser,
|
||||
resetUserPwd,
|
||||
updateUser
|
||||
} from "@/api/oa/user";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
userName: undefined,
|
||||
phonenumber: undefined,
|
||||
status: undefined,
|
||||
deptId: undefined
|
||||
},
|
||||
projectOptions: [],
|
||||
headerOptions: [],
|
||||
reportScheduleList: [],
|
||||
total: 0,
|
||||
single: true,
|
||||
multiple: true,
|
||||
form: {},
|
||||
viewType: 'table',
|
||||
showStartDate: false,
|
||||
showEndDate: false,
|
||||
swipeOptions: [{
|
||||
text: '编辑',
|
||||
style: {
|
||||
backgroundColor: '#2979ff',
|
||||
color: '#fff'
|
||||
}
|
||||
},
|
||||
{
|
||||
text: '删除',
|
||||
style: {
|
||||
backgroundColor: '#fa3534',
|
||||
color: '#fff'
|
||||
}
|
||||
},
|
||||
],
|
||||
// 新增:筛选相关
|
||||
searchName: '',
|
||||
filterProject: '',
|
||||
filterHeader: '',
|
||||
filterDateRange: [],
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
loadingMore: false,
|
||||
hasMore: true,
|
||||
startForm: {
|
||||
reportTitle: '',
|
||||
reportDate: '',
|
||||
reporter: '',
|
||||
projectId: '',
|
||||
remark: '',
|
||||
type: 1
|
||||
},
|
||||
startLoading: false,
|
||||
startPopupOpen: false,
|
||||
_startuserId: null,
|
||||
showGanttView: false,
|
||||
postOptions: [],
|
||||
roleOptions: [],
|
||||
deptOptions: [],
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
this.pageNum = 1
|
||||
this.hasMore = true
|
||||
this.handleQuery()
|
||||
deptTreeSelect().then(res => {
|
||||
console.log(res.data, '部门数据')
|
||||
// 递归转换函数(value直接使用原id)
|
||||
function transformStructure(source) {
|
||||
// 处理单个节点的转换
|
||||
function transformNode(node) {
|
||||
// 基础转换:text映射label,value直接使用原id
|
||||
const transformed = {
|
||||
text: node.label,
|
||||
value: node.id // 直接使用原始id作为value
|
||||
};
|
||||
|
||||
// 递归处理子节点(如果存在)
|
||||
if (node.children && node.children.length > 0) {
|
||||
transformed.children = node.children.map(child => transformNode(child));
|
||||
}
|
||||
|
||||
return transformed;
|
||||
}
|
||||
|
||||
// 处理整个数组
|
||||
return source.map(item => transformNode(item));
|
||||
}
|
||||
this.deptOptions = transformStructure(res.data)
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
openDrawer() {
|
||||
this.$refs.drawerRef.open();
|
||||
},
|
||||
closeDrawer() {
|
||||
this.$refs.drawerRef.close();
|
||||
},
|
||||
applyFilterAndClose() {
|
||||
this.applyFilter();
|
||||
this.closeDrawer();
|
||||
},
|
||||
resetFilterAndClose() {
|
||||
this.resetFilter();
|
||||
this.closeDrawer();
|
||||
},
|
||||
// 搜索框检索
|
||||
onSearch() {
|
||||
this.searchName = this.searchName
|
||||
this.handleQuery()
|
||||
},
|
||||
onClearSearch() {
|
||||
this.searchName = ''
|
||||
this.queryParams.nickName = ''
|
||||
this.handleQuery()
|
||||
},
|
||||
// 筛选抽屉应用
|
||||
applyFilter() {
|
||||
this.queryParams.projectId = this.filterProject
|
||||
this.queryParams.header = this.filterHeader
|
||||
if (this.filterDateRange && this.filterDateRange.length === 2) {
|
||||
this.queryParams.dateRange = this.filterDateRange
|
||||
} else {
|
||||
this.queryParams.dateRange = []
|
||||
}
|
||||
this.handleQuery()
|
||||
},
|
||||
// 筛选抽屉重置
|
||||
resetFilter() {
|
||||
this.queryParams.phonenumber = '';
|
||||
this.queryParams.status = null;
|
||||
},
|
||||
handleQuery() {
|
||||
this.pageNum = 1
|
||||
this.hasMore = true
|
||||
this.queryParams.pageNum = 1
|
||||
if (this.queryParams.dateRange && this.queryParams.dateRange.length === 2) {
|
||||
this.queryParams.startDate = this.queryParams.dateRange[0]
|
||||
this.queryParams.endDate = this.queryParams.dateRange[1]
|
||||
} else {
|
||||
this.queryParams.startDate = ''
|
||||
this.queryParams.endDate = ''
|
||||
}
|
||||
this.getList()
|
||||
},
|
||||
resetQuery() {
|
||||
this.queryParams = {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
projectId: '',
|
||||
nickName: '',
|
||||
header: '',
|
||||
dateRange: []
|
||||
}
|
||||
this.searchName = ''
|
||||
this.pageNum = 1
|
||||
this.hasMore = true
|
||||
this.getList()
|
||||
},
|
||||
getList() {
|
||||
this.loadingMore = true
|
||||
this.queryParams.pageNum = this.pageNum
|
||||
this.queryParams.pageSize = this.pageSize
|
||||
listUser(this.queryParams).then(res => {
|
||||
const rows = res.rows || []
|
||||
if (this.pageNum === 1) {
|
||||
this.reportScheduleList = rows
|
||||
} else {
|
||||
this.reportScheduleList = this.reportScheduleList.concat(rows)
|
||||
}
|
||||
// 判断是否还有更多
|
||||
this.hasMore = rows.length === this.pageSize
|
||||
this.total = res.total || 0
|
||||
}).finally(() => {
|
||||
this.loadingMore = false
|
||||
})
|
||||
},
|
||||
loadMore() {
|
||||
if (!this.hasMore || this.loadingMore) return
|
||||
this.pageNum++
|
||||
this.getList()
|
||||
},
|
||||
handleAdd() {
|
||||
getUser().then((res) => {
|
||||
this.postOptions = res.data.posts.map(item => ({
|
||||
text: item.postName,
|
||||
value: item.postId
|
||||
}));
|
||||
this.roleOptions = res.data.roles.map(item => ({
|
||||
text: item.roleName,
|
||||
value: item.roleId
|
||||
}));
|
||||
this.form = {}
|
||||
this.$refs.popupRef.open('bottom')
|
||||
})
|
||||
|
||||
},
|
||||
handleUpdate(row) {
|
||||
getUser(row.userId).then(res => {
|
||||
this.postOptions = res.data.posts.map(item => ({
|
||||
text: item.postName,
|
||||
value: item.postId
|
||||
}));
|
||||
this.roleOptions = res.data.roles.map(item => ({
|
||||
text: item.roleName,
|
||||
value: item.roleId
|
||||
}));
|
||||
this.form = res.data.user || {}
|
||||
this.$set(this.form, "postIds", res.data.postIds);
|
||||
this.$set(this.form, "roleIds", res.data.roleIds);
|
||||
this.$refs.popupRef.open('bottom')
|
||||
})
|
||||
},
|
||||
handleDelete(item) {
|
||||
uni.showModal({
|
||||
title: '确认删除',
|
||||
content: `确定要删除用户“${item.nickName}”吗?`,
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
const ids = item ? [item.userId] : this.selectedIds
|
||||
delUser(ids).then(() => {
|
||||
uni.showToast({
|
||||
title: '删除成功',
|
||||
icon: 'success'
|
||||
})
|
||||
this.getList()
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
handleExport() {
|
||||
// 导出逻辑可根据实际API实现
|
||||
uni.showToast({
|
||||
title: '导出功能开发中',
|
||||
icon: 'none'
|
||||
})
|
||||
},
|
||||
submitForm() {
|
||||
if (this.form.userId) {
|
||||
updateUser(this.form).then(() => {
|
||||
uni.showToast({
|
||||
title: '修改成功',
|
||||
icon: 'success'
|
||||
})
|
||||
this.closePopup()
|
||||
this.getList()
|
||||
})
|
||||
} else {
|
||||
addUser(this.form).then(() => {
|
||||
uni.showToast({
|
||||
title: '新增成功',
|
||||
icon: 'success'
|
||||
})
|
||||
this.closePopup()
|
||||
this.getList()
|
||||
})
|
||||
}
|
||||
},
|
||||
closePopup() {
|
||||
this.$refs.popupRef.close()
|
||||
},
|
||||
getSwipeOptions(item) {
|
||||
const options = [{
|
||||
text: '编辑',
|
||||
style: {
|
||||
backgroundColor: '#2979ff',
|
||||
color: '#fff'
|
||||
}
|
||||
},
|
||||
{
|
||||
text: '删除',
|
||||
style: {
|
||||
backgroundColor: '#fa3534',
|
||||
color: '#fff'
|
||||
}
|
||||
}
|
||||
];
|
||||
return options;
|
||||
},
|
||||
swipeActionClick(e, item) {
|
||||
const text = e.content.text;
|
||||
if (text === '编辑') {
|
||||
this.handleUpdate(item);
|
||||
} else if (text === '删除') {
|
||||
this.handleDelete(item);
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.report-schedule {
|
||||
min-height: 100vh;
|
||||
background-color: #f5f5f5;
|
||||
padding-bottom: 120rpx;
|
||||
}
|
||||
|
||||
.search-bar {
|
||||
padding: 20rpx;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 100;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.search-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 20rpx;
|
||||
}
|
||||
|
||||
.task-type-button-container {
|
||||
display: flex;
|
||||
gap: 12rpx;
|
||||
}
|
||||
|
||||
.task-type-button {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
background-color: transparent;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.search-input {
|
||||
flex: 1;
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background: #f5f5f5;
|
||||
border-radius: 100rpx;
|
||||
padding: 0 24rpx;
|
||||
height: 60rpx;
|
||||
}
|
||||
|
||||
.input {
|
||||
flex: 1;
|
||||
border: none;
|
||||
background: transparent;
|
||||
font-size: 30rpx;
|
||||
outline: none;
|
||||
height: 60rpx;
|
||||
line-height: 60rpx;
|
||||
}
|
||||
|
||||
.search-icon {
|
||||
margin-left: 8rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.clear-icon {
|
||||
margin-left: 8rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.drawer-content {
|
||||
padding: 32rpx 24rpx 24rpx 24rpx;
|
||||
}
|
||||
|
||||
.drawer-title {
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
|
||||
.drawer-form {
|
||||
margin-bottom: 32rpx;
|
||||
}
|
||||
|
||||
.drawer-form-item {
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
|
||||
.drawer-label {
|
||||
display: block;
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
margin-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.drawer-btns {
|
||||
display: flex;
|
||||
gap: 16rpx;
|
||||
margin-top: 24rpx;
|
||||
}
|
||||
|
||||
.drawer-btn-primary {
|
||||
flex: 1;
|
||||
background: #2979ff;
|
||||
color: #fff;
|
||||
border: none;
|
||||
border-radius: 8rpx;
|
||||
padding: 16rpx 0;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.drawer-btn {
|
||||
flex: 1;
|
||||
background: #f5f5f5;
|
||||
color: #333;
|
||||
border: none;
|
||||
border-radius: 8rpx;
|
||||
padding: 16rpx 0;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.card {
|
||||
background: #fff;
|
||||
border-radius: 16rpx;
|
||||
box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.05);
|
||||
padding: 24rpx;
|
||||
}
|
||||
|
||||
.card-title {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
font-weight: bold;
|
||||
margin-bottom: 12rpx;
|
||||
}
|
||||
|
||||
.project {
|
||||
color: #2979ff;
|
||||
}
|
||||
|
||||
.status {
|
||||
font-size: 24rpx;
|
||||
padding: 0 12rpx;
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
|
||||
.status-1 {
|
||||
background: #e0f7fa;
|
||||
color: #009688;
|
||||
}
|
||||
|
||||
.status-0,
|
||||
.status-undefined {
|
||||
background: #fffbe6;
|
||||
color: #faad14;
|
||||
}
|
||||
|
||||
.status-other {
|
||||
background: #fbeff2;
|
||||
color: #e91e63;
|
||||
}
|
||||
|
||||
.card-content view {
|
||||
margin-bottom: 8rpx;
|
||||
color: #666;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
|
||||
.empty {
|
||||
text-align: center;
|
||||
color: #bbb;
|
||||
margin: 40rpx 0;
|
||||
}
|
||||
|
||||
.popup-content {
|
||||
padding: 24rpx;
|
||||
background: #fff;
|
||||
max-height: 80vh;
|
||||
overflow-y: scroll;
|
||||
border-radius: 16rpx 16rpx 0 0;
|
||||
}
|
||||
|
||||
.uni-form {
|
||||
margin-bottom: 32rpx;
|
||||
}
|
||||
|
||||
.uni-form-item {
|
||||
margin-bottom: 32rpx;
|
||||
}
|
||||
|
||||
.uni-form-label {
|
||||
display: block;
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
margin-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.load-more-tips {
|
||||
text-align: center;
|
||||
color: #bbb;
|
||||
padding: 24rpx 0 32rpx 0;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.card-ops {
|
||||
margin-top: 16rpx;
|
||||
display: flex;
|
||||
gap: 16rpx;
|
||||
}
|
||||
|
||||
.gantt-toggle-bar {
|
||||
display: flex;
|
||||
gap: 16rpx;
|
||||
padding: 16rpx 0 8rpx 0;
|
||||
background: #fff;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
</style>
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<!-- 采购单列表(滚动加载区域) -->
|
||||
<!-- 出库单列表(滚动加载区域) -->
|
||||
<scroll-view
|
||||
scroll-y
|
||||
@scrolltolower="loadMore"
|
||||
@@ -19,7 +19,7 @@
|
||||
>
|
||||
<!-- 单据头部 -->
|
||||
<view class="doc-header">
|
||||
<view class="doc-title">采购单</view>
|
||||
<view class="doc-title">出库单</view>
|
||||
<uni-tag
|
||||
:type="item.status === 1 ? 'success' : 'warning'"
|
||||
class="status-tag"
|
||||
@@ -72,7 +72,7 @@
|
||||
<!-- 空状态 -->
|
||||
<view class="empty-state" v-else-if="!loading && TaskList.length === 0">
|
||||
<uni-icon type="empty" size="60" color="#ccc"></uni-icon>
|
||||
<text class="empty-text">暂无采购单数据</text>
|
||||
<text class="empty-text">暂无出库单数据</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@@ -98,7 +98,7 @@
|
||||
<view class="popup-container">
|
||||
<!-- 弹窗标题栏 -->
|
||||
<!-- <view class="popup-header">
|
||||
<text class="popup-title">采购单明细</text>
|
||||
<text class="popup-title">出库单明细</text>
|
||||
<uni-icon
|
||||
type="close"
|
||||
size="24"
|
||||
@@ -156,7 +156,7 @@
|
||||
|
||||
<view class="empty-state" v-else>
|
||||
<uni-icon type="empty" size="50" color="#ccc"></uni-icon>
|
||||
<text class="empty-text">暂无采购单明细</text>
|
||||
<text class="empty-text">暂无出库单明细</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@@ -173,7 +173,7 @@ export default {
|
||||
name: "PurchaseOrderList",
|
||||
data() {
|
||||
return {
|
||||
// 采购单列表数据
|
||||
// 出库单列表数据
|
||||
TaskList: [],
|
||||
// 详情数据
|
||||
warehouseTaskList: [],
|
||||
@@ -219,7 +219,7 @@ export default {
|
||||
this.getList();
|
||||
},
|
||||
|
||||
/** 查询采购单列表 */
|
||||
/** 查询出库单列表 */
|
||||
getList() {
|
||||
// 显示加载状态
|
||||
this.loading = true;
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
563
pages/workbench/workflow/apply/apply.vue
Normal file
563
pages/workbench/workflow/apply/apply.vue
Normal file
@@ -0,0 +1,563 @@
|
||||
<template>
|
||||
<view class="app-container">
|
||||
<!-- 流程列表 -->
|
||||
<view class="list-container" v-if="ownProcessList.length > 0">
|
||||
<view
|
||||
v-for="(item, index) in ownProcessList"
|
||||
:key="index"
|
||||
class="list-item"
|
||||
>
|
||||
<!-- 1. 基础信息区 -->
|
||||
<view class="base-info">
|
||||
<view class="base-info__title">
|
||||
<text class="label">流程标题:</text>
|
||||
<text class="value">{{ (item.procVars) || '无标题' }}</text>
|
||||
</view>
|
||||
<view class="base-info__other">
|
||||
<view class="other-item">
|
||||
<text class="label">流程名称:</text>
|
||||
<text class="value">{{ item.procDefName || '未知' }}</text>
|
||||
</view>
|
||||
<view class="other-item">
|
||||
<text class="label">版本:</text>
|
||||
<view class="version-tag">v{{ item.procDefVersion || 1 }}</view>
|
||||
<text class="sort">{{ item.sort || '' }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 2. 状态信息区 -->
|
||||
<view class="status-info">
|
||||
<view class="status-item">
|
||||
<text class="label">当前节点:</text>
|
||||
<text class="value">{{ item.taskName || '无' }}</text>
|
||||
</view>
|
||||
<view class="status-item">
|
||||
<text class="label">提交时间:</text>
|
||||
<text class="value">{{ item.createTime || '未知' }}</text>
|
||||
</view>
|
||||
<view class="status-item">
|
||||
<text class="label">流程状态:</text>
|
||||
<view
|
||||
class="status-tag"
|
||||
:class="getStatusTagClass(item.processStatus)"
|
||||
>
|
||||
{{ getStatusText(item.processStatus) }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="status-item">
|
||||
<text class="label">耗时:</text>
|
||||
<text class="value">{{ item.duration || '0' }}</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 3. 操作按钮区 -->
|
||||
<view class="action-buttons">
|
||||
<button
|
||||
class="action-btn"
|
||||
@click="handleFlowRecord(item)"
|
||||
>
|
||||
详情
|
||||
</button>
|
||||
<button
|
||||
class="action-btn delete-btn"
|
||||
@click="handleDelete(item)"
|
||||
v-if="item.finishTime"
|
||||
>
|
||||
删除
|
||||
</button>
|
||||
<button
|
||||
class="action-btn cancel-btn"
|
||||
@click="handleStop(item)"
|
||||
v-else
|
||||
>
|
||||
取消
|
||||
</button>
|
||||
<!-- <button
|
||||
class="action-btn restart-btn"
|
||||
@click="handleAgain(item)"
|
||||
>
|
||||
重新发起
|
||||
</button> -->
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 空数据提示 -->
|
||||
<view class="empty-tip" v-if="!loading && ownProcessList.length === 0">
|
||||
<view class="empty-icon">
|
||||
<text class="icon">📦</text>
|
||||
</view>
|
||||
<text class="empty-text">暂无流程数据</text>
|
||||
</view>
|
||||
|
||||
<!-- 分页控件(原生实现) -->
|
||||
<view class="pagination" v-if="total > queryParams.pageSize">
|
||||
<button
|
||||
class="page-btn"
|
||||
@click="prevPage"
|
||||
:disabled="queryParams.pageNum <= 1"
|
||||
>
|
||||
上一页
|
||||
</button>
|
||||
<view class="page-info">
|
||||
第 {{ queryParams.pageNum }} / {{ totalPages }} 页
|
||||
</view>
|
||||
<button
|
||||
class="page-btn"
|
||||
@click="nextPage"
|
||||
:disabled="queryParams.pageNum >= totalPages"
|
||||
>
|
||||
下一页
|
||||
</button>
|
||||
</view>
|
||||
|
||||
<uni-fab ref="fab" horizontal="right" vertical="bottom"
|
||||
direction="horizontal" @fabClick="fabClick" />
|
||||
|
||||
<uni-popup ref="startpopup">
|
||||
<view class="" style="background-color: white; display: flex; flex-wrap: wrap; gap: 3px; justify-content: space-evenly; padding: 20rpx;">
|
||||
<view v-for="item in applyCategory" @click="jumpStart(item)" style="background-color: gainsboro; padding: 20rpx;">
|
||||
{{ item.label }}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</uni-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { delProcess, listOwnProcess, stopProcess } from '@/api/oa/workflow/process';
|
||||
|
||||
const applyCategory = [
|
||||
{
|
||||
label: '用印申请',
|
||||
name: 'seal',
|
||||
path: '/workflow/process/start',
|
||||
params: {
|
||||
deploymentId: '743bf626-355e-11f0-b7d7-fa163e1573b1'
|
||||
},
|
||||
query: {
|
||||
definitionId: 'Process_1741171051790%3A2%3A74715e09-355e-11f0-b7d7-fa163e1573b1'
|
||||
}
|
||||
},
|
||||
// {
|
||||
// label: '拨款申请',
|
||||
// name: 'money',
|
||||
// path: '/money/addMoney'
|
||||
// },
|
||||
// {
|
||||
// label: '报销申请',
|
||||
// name: 'claim',
|
||||
// path: '/claim/addTripClaim'
|
||||
// },
|
||||
{
|
||||
label: '请假申请',
|
||||
name: 'absence',
|
||||
path: '/workflow/process/start',
|
||||
params: {
|
||||
deploymentId: 'f16f31cf-9215-11f0-9545-d8f3bc6f4151'
|
||||
},
|
||||
query: {
|
||||
definitionId: 'Process_1741158926906%3A10%3Af1d17612-9215-11f0-9545-d8f3bc6f4151'
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '差旅申请',
|
||||
name: 'trip',
|
||||
path: '/workflow/process/start',
|
||||
params: {
|
||||
deploymentId: 'd7b3b7c2-355f-11f0-b7d7-fa163e1573b1'
|
||||
},
|
||||
query: {
|
||||
definitionId: 'Process_1741509148283%3A2%3Ad7ba4775-355f-11f0-b7d7-fa163e1573b1'
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '招待申请',
|
||||
name: 'entertain',
|
||||
path: '/workflow/process/start',
|
||||
params: {
|
||||
deploymentId: '81c87a72-355f-11f0-b7d7-fa163e1573b1'
|
||||
},
|
||||
query: {
|
||||
definitionId: 'Process_1741172554061%3A3%3A81d60f05-355f-11f0-b7d7-fa163e1573b1'
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '其他申请',
|
||||
name: 'other',
|
||||
path: '/workflow/process/start',
|
||||
params: {
|
||||
deploymentId: '003a0422-3560-11f0-b7d7-fa163e1573b1'
|
||||
},
|
||||
query: {
|
||||
definitionId: 'Process_1741172337682%3A4%3A00454ec5-3560-11f0-b7d7-fa163e1573b1'
|
||||
}
|
||||
}
|
||||
]
|
||||
|
||||
export default {
|
||||
name: "OwnProcessList",
|
||||
data() {
|
||||
return {
|
||||
loading: false, // 加载状态(使用API控制,不依赖组件)
|
||||
ownProcessList: [],
|
||||
total: 0,
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
processKey: undefined,
|
||||
processName: undefined,
|
||||
category: undefined,
|
||||
description: undefined
|
||||
},
|
||||
dateRange: [],
|
||||
applyCategory
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
// 计算总页数
|
||||
totalPages() {
|
||||
return Math.ceil(this.total / this.queryParams.pageSize) || 1;
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 获取列表数据(使用原生加载提示) */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
// 显示原生加载提示
|
||||
uni.showLoading({
|
||||
title: '加载中...',
|
||||
mask: true
|
||||
});
|
||||
|
||||
const params = this.addDateRange({ ...this.queryParams }, this.dateRange);
|
||||
|
||||
listOwnProcess(params)
|
||||
.then(response => {
|
||||
this.ownProcessList = response.rows || [];
|
||||
this.total = response.total || 0;
|
||||
})
|
||||
.catch(err => {
|
||||
console.error('获取流程列表失败:', err);
|
||||
uni.showToast({ title: '加载失败', icon: 'none', duration: 2000 });
|
||||
})
|
||||
.finally(() => {
|
||||
this.loading = false;
|
||||
// 关闭原生加载提示
|
||||
uni.hideLoading();
|
||||
});
|
||||
},
|
||||
|
||||
fabClick() {
|
||||
this.$refs.startpopup.open('bottom')
|
||||
},
|
||||
|
||||
/** 日期范围处理 */
|
||||
addDateRange(params, dateRange) {
|
||||
const result = { ...params };
|
||||
if (Array.isArray(dateRange) && dateRange.length === 2) {
|
||||
result.beginTime = dateRange[0];
|
||||
result.endTime = dateRange[1];
|
||||
}
|
||||
return result;
|
||||
},
|
||||
|
||||
/** 上一页 */
|
||||
prevPage() {
|
||||
if (this.queryParams.pageNum > 1) {
|
||||
this.queryParams.pageNum--;
|
||||
this.getList();
|
||||
}
|
||||
},
|
||||
|
||||
/** 下一页 */
|
||||
nextPage() {
|
||||
if (this.queryParams.pageNum < this.totalPages) {
|
||||
this.queryParams.pageNum++;
|
||||
this.getList();
|
||||
}
|
||||
},
|
||||
|
||||
/** 详情跳转 */
|
||||
handleFlowRecord(row) {
|
||||
console.log(row);
|
||||
const definitionId = row.procDefId;
|
||||
const deploymentId = row.deployId;
|
||||
uni.navigateTo({
|
||||
url: `/pages/workbench/workflow/detail/detail?definitionId=${definitionId}&deployId=${deploymentId}&processed=false`
|
||||
});
|
||||
},
|
||||
|
||||
/** 删除流程 */
|
||||
handleDelete(row) {
|
||||
const procInsId = row.procInsId;
|
||||
uni.showModal({
|
||||
title: '警告',
|
||||
content: `是否确认删除流程编号为"${procInsId}"的数据?`,
|
||||
confirmText: '确定',
|
||||
cancelText: '取消',
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
delProcess(procInsId)
|
||||
.then(() => {
|
||||
uni.showToast({ title: '删除成功', duration: 1500 });
|
||||
this.getList();
|
||||
})
|
||||
.catch(err => {
|
||||
console.error('删除失败:', err);
|
||||
uni.showToast({ title: '删除失败', icon: 'none' });
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
/** 取消流程 */
|
||||
handleStop(row) {
|
||||
const params = { procInsId: row.procInsId };
|
||||
stopProcess(params)
|
||||
.then(response => {
|
||||
uni.showToast({ title: response.msg || '取消成功', duration: 1500 });
|
||||
this.getList();
|
||||
})
|
||||
.catch(err => {
|
||||
console.error('取消失败:', err);
|
||||
uni.showToast({ title: '取消失败', icon: 'none' });
|
||||
});
|
||||
},
|
||||
|
||||
/** 重新发起 */
|
||||
handleAgain(row) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/workflow/process/start/${row.deployId}?definitionId=${row.procDefId}&procInsId=${row.procInsId}`
|
||||
});
|
||||
},
|
||||
|
||||
jumpStart(row) {
|
||||
const definitionId = row.query.definitionId;
|
||||
const deploymentId = row.params.deploymentId;
|
||||
uni.navigateTo({
|
||||
url: `/pages/workbench/workflow/start/start?definitionId=${definitionId}&deployId=${deploymentId}&processed=false`
|
||||
});
|
||||
},
|
||||
|
||||
/** 状态标签样式(原生实现,替代uni-tag) */
|
||||
getStatusTagClass(status) {
|
||||
switch (status) {
|
||||
case 1: return 'status-tag--primary'; // 运行中
|
||||
case 2: return 'status-tag--success'; // 已完成
|
||||
case 3: return 'status-tag--danger'; // 已取消
|
||||
default: return 'status-tag--info'; // 未知
|
||||
}
|
||||
},
|
||||
|
||||
/** 状态文本 */
|
||||
getStatusText(status) {
|
||||
switch (status) {
|
||||
case 1: return '运行中';
|
||||
case 2: return '已完成';
|
||||
case 3: return '已取消';
|
||||
default: return '未知状态';
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.app-container {
|
||||
padding: 16rpx;
|
||||
background-color: #f5f5f5;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
/* 列表容器 */
|
||||
.list-container {
|
||||
background-color: #fff;
|
||||
border-radius: 16rpx;
|
||||
overflow: hidden;
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
|
||||
/* 列表项 */
|
||||
.list-item {
|
||||
padding: 20rpx;
|
||||
border-bottom: 1rpx solid #eee;
|
||||
}
|
||||
|
||||
.list-item:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
/* 基础信息区 */
|
||||
.base-info {
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.base-info__title {
|
||||
font-size: 32rpx;
|
||||
font-weight: 500;
|
||||
margin-bottom: 10rpx;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.base-info__other {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 20rpx;
|
||||
font-size: 28rpx;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.other-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8rpx;
|
||||
}
|
||||
|
||||
/* 版本标签(原生实现) */
|
||||
.version-tag {
|
||||
background-color: #e8f3ff;
|
||||
color: #1677ff;
|
||||
padding: 2rpx 10rpx;
|
||||
border-radius: 4rpx;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.sort {
|
||||
margin-left: 8rpx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
/* 状态信息区 */
|
||||
.status-info {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 20rpx;
|
||||
font-size: 28rpx;
|
||||
color: #666;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.status-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8rpx;
|
||||
}
|
||||
|
||||
/* 状态标签(原生实现) */
|
||||
.status-tag {
|
||||
padding: 2rpx 10rpx;
|
||||
border-radius: 4rpx;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.status-tag--primary {
|
||||
background-color: #e8f3ff;
|
||||
color: #1677ff;
|
||||
}
|
||||
|
||||
.status-tag--success {
|
||||
background-color: #f0fff4;
|
||||
color: #00b42a;
|
||||
}
|
||||
|
||||
.status-tag--danger {
|
||||
background-color: #fff1f0;
|
||||
color: #f53f3f;
|
||||
}
|
||||
|
||||
.status-tag--info {
|
||||
background-color: #f2f3f5;
|
||||
color: #86909c;
|
||||
}
|
||||
|
||||
/* 操作按钮区 */
|
||||
.action-buttons {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 16rpx;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.action-btn {
|
||||
padding: 8rpx 20rpx;
|
||||
font-size: 26rpx;
|
||||
border: none;
|
||||
background: transparent;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.delete-btn {
|
||||
color: #f53f3f;
|
||||
}
|
||||
|
||||
.cancel-btn {
|
||||
color: #faad14;
|
||||
}
|
||||
|
||||
.restart-btn {
|
||||
color: #1677ff;
|
||||
}
|
||||
|
||||
/* 空数据提示 */
|
||||
.empty-tip {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 400rpx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.empty-icon {
|
||||
font-size: 80rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.empty-text {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
/* 分页控件 */
|
||||
.pagination {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 30rpx;
|
||||
padding: 30rpx 0;
|
||||
}
|
||||
|
||||
.page-btn {
|
||||
padding: 12rpx 30rpx;
|
||||
background-color: #fff;
|
||||
border: 1rpx solid #eee;
|
||||
border-radius: 6rpx;
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.page-btn:disabled {
|
||||
color: #ccc;
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
.page-info {
|
||||
font-size: 28rpx;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
/* 通用样式 */
|
||||
.label {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.value {
|
||||
color: #333;
|
||||
}
|
||||
</style>
|
||||
22
pages/workbench/workflow/detail/detail.vue
Normal file
22
pages/workbench/workflow/detail/detail.vue
Normal file
@@ -0,0 +1,22 @@
|
||||
<template>
|
||||
<view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
22
pages/workbench/workflow/finished/finished.vue
Normal file
22
pages/workbench/workflow/finished/finished.vue
Normal file
@@ -0,0 +1,22 @@
|
||||
<template>
|
||||
<view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
33
pages/workbench/workflow/start/start.vue
Normal file
33
pages/workbench/workflow/start/start.vue
Normal file
@@ -0,0 +1,33 @@
|
||||
<template>
|
||||
<view style="padding: 20rpx;">
|
||||
<oa-schema-form :formConf="formData" @finish="handleFinish"></oa-schema-form>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getProcessForm, startProcess } from '@/api/oa/workflow/process'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
formData: {}
|
||||
}
|
||||
},
|
||||
onLoad(config) {
|
||||
console.log(config)
|
||||
getProcessForm(config).then(res => {
|
||||
console.log(res)
|
||||
this.formData = res.data
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
handleFinish(data) {
|
||||
console.log(data)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
22
pages/workbench/workflow/todo/todo.vue
Normal file
22
pages/workbench/workflow/todo/todo.vue
Normal file
@@ -0,0 +1,22 @@
|
||||
<template>
|
||||
<view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
Reference in New Issue
Block a user