|
@@ -1,15 +1,15 @@
|
|
|
<template>
|
|
|
- <div class="operate">
|
|
|
+ <!-- <div class="operate">
|
|
|
<div class="describeText operateText">{{ title }}</div>
|
|
|
- <div class="operateBox">
|
|
|
- <div class="leftBox">
|
|
|
- <svg-icon :icon-class="jiaDisabled ? 'bujian' : 'jian'" class="svgStyle" size="25"
|
|
|
- @click="value = value - step" />
|
|
|
- </div>
|
|
|
- <el-input v-model="value" :disabled="jiaDisabled" :max="max" :min="min" class="showSum" />
|
|
|
- <div class="rightBox">
|
|
|
- <svg-icon :icon-class="jiaDisabled ? 'bujia' : 'jia'" class="svgStyle" size="25" @click="value = value + step" />
|
|
|
- </div>
|
|
|
+
|
|
|
+ </div> -->
|
|
|
+ <div class="operateBox">
|
|
|
+ <div class="leftBox">
|
|
|
+ <svg-icon :icon-class="jiaDisabled ? 'bujian' : 'jian'" class="svgStyle" size="25" @click="value = value - step" />
|
|
|
+ </div>
|
|
|
+ <el-input v-model="value" :disabled="jiaDisabled" :max="max" :min="min" class="showSum" />
|
|
|
+ <div class="rightBox">
|
|
|
+ <svg-icon :icon-class="jiaDisabled ? 'bujia' : 'jia'" class="svgStyle" size="25" @click="value = value + step" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
@@ -32,10 +32,6 @@ const props = defineProps({
|
|
|
type: Number,
|
|
|
default: 1,
|
|
|
},
|
|
|
- title: {
|
|
|
- type: String,
|
|
|
- default: "实际值",
|
|
|
- },
|
|
|
});
|
|
|
|
|
|
const emits = defineEmits(["update:modelValue"]);
|
|
@@ -68,12 +64,14 @@ const value = computed({
|
|
|
font-weight: bold;
|
|
|
font-size: $f38;
|
|
|
color: black;
|
|
|
+ background-color: rgba(255, 255, 255, 0);
|
|
|
}
|
|
|
|
|
|
:deep(.el-input__wrapper) {
|
|
|
border: none !important;
|
|
|
outline: none;
|
|
|
box-shadow: none;
|
|
|
+ background-color: rgba(255, 255, 255, 0);
|
|
|
}
|
|
|
|
|
|
.describeText {
|
|
@@ -119,4 +117,35 @@ const value = computed({
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+.operateBox {
|
|
|
+ width: 290px;
|
|
|
+ height: 70px;
|
|
|
+ border: 2px solid black;
|
|
|
+ border-radius: 16px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+
|
|
|
+ .leftBox {
|
|
|
+ width: 70px;
|
|
|
+ height: 70px;
|
|
|
+ @include flex;
|
|
|
+ }
|
|
|
+
|
|
|
+ .showSum {
|
|
|
+ flex: 1;
|
|
|
+ @include flex;
|
|
|
+ border: 2px solid black;
|
|
|
+ border-top: 0px;
|
|
|
+ border-bottom: 0px;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: $f38;
|
|
|
+ }
|
|
|
+
|
|
|
+ .rightBox {
|
|
|
+ width: 70px;
|
|
|
+ height: 70px;
|
|
|
+ @include flex;
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|