|
|
@@ -17,67 +17,68 @@
|
|
|
<view><text class="left">备注</text><text class="right">花束</text></view>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <view class="operate-area">
|
|
|
- <view>花材</view>
|
|
|
- <view>成品</view>
|
|
|
- </view>
|
|
|
<view class="work-item-detail">
|
|
|
|
|
|
<view class="flex-space right-detail-title"> 单位用材 </view>
|
|
|
- <view class="module-com content-box">
|
|
|
- <view class="commodity-view">
|
|
|
- <view class="commodity-list">
|
|
|
- <view v-for="(s, idx) in detailInfo.product" :key="idx" class="commodity-item" >
|
|
|
- <image class="item-icon" :src="s.cover" @click="pageTo({url:'/admin/item/detail',query:{id: s.id}})"></image>
|
|
|
- <view class="item-info">
|
|
|
- <view class="info-line">
|
|
|
- <text class="item-name">{{ s.name }}</text>
|
|
|
- <text class="item-price">
|
|
|
- <text class="unit">5扎</text>
|
|
|
- </text>
|
|
|
- </view>
|
|
|
- <view class="info-line">
|
|
|
- <text class="item-type">20支/扎</text>
|
|
|
- </view>
|
|
|
+
|
|
|
+ <view class="unit-use-item">
|
|
|
+ <view class="commodity-list">
|
|
|
+ <view v-for="(s, idx) in detailInfo.product" :key="idx" class="commodity-item" >
|
|
|
+ <image class="item-icon" :src="s.cover" @click="pageTo({url:'/admin/item/detail',query:{id: s.id}})"></image>
|
|
|
+ <view class="item-info">
|
|
|
+ <view class="info-line">
|
|
|
+ <text class="item-name">{{ s.name }}</text>
|
|
|
+ <text class="item-price">
|
|
|
+ <text class="unit">5扎</text>
|
|
|
+ </text>
|
|
|
+ </view>
|
|
|
+ <view class="info-line">
|
|
|
+ <text class="item-type">20支/扎</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <view class="summary-bar">
|
|
|
- <view class="operate-view" ></view>
|
|
|
- <view class="describe-view"><text>2扎</text> <text>3支</text></view>
|
|
|
- </view>
|
|
|
+ </view>
|
|
|
+ <view class="summary-bar">
|
|
|
+ <view class="operate-view" ></view>
|
|
|
+ <view class="describe-view"><text>2扎</text> <text>3支</text></view>
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
<view style="height:2vh;background-color:#EEEEEE;"></view>
|
|
|
|
|
|
- <view class="flex-space right-detail-title"> 总共用材 </view>
|
|
|
- <view class="module-com content-box">
|
|
|
- <view class="commodity-view">
|
|
|
- <view class="commodity-list">
|
|
|
- <view v-for="(s, idx) in detailInfo.product" :key="idx" class="commodity-item" >
|
|
|
- <image class="item-icon" :src="s.cover" @click="pageTo({url:'/admin/item/detail',query:{id: s.id}})" />
|
|
|
- <view class="item-info">
|
|
|
- <view class="info-line">
|
|
|
- <text class="item-name">{{ s.name }}</text>
|
|
|
- <text class="item-price">
|
|
|
- <text class="unit">5扎</text>
|
|
|
- </text>
|
|
|
- </view>
|
|
|
- <view class="info-line">
|
|
|
- <text class="item-type">20支/扎</text>
|
|
|
- </view>
|
|
|
+ <view class="flex-space right-detail-title"> 累计用材 </view>
|
|
|
+
|
|
|
+ <view class="total-use-item">
|
|
|
+ <view class="commodity-list">
|
|
|
+ <view v-for="(s, idx) in detailInfo.product" :key="idx" class="commodity-item" >
|
|
|
+ <image class="item-icon" :src="s.cover" @click="pageTo({url:'/admin/item/detail',query:{id: s.id}})" />
|
|
|
+ <view class="item-info">
|
|
|
+ <view class="info-line">
|
|
|
+ <text class="item-name">{{ s.name }}</text>
|
|
|
+ <text class="item-price">
|
|
|
+ <text class="unit">5扎</text>
|
|
|
+ </text>
|
|
|
+ </view>
|
|
|
+ <view class="info-line">
|
|
|
+ <text class="item-type">20支/扎</text>
|
|
|
+ <button class="wastage">报损</button>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <view class="summary-bar">
|
|
|
- <view class="operate-view" ></view>
|
|
|
- <view class="describe-view"><text>2扎</text> <text>3支</text></view>
|
|
|
- </view>
|
|
|
+ </view>
|
|
|
+ <view class="summary-bar">
|
|
|
+ <view class="operate-view" ></view>
|
|
|
+ <view class="describe-view"><text>2扎</text> <text>3支</text></view>
|
|
|
</view>
|
|
|
</view>
|
|
|
+ </view>
|
|
|
|
|
|
+ <view class="operate-area">
|
|
|
+ <view>修改</view>
|
|
|
+ <view>提交</view>
|
|
|
+ <view>打印</view>
|
|
|
</view>
|
|
|
+
|
|
|
</view>
|
|
|
</template>
|
|
|
<script>
|
|
|
@@ -96,7 +97,6 @@ export default {
|
|
|
height: 100%;
|
|
|
& .work-detail{
|
|
|
flex: 40;
|
|
|
- border-right:1upx solid #EEEEEE;
|
|
|
.order-title{
|
|
|
font-size:11upx;
|
|
|
font-weight:bold;
|
|
|
@@ -109,6 +109,7 @@ export default {
|
|
|
image{
|
|
|
width:180upx;
|
|
|
height:180upx;
|
|
|
+ border-radius:3upx;
|
|
|
}
|
|
|
}
|
|
|
.order-item{
|
|
|
@@ -139,7 +140,9 @@ export default {
|
|
|
height: 100vh;
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
+ justify-content: space-around;
|
|
|
padding: 5upx;
|
|
|
+ border-left:1upx solid #EEEEEE;
|
|
|
& > view {
|
|
|
border: 1upx solid #EEEEEE;
|
|
|
border-radius: 5upx;
|
|
|
@@ -166,7 +169,7 @@ export default {
|
|
|
margin-left:5upx;
|
|
|
margin-top:5upx;
|
|
|
}
|
|
|
- & .commodity-view {
|
|
|
+ & .unit-use-item {
|
|
|
flex: 40;
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
@@ -177,19 +180,20 @@ export default {
|
|
|
margin-top:5upx;
|
|
|
.item-icon {
|
|
|
flex-shrink: 0;
|
|
|
- width: 35upx;
|
|
|
- height: 35upx;
|
|
|
+ width: 38upx;
|
|
|
+ height: 38upx;
|
|
|
+ border-radius:2upx;
|
|
|
}
|
|
|
.item-info {
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
- justify-content: center;
|
|
|
flex: 1;
|
|
|
margin-left:6upx;
|
|
|
.info-line {
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
align-items: flex-start;
|
|
|
+ position: relative;
|
|
|
.item-name {
|
|
|
font-size:11upx;
|
|
|
color: black;
|
|
|
@@ -238,7 +242,86 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+ & .total-use-item {
|
|
|
+ flex: 40;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ .commodity-list {
|
|
|
+ padding: 5upx;
|
|
|
+ .commodity-item {
|
|
|
+ display: flex;
|
|
|
+ margin-top:5upx;
|
|
|
+ .item-icon {
|
|
|
+ flex-shrink: 0;
|
|
|
+ width: 38upx;
|
|
|
+ height: 38upx;
|
|
|
+ border-radius:2upx;
|
|
|
+ }
|
|
|
+ .item-info {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ flex: 1;
|
|
|
+ margin-left:6upx;
|
|
|
+ .info-line {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: flex-start;
|
|
|
+ position: relative;
|
|
|
+ .item-name {
|
|
|
+ font-size:11upx;
|
|
|
+ color: black;
|
|
|
+ overflow: hidden;
|
|
|
+ white-space: nowrap;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ }
|
|
|
+ .item-price {
|
|
|
+ color: #333;
|
|
|
+ font-size: 10upx;
|
|
|
+ }
|
|
|
+ .item-type {
|
|
|
+ color: #999;
|
|
|
+ font-size: 8upx;
|
|
|
+ }
|
|
|
+ .item-count {
|
|
|
+ color: #666;
|
|
|
+ font-size: 11upx;
|
|
|
+ }
|
|
|
+ .wastage{
|
|
|
+ position: absolute;
|
|
|
+ right:0upx;
|
|
|
+ font-size:9upx;
|
|
|
+ top:4upx;
|
|
|
+ color:#666666;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .summary-bar {
|
|
|
+ padding: 0 10upx;
|
|
|
+ height: 30upx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ border-top: 1upx solid #eeeeee;
|
|
|
+ .operate-view {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ color: #3385ff;
|
|
|
+ font-size: 12upx;
|
|
|
+ .iconfont {
|
|
|
+ margin-right: 20upx;
|
|
|
+ font-size: 10upx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .describe-view {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ color: #333;
|
|
|
+ font-size: 9upx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
</style>
|