|
|
@@ -1,372 +0,0 @@
|
|
|
-<template>
|
|
|
-<view>
|
|
|
- <view v-if="$util.isEmpty(orderInfo)"></view>
|
|
|
- <view class="work-info" v-else>
|
|
|
- <view class="work-detail">
|
|
|
- <view class="order-img">
|
|
|
- <image :src="orderInfo.cover"></image>
|
|
|
- </view>
|
|
|
- <view class="order-item">
|
|
|
- <view><text class="left">分类</text><text class="right">{{orderInfo.catName}}</text></view>
|
|
|
- <view><text class="left">名称</text><text class="right">{{orderInfo.name}}</text></view>
|
|
|
- <view><text class="left">数量</text><text class="right">{{orderInfo.num}}</text></view>
|
|
|
- <view><text class="left">商品编号</text><text class="right">{{orderInfo.goodsId}}</text></view>
|
|
|
- <view><text class="left">售价</text><text class="right">{{orderInfo.price||''}}</text></view>
|
|
|
- <view><text class="left">工单号</text><text class="right">{{orderInfo.workSn}}</text></view>
|
|
|
- <view><text class="left">订单号</text><text class="right">{{orderInfo.orderSn}}</text></view>
|
|
|
- <view><text class="left">状态</text><text class="right">{{getStatus(orderInfo.status)}}</text></view>
|
|
|
- <view><text class="left">备注</text><text class="right">{{orderInfo.remark}}</text></view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="work-item-detail">
|
|
|
-
|
|
|
- <view class="flex-space right-detail-title">单位用材</view>
|
|
|
-
|
|
|
- <view class="unit-use-item">
|
|
|
- <view class="commodity-list">
|
|
|
- <view v-for="(s, idx) in orderItem" :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>
|
|
|
- <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="total-use-item">
|
|
|
- <view class="commodity-list">
|
|
|
- <view v-for="(s, idx) in orderItem" :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>
|
|
|
- <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="button-area">
|
|
|
- <view @click="modifyItem(orderInfo)">修改</view>
|
|
|
- <view>取消</view>
|
|
|
- <view>锁定</view>
|
|
|
- <view class="active">完成</view>
|
|
|
- <view>打印</view>
|
|
|
- </view>
|
|
|
-
|
|
|
- </view>
|
|
|
-</view>
|
|
|
-</template>
|
|
|
-<script>
|
|
|
-import { getFullInfo } from '@/api/work'
|
|
|
-export default {
|
|
|
- data() {
|
|
|
- return {
|
|
|
- orderInfo:[],
|
|
|
- orderItem:[]
|
|
|
- }
|
|
|
- },
|
|
|
- props: {
|
|
|
- selectOrderId: {
|
|
|
- type: Number,
|
|
|
- default: 0
|
|
|
- }
|
|
|
- },
|
|
|
- watch:{
|
|
|
- selectOrderId:{
|
|
|
- handler(newId){
|
|
|
- if(Number(newId)>0){
|
|
|
- this.getOrderDetail(newId)
|
|
|
- }
|
|
|
- },
|
|
|
- immediate:true
|
|
|
- }
|
|
|
- },
|
|
|
- methods:{
|
|
|
- modifyItem(info){
|
|
|
- this.$util.pageTo({url:'/admin/work/modify',query: { id:info.id }})
|
|
|
- },
|
|
|
- getStatus(status) {
|
|
|
- switch (status) {
|
|
|
- case "0":
|
|
|
- return "待完成";
|
|
|
- break;
|
|
|
- case "1":
|
|
|
- return "已完成";
|
|
|
- break;
|
|
|
- case "2":
|
|
|
- return "已取消";
|
|
|
- break;
|
|
|
- default:
|
|
|
- return "待完成";
|
|
|
- }
|
|
|
- },
|
|
|
- getOrderDetail(id){
|
|
|
- getFullInfo({id}).then(res=>{
|
|
|
- if(res.code == 1){
|
|
|
- this.orderInfo = res.data.info
|
|
|
- this.orderItem = res.data.item
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-</script>
|
|
|
-<style lang="scss" scoped>
|
|
|
-.work-info{
|
|
|
- display:flex;
|
|
|
- height: 100%;
|
|
|
- & .work-detail{
|
|
|
- border-right:1upx solid #EEEEEE;
|
|
|
- flex: 40;
|
|
|
- .order-img{
|
|
|
- display:flex;
|
|
|
- margin:5upx;
|
|
|
- justify-content:center;
|
|
|
- image{
|
|
|
- width:180upx;
|
|
|
- height:180upx;
|
|
|
- border-radius:3upx;
|
|
|
- }
|
|
|
- }
|
|
|
- .order-item{
|
|
|
- display:flex;
|
|
|
- font-size:11upx;
|
|
|
- margin-top:10upx;
|
|
|
- justify-content: center;
|
|
|
- flex-wrap:wrap;
|
|
|
- view{
|
|
|
- justify-content:space-between;
|
|
|
- align-items:center;
|
|
|
- display:flex;
|
|
|
- border-bottom:1upx solid #EEEEEE;
|
|
|
- width:180upx;
|
|
|
- height:19upx;
|
|
|
- padding:0 10upx 0 10upx;
|
|
|
- .left{
|
|
|
- color:#CCCCCC;
|
|
|
- }
|
|
|
- .right{
|
|
|
- color:#666666;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- & .button-area {
|
|
|
- flex: 9;
|
|
|
- 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;
|
|
|
- text-align: center;
|
|
|
- padding: 10upx 0;
|
|
|
- color: #666666;
|
|
|
- margin-bottom: 10upx;
|
|
|
- font-size: 10upx;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
- & .active {
|
|
|
- color: #1627be;
|
|
|
- border-color: #1627be;
|
|
|
- font-size: 10upx;
|
|
|
- font-weight:bold;
|
|
|
- }
|
|
|
- }
|
|
|
- & .work-item-detail {
|
|
|
- flex: 40;
|
|
|
- height: 100%;
|
|
|
- & .right-detail-title{
|
|
|
- font-size:10upx;
|
|
|
- font-weight:bold;
|
|
|
- margin-left:5upx;
|
|
|
- margin-top:5upx;
|
|
|
- }
|
|
|
- & .unit-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;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .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;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- & .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>
|