From 18eb4308e941a265daba8eda2f2ee91115963a3c Mon Sep 17 00:00:00 2001
From: haoxuan <haoxuan>
Date: 星期四, 18 四月 2024 17:06:04 +0800
Subject: [PATCH] 1
---
src/views/dashboard/components/ProcessInfo.vue | 166 +++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 166 insertions(+), 0 deletions(-)
diff --git a/src/views/dashboard/components/ProcessInfo.vue b/src/views/dashboard/components/ProcessInfo.vue
new file mode 100644
index 0000000..92bb945
--- /dev/null
+++ b/src/views/dashboard/components/ProcessInfo.vue
@@ -0,0 +1,166 @@
+<template>
+ <div class="process-info">
+ <div class="item-l-bng">
+ <img src="~@/assets/images/process-model.png" />
+ </div>
+ <div class="item-r" @click="onDetailClick">
+ <div class="item-r-t font_weight">{{ craftModel.number }}</div>
+ <div class="item-r-b">浜у搧: {{ craftModel.product }}</div>
+ <div class="item-r-b">宸ヨ壓: {{ craftModel.procedure }}</div>
+ </div>
+ <div v-if="craftModel.isUpdate" class="tip-r">
+ <img src="~@/assets/images/process-tip.png" />
+ </div>
+ <div v-if="craftModel.number == task?.Procedure?.processModelNumber" class="tip-current">褰撳墠浣跨敤</div>
+ <div class="btn">
+ <!-- <el-button
+ type="primary"
+ :loading="loading"
+ :disabled="craftModel.isUpdate ? false : true"
+ @click="onUpdateClick"
+ >
+ 鏇存柊宸ヨ壓
+ </el-button> -->
+ </div>
+ </div>
+</template>
+<script setup lang="ts">
+import { toRefs, ref, watch } from 'vue'
+import { Loading } from '@element-plus/icons-vue'
+import type { CraftModel } from '@/api/craftModel'
+import type { Task } from '@/api/task'
+const props = defineProps<{
+ craftModel: CraftModel
+ activeArr: string[]
+ task?: Task
+}>()
+const { craftModel, task, activeArr } = toRefs(props)
+
+const emit = defineEmits<{
+ update: [craftModel: CraftModel]
+ detail: [craftModel: CraftModel]
+}>()
+const loading = ref(false)
+watch(activeArr.value, () => {
+ // 寮圭獥鏄剧ず鏃惰幏鍙栧伐鑹哄弬鏁�
+ if (activeArr.value) {
+ getLoading()
+ }
+})
+function getLoading() {
+ for (let i in activeArr.value) {
+ if (activeArr.value[i] == craftModel.value.number) {
+ loading.value = true
+ return true
+ }
+ }
+ loading.value = false
+}
+function onDetailClick() {
+ emit('detail', craftModel.value)
+}
+function onUpdateClick() {
+ if (loading.value) {
+ return true
+ }
+ emit('update', craftModel.value)
+}
+</script>
+
+<style scoped lang="scss">
+$status-running: #f76c0f;
+$status-done: #2c5dbb82;
+$status-ready: #00ff00f0;
+$status-disabled: #7b95d3;
+.font_weight {
+ font-weight: 600;
+}
+.process-info {
+ width: calc(50% - 10px);
+ height: 140px;
+ padding: 23px 5px 10px 10px;
+ background: $status-done;
+ border-radius: 8px;
+ //float: left;
+ overflow: hidden;
+ font-size: 15px;
+ position: relative;
+ margin-bottom: 30px;
+
+ &:nth-of-type(odd) {
+ margin-right: 20px;
+ }
+
+ .item-l-bng {
+ width: 40px;
+ float: left;
+ margin-right: 20px;
+
+ img {
+ width: 100%;
+ }
+ }
+ .refresh-top-icon {
+ display: flex;
+ align-items: center;
+ color: #fff;
+ }
+
+ .item-r {
+ width: calc(100% - 60px);
+ float: left;
+ line-height: 25px;
+ color: #fff;
+ font-size: 16px;
+ cursor: pointer;
+
+ .item-r-t {
+ font-size: 16px;
+ }
+
+ .item-r-b {
+ font-size: 14px;
+ }
+ }
+
+ .tip-r {
+ position: absolute;
+ top: 5px;
+ right: 15px;
+ width: 20px;
+
+ img {
+ width: 100%;
+ }
+ }
+
+ .tip-current {
+ background: $status-ready;
+ color: #fff;
+ position: absolute;
+ top: 0px;
+ left: 70px;
+ width: auto;
+ padding: 2px 15px;
+ font-size: 12px;
+ border-radius: 0px 0px 6px 6px;
+ }
+
+ .btn {
+ width: 95px;
+ position: absolute;
+ right: 15px;
+ bottom: 10px;
+ .el-button--primary {
+ background: $status-running;
+ border: 0 !important;
+ }
+ .el-button.is-disabled,
+ .el-button.is-disabled:focus,
+ .el-button.is-disabled:hover {
+ color: #fff !important;
+ background: $status-disabled;
+ }
+ }
+}
+</style>
--
Gitblit v1.8.0