From 1519870c0e18171ced014a840e86a459dc6b00f1 Mon Sep 17 00:00:00 2001
From: yangfeng <wanwan926_4@163.com>
Date: 星期二, 12 十二月 2023 17:26:06 +0800
Subject: [PATCH] 报工记录列表增加人员姓名
---
src/views/dashboard/components/MaterialDetails.vue | 85 +++++++++++++++++++++++++++---------------
1 files changed, 54 insertions(+), 31 deletions(-)
diff --git a/src/views/dashboard/components/MaterialDetails.vue b/src/views/dashboard/components/MaterialDetails.vue
index 9801f76..0077c34 100644
--- a/src/views/dashboard/components/MaterialDetails.vue
+++ b/src/views/dashboard/components/MaterialDetails.vue
@@ -3,36 +3,42 @@
<BaseModal v-model="modelData" :wider="true" @close="closeModal">
<template #title>鐗╂枡璇︽儏 </template>
<div class="details-box">
- <div class="details-t">
- <div class="details-t-t">{{ materialObj.form.materialId }}</div>
+ <div v-if="material" class="details-t">
+ <div class="details-t-t">{{ material.materialId }}</div>
<div class="details-t-b">
<div class="details-t-b-l">
- <div class="item">鐗╂枡鍚嶇О锛歿{ materialObj.form.materialName }}</div>
- <div class="item">鏁伴噺锛歿{ materialObj.form.amount }}</div>
- <div class="item">鐗╂枡瑙勬牸锛歿{ materialObj.form.amount }}</div>
- <div class="item">鐗╂枡绫诲瀷锛歿{ materialObj.form.amount }}</div>
+ <div class="item">鐗╂枡鍚嶇О锛歿{ material.materialName }}</div>
+ <div class="item">鏁伴噺锛歿{ material.amount }}</div>
+ <div class="item">鐗╂枡瑙勬牸锛歿{ material.amount }}</div>
+ <div class="item">鐗╂枡绫诲瀷锛歿{ material.amount }}</div>
</div>
- <BigButton class="btn" bg-color="#03d203f0">宸查�佽揪</BigButton>
+ <!-- TODO: 鐗╂枡閫佽揪缂烘帴鍙�-->
+ <BigButton v-if="false" class="btn" bg-color="#03d203f0">宸查�佽揪</BigButton>
</div>
</div>
- <div class="details-b">
- <el-scrollbar always class="scroller">
- <div class="details-b-t">杩愯緭璇︽儏</div>
- <div class="details-b-b">
+
+ <!-- TODO: 鐗╂枡閫佽揪缂烘帴鍙�-->
+ <div v-if="false" class="details-b">
+ <div class="details-b-t">杩愯緭璇︽儏</div>
+
+ <div class="details-b-b">
+ <el-scrollbar always class="scroller">
<el-steps finish-status="success" class="steps" direction="vertical">
<el-step v-for="(item, index) in materialObj.materialFlow" :key="index" icon="">
<template #title>
{{ item.label }}
</template>
<template #description>
- {{ item.date }}
- {{ item.name }}
- {{ item.deviceName }}
+ <div class="details-date">{{ item.date }}</div>
+ <div class="details-name">
+ {{ item.name }}
+ <span>{{ item.deviceName }}</span>
+ </div>
</template>
</el-step>
</el-steps>
- </div>
- </el-scrollbar>
+ </el-scrollbar>
+ </div>
</div>
</div>
</BaseModal>
@@ -41,11 +47,13 @@
<script setup lang="ts">
import { useVModel } from '@vueuse/core'
import BigButton from '@/views/dashboard/components/BigButton.vue'
-import { ref } from 'vue'
+import type { Material } from '@/api/task'
export interface MaterialDetailsProps {
+ material?: Material
modelValue: boolean
}
const props = withDefaults(defineProps<MaterialDetailsProps>(), {
+ material: undefined,
modelValue: false
})
const emit = defineEmits<{
@@ -56,14 +64,8 @@
function closeModal() {
modelData.value = false
}
+// 鍋囨暟鎹�
const materialObj = {
- form: {
- materialId: '1111',
- materialName: '杈撳叆鍚嶇О',
- amount: 10,
- unit: '涓�',
- date: 10
- },
materialFlow: [
{
label: '宸查�佽揪',
@@ -94,7 +96,7 @@
</script>
<style scoped lang="scss">
$status-default: #03d203f0;
-$status-running: #f76c0f;
+$status-running: #33ccff;
$status-ready: #13235a;
$status-done: #0dfde6;
.details-box {
@@ -145,12 +147,12 @@
line-height: 30px;
height: 30px;
width: 100%;
+ margin-bottom: 20px;
}
.details-b-b {
width: 100%;
- height: calc(100% - 30px);
- overflow-x: auto;
- margin-top: -5px;
+ height: calc(100% - 60px);
+ overflow-y: auto;
padding: 0 20px;
.steps {
height: 100%;
@@ -158,12 +160,33 @@
width: 16px;
height: 16px;
}
+ :deep(.el-step__icon.is-text) {
+ border-color: $status-running !important;
+ }
+ :deep(.el-step__icon-inner) {
+ display: none !important;
+ }
.el-step__title {
line-height: 25px;
- font-size: 14px;
+ font-size: 18px;
}
- .el-step__title.is-process {
- color: #a8abb2;
+ // .el-step__title.is-process {
+ // color: #a8abb2;
+ // }
+ }
+ .details-date {
+ color: #fff;
+ font-size: 14px;
+ line-height: 20px;
+ margin-top: 5px;
+ }
+ .details-name {
+ color: #fff;
+ font-size: 14px;
+ line-height: 20px;
+ margin: 10px 0 20px;
+ span {
+ margin-left: 15px;
}
}
}
--
Gitblit v1.8.0