@@ -11,7 +11,13 @@ | |||
<div class="storage-body" style="height: 120px; display: flex"> | |||
<div class="storage-box__bg" style="height: 100%; width: 48px; margin-right: 12px; border-radius: 4px; overflow: hidden"> | |||
<div class="storage-box__inner" style="position: absolute; bottom: 0; left: 0; height: 65%; width: 100%" :style="{ background: color }"></div> | |||
<div | |||
class="storage-box__inner" | |||
style="position: absolute; bottom: 0; left: 0; height: 0; width: 100%; font-size: 1.125rem; text-align: center;" | |||
:style="{ background: color, height: computedRatio + '%', color: computedRatio > 20 ? 'white' : '#ccc' }" | |||
> | |||
<span style="height: 100%; display: flex; flex-direction: column; justify-content: flex-end;">{{ computedRatio + '%' }}</span> | |||
</div> | |||
</div> | |||
<div style="display: flex; flex-direction: column; min-width: 128px; justify-content: space-between"> | |||
@@ -56,8 +62,12 @@ export default { | |||
}, | |||
unitValue: { | |||
type: String, | |||
default: null | |||
} | |||
default: null, | |||
}, | |||
ratio: { | |||
type: Number, | |||
default: 0.0, | |||
}, | |||
}, | |||
data() { | |||
return { | |||
@@ -66,9 +76,12 @@ export default { | |||
}, | |||
computed: { | |||
computedUnit() { | |||
if (!this.unitValue) return '存量' | |||
return this.unitList(this.unitValue)+' 存量' | |||
if (!this.unitValue) return "存量"; | |||
return this.unitList(this.unitValue) + " 存量"; | |||
}, | |||
computedRatio() { | |||
return this.ratio ? this.ratio.toFixed(2) * 100 : 0 | |||
} | |||
}, | |||
created() {}, | |||
mounted() {}, | |||
@@ -7,8 +7,8 @@ | |||
<section class="container-content"> | |||
<div class="dialy-storage" v-if="dailyStorage.length"> | |||
<h3 | |||
class="" | |||
style=" | |||
class="" | |||
style=" | |||
position: relative; | |||
background: #eeee; | |||
color: #666; | |||
@@ -31,11 +31,12 @@ | |||
:material="st.material ?? '默认物料'" | |||
:total="2" | |||
:unit-value="st.unitDictValue" | |||
/> | |||
</div> | |||
:ratio="st.ratio" | |||
/> | |||
</div> | |||
<div class="middle-storage" v-if="middleStorage.length"> | |||
<h3 | |||
</div> | |||
<div class="middle-storage" v-if="middleStorage.length"> | |||
<h3 | |||
class="" | |||
style=" | |||
position: relative; | |||
@@ -46,9 +47,9 @@ | |||
padding-left: 16px; | |||
top: 10px; | |||
left: -16px; | |||
" | |||
" | |||
> | |||
中间仓 | |||
中间仓 | |||
</h3> | |||
<div class="middle-list" style="padding: 12px 0; display: flex; flex-wrap: wrap"> | |||
<storage-box | |||
@@ -60,11 +61,12 @@ | |||
:material="st.material ?? '默认物料'" | |||
:total="2" | |||
:unit-value="st.unitDictValue" | |||
/> | |||
</div> | |||
:ratio="st.ratio" | |||
/> | |||
</div> | |||
<div class="unknown-storage" v-if="unknownStorage.length"> | |||
<h3 | |||
</div> | |||
<div class="unknown-storage" v-if="unknownStorage.length"> | |||
<h3 | |||
class="" | |||
style=" | |||
position: relative; | |||
@@ -75,20 +77,21 @@ | |||
padding-left: 16px; | |||
top: 10px; | |||
left: -16px; | |||
" | |||
" | |||
> | |||
未知仓 | |||
</h3> | |||
<div class="unknown-list" style="padding: 12px 0; display: flex; flex-wrap: wrap"> | |||
<storage-box | |||
v-for="(st, index) in unknownStorage" | |||
:key="index" | |||
未知仓 | |||
</h3> | |||
<div class="unknown-list" style="padding: 12px 0; display: flex; flex-wrap: wrap"> | |||
<storage-box | |||
v-for="(st, index) in unknownStorage" | |||
:key="index" | |||
:qty="st.qty ?? 0" | |||
color="#3388ff" | |||
:storage="st.name" | |||
:material="st.material ?? '默认物料'" | |||
:total="2" | |||
:unit-value="st.unitDictValue" | |||
:ratio="st.ratio" | |||
/> | |||
</div> | |||
</div> | |||
@@ -69,7 +69,7 @@ export default function () { | |||
const dialogConfigs = { | |||
extraIds: { wsId: 4 }, // 工艺管理里面的相关模块的 dialogWithMenu 需要额外的工序 id | |||
menu: [{ name: "压制工艺", key: 'info' }, { name: "工艺参数", key: 'attr', onlyEditMode: true }], | |||
menu: [{ name: "检测工艺", key: 'info' }, { name: "工艺参数", key: 'attr', onlyEditMode: true }], | |||
form: { | |||
rows: [ | |||
[ | |||