Merge branch 'hongchao-dev'

components.d.ts

@@ -19,8 +19,10 @@ declare module 'vue' {
     ElConfigProvider: typeof import('element-plus/es')['ElConfigProvider']
     ElDatePicker: typeof import('element-plus/es')['ElDatePicker']
     ElDialog: typeof import('element-plus/es')['ElDialog']
+    ElEmpty: typeof import('element-plus/es')['ElEmpty']
     ElForm: typeof import('element-plus/es')['ElForm']
     ElFormItem: typeof import('element-plus/es')['ElFormItem']
+    ElHeader: typeof import('element-plus/es')['ElHeader']
     ElIcon: typeof import('element-plus/es')['ElIcon']
     ElImage: typeof import('element-plus/es')['ElImage']
     ElInput: typeof import('element-plus/es')['ElInput']
@@ -33,8 +35,12 @@ declare module 'vue' {
     ElProgress: typeof import('element-plus/es')['ElProgress']
     ElRow: typeof import('element-plus/es')['ElRow']
     ElSelect: typeof import('element-plus/es')['ElSelect']
+    ElStep: typeof import('element-plus/es')['ElStep']
+    ElSteps: typeof import('element-plus/es')['ElSteps']
     ElTable: typeof import('element-plus/es')['ElTable']
     ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
+    ElTabPane: typeof import('element-plus/es')['ElTabPane']
+    ElTabs: typeof import('element-plus/es')['ElTabs']
     ElTag: typeof import('element-plus/es')['ElTag']
     ElUpload: typeof import('element-plus/es')['ElUpload']
     EquipCard: typeof import('./src/components/equipCard.vue')['default']

src/http/api/usercenter/seekorder.ts

@@ -11,3 +11,13 @@ export const getOrderListApi = (data: any) => {
 export const getOrderListInfoApi = (data: any) => {
     return get('/material-mall/order/getOrderDetailsById',data)
 }
+
+//出库
+export const passApi = (data: any) => {
+    return post('/material-mall/order/updateOrderStatus',data)
+}
+
+//驳回
+export const failApi = (data: any) => {
+    return post('/material-mall/order/updateOrderStatus',data)
+}

src/router/index.ts

@@ -216,7 +216,7 @@ const routes: Array<RouteRecordRaw> = [
                 },
             },
 
-            /* 订单管理（求租方） */
+            /* 订单管理（承租方） */
             {
                 path: 'orderManagement',
                 name: 'orderManagement',
@@ -228,7 +228,31 @@ const routes: Array<RouteRecordRaw> = [
                     isLogin: true
                 },
             },
-            /* 订单管理（订单详情） */
+            /* 订单管理（出租方） */
+                {
+                    path: 'orderManagementBuy',
+                    name: 'orderManagementBuy',
+                    component: () => import('@/views/user/orderManagementCz/index.vue'),
+                    meta: {
+                        title: '订单管理（求租）',
+                        keepAlive: true,
+                        AuthFlag: false,
+                        isLogin: true
+                    },
+                },
+            /* 订单管理（订单详情出租） */
+            {
+                path: 'orderManagementInfoBuy',
+                name: 'orderManagementInfoBuy',
+                component: () => import('@/views/user/orderManagementCz/detail.vue'),
+                meta: {
+                    title: '订单详情',
+                    keepAlive: true,
+                    AuthFlag: false,
+                    isLogin: false
+                },
+            },
+            /* 订单管理（订单详情承租） */
             {
                 path: 'orderManagementInfo',
                 name: 'orderManagementInfo',

src/views/user/orderManagement/detail.vue

@@ -6,39 +6,62 @@ import { getOrderListInfoApi } from 'http/api/usercenter/seekorder'
 const route = useRoute()
 /* 查询参数 */
 const cardList = ref<any>({})
-const orderStatusTemp = ref<Number>(0)
+const orderStatusTemp = ref<number>(0)
 const idTemp = ref<string>('')
 const titleStaus = ref<any>('')
-// 获取数据列表
+//描述信息
-// const getList = async () => {
+const  operationDetails = ref<any>({
-//     const res: any = await getOrderListApi()
+            1: { title: '已出库', preOutboundUser: '', preOutboundTime: '' },
-//     console.log('获取数据列表***', res)
+            2: { title: '已收货', takeOverUser: '', takeOverTime: '' },
-//     tableData.value = res.rows
+            3: { title: '租赁结束', rentOverUser: '', rentOverTime: '' },
-//     total.value = res.total
+        })
-// }
-
   // 根据步骤的 Id 返回对应的标题
 const  getStepTitle = (stepId:number)=> {
-        if (orderStatusTemp.value === 1) {
+        if (orderStatusTemp.value === 2) {
           titleStaus.value=  '待出库' ;
           return stepId === 1 ? '待出库' : '';
-        } else if (orderStatusTemp.value === 2) {
+        } else if (orderStatusTemp.value === 3) {
           titleStaus.value=  '待收货' ;
           return stepId === 1 ? '已出库' : stepId === 2 ? '待收货' : '';
-        } else if (orderStatusTemp.value === 3) {
+        } else if (orderStatusTemp.value === 4) {
           titleStaus.value=  '租赁中' ;
           return stepId === 1 ? '已出库' : stepId === 2 ? '已收货' : stepId === 3 ? '租赁中' : '';
-        } else if (orderStatusTemp.value === 4) {
-          titleStaus.value=  '发起费用结算' ;
-          return stepId === 1 ? '已出库' : stepId === 2 ? '已收货' : stepId === 3 ? '租赁结束' : stepId === 4 ? '发起费用结算' : '';
         } else if (orderStatusTemp.value === 5) {
+          titleStaus.value=  '已退租' ;
+          return stepId === 1 ? '已出库' : stepId === 2 ? '已收货' : stepId === 3 ? '租赁结束' : stepId === 4 ? '已退租' : '';
+        } else if (orderStatusTemp.value === 6) {
           titleStaus.value= '已完成' ;
           return stepId === 1 ? '已出库' : stepId === 2 ? '已收货' : stepId === 3 ? '租赁结束' : stepId === 4 ? '已退租' : stepId === 5 ? '已完成' : '';
+        } else if(orderStatusTemp.value === 7) {
+          titleStaus.value= '已驳回' ;
+          return stepId === 1 ? '已驳回' : '';
         }
         titleStaus.value=''
         return ''; // 默认返回空字符串
       }
 
+  // 根据步骤的 Id 返回对应的描述
+  const  getDescription=(desId:number)=>{
+    const operation = operationDetails.value[desId];
+        if (operation.title=="已出库" && titleStaus.value!=  "待出库" ) {
+            return `
+                操作人：${operation.preOutboundUser==null ?  ' ': operation.preOutboundUser}
+                操作时间：${operation.preOutboundTime==null ?  ' ': operation.preOutboundTime}
+            `;
+        }else if(operation.title=="已收货"  && titleStaus.value!=  "待收货" && titleStaus.value!=  "待出库"){
+            return `
+                操作人：${operation.takeOverUser==null ?  ' ': operation.takeOverUser}
+                操作时间：${operation.takeOverTime==null ?  ' ': operation.takeOverTime}
+            `;
+        }else if(operation.title=="租赁结束"  && (titleStaus.value!=  "待收货" && titleStaus.value!=  "待出库" && titleStaus.value!=  "租赁中")){
+            return `
+                操作人：${operation.rentOverUser==null ?  ' ': operation.rentOverUser}
+                操作时间：${operation.rentOverTime==null ?  ' ': operation.rentOverTime}
+            `;
+        }
+        return ''; // 默认返回空描述
+    }
+
 const getId = ()=>{
     orderStatusTemp.value = Number(route.query.orderStatusTemp)
     idTemp.value = String(route.query.idTemp)
@@ -52,6 +75,13 @@ const getList = async () => {
 
      const res: any = await getOrderListInfoApi(params)
     cardList.value = res.data
+    operationDetails.value[1].preOutboundUser = res.data.detailsList[0].preOutboundUser
+    operationDetails.value[1].preOutboundTime = res.data.detailsList[0].preOutboundTime
+    operationDetails.value[2].takeOverUser = res.data.detailsList[0].takeOverUser
+    operationDetails.value[2].takeOverTime = res.data.detailsList[0].takeOverTime
+    operationDetails.value[3].rentOverUser = res.data.detailsList[0].rentOverUser
+    operationDetails.value[3].rentOverTime = res.data.detailsList[0].rentOverTime
+
 }
 
 onBeforeMount(()=>{
@@ -70,7 +100,7 @@ const time = ref([])
     <!-- 订单管理 -->
     <div class="container">
       <el-breadcrumb separator="/">
-      <el-breadcrumb-item :to="{ path: '/myuser/orderManagement' }">订单管理</el-breadcrumb-item>
+      <el-breadcrumb-item :to="{ path: '/my-user/orderManagement' }">订单管理</el-breadcrumb-item>
       <el-breadcrumb-item>订单明细</el-breadcrumb-item>
       </el-breadcrumb>
       <div class="section">
@@ -85,12 +115,12 @@ const time = ref([])
           </el-row>
         </el-header> 
 
-         <el-steps class="step" :space="400" :active="orderStatusTemp.value" finish-status="success">
+         <el-steps class="step" :space="400" :active="orderStatusTemp===7 ? 1 : orderStatusTemp-1" finish-status="success">
-            <el-step :title="getStepTitle(1)" ></el-step>
+            <el-step :title="getStepTitle(1)" :description="getDescription(1)"></el-step>
-            <el-step :title="getStepTitle(2)" ></el-step>
+            <el-step :title="getStepTitle(2)" :description="getDescription(2)"></el-step>
-            <el-step :title="getStepTitle(3)" ></el-step>
+            <el-step :title="getStepTitle(3)" :description="getDescription(3)"></el-step>
             <el-step :title="getStepTitle(4)" ></el-step>
-            <el-step :title="getStepTitle(5)" :finish-status="orderStatusTemp.value >= 5 ? 'success' : ''"></el-step>
+            <el-step :title="getStepTitle(5)" ></el-step>
         </el-steps>
       </div>
 
@@ -179,8 +209,9 @@ const time = ref([])
                     <div v-if="goods.orderStatus=='4'" style="font-size: 14px; font-weight: bold; margin-bottom: 10px; color:blue">{{"租赁中"}}</div>
                     <div v-if="goods.orderStatus=='5'" style="font-size: 14px; font-weight: bold; margin-bottom: 10px; color:blue">{{"已退租"}}</div>
                     <div v-if="goods.orderStatus=='6'" style="font-size: 14px; font-weight: bold; margin-bottom: 10px; color:blue">{{"已完成"}}</div>
+                    <div v-if="goods.orderStatus=='7'" style="font-size: 14px; font-weight: bold; margin-bottom: 10px; color:blue">{{"已驳回"}}</div>
                 </el-col>
-                 <el-col :span="3">
+                 <!-- <el-col :span="3">
                     <div>
                         <el-button
                             @click="handleViewOrder(j)"
@@ -199,7 +230,7 @@ const time = ref([])
                             驳回
                         </el-button>
                     </div>
-                </el-col> 
+                </el-col>  -->
             </el-row>
           </div> 
 
@@ -210,7 +241,7 @@ const time = ref([])
 <style lang="scss" scoped>
 
 .container {
-    width: 800px;
+    // width: 800px;
     margin: 0 auto;
     padding: 10px;
     // background: #eeeff6;

src/views/user/orderManagementCz/detail.vue

@@ -0,0 +1,331 @@
+<script setup lang="ts">
+import { ref } from 'vue'
+import PagingComponent from 'components/PagingComponent/index.vue'
+import { useRouter } from 'vue-router'
+import { getOrderListInfoApi } from 'http/api/usercenter/seekorder'
+const route = useRoute()
+/* 查询参数 */
+const cardList = ref<any>({})
+const orderStatusTemp = ref<number>(0)
+const idTemp = ref<string>('')
+const titleStaus = ref<any>('')
+
+//描述信息
+const  operationDetails = ref<any>({
+            1: { title: '已出库', preOutboundUser: '', preOutboundTime: '' },
+            2: { title: '已收货', takeOverUser: '', takeOverTime: '' },
+            3: { title: '租赁结束', rentOverUser: '', rentOverTime: '' },
+        })
+// 获取数据列表
+// const getList = async () => {
+//     const res: any = await getOrderListApi()
+//     console.log('获取数据列表***', res)
+//     tableData.value = res.rows
+//     total.value = res.total
+// }
+
+  // 根据步骤的 Id 返回对应的标题
+const  getStepTitle = (stepId:number)=> {
+        if (orderStatusTemp.value === 2) {
+          titleStaus.value=  '待出库' ;
+          return stepId === 1 ? '待出库' : '';
+        } else if (orderStatusTemp.value === 3) {
+          titleStaus.value=  '待收货' ;
+          return stepId === 1 ? '已出库' : stepId === 2 ? '待收货' : '';
+        } else if (orderStatusTemp.value === 4) {
+          titleStaus.value=  '租赁中' ;
+          return stepId === 1 ? '已出库' : stepId === 2 ? '已收货' : stepId === 3 ? '租赁中' : '';
+        } else if (orderStatusTemp.value === 5) {
+          titleStaus.value=  '已退租' ;
+          return stepId === 1 ? '已出库' : stepId === 2 ? '已收货' : stepId === 3 ? '租赁结束' : stepId === 4 ? '已退租' : '';
+        } else if (orderStatusTemp.value === 6) {
+          titleStaus.value= '已完成' ;
+          return stepId === 1 ? '已出库' : stepId === 2 ? '已收货' : stepId === 3 ? '租赁结束' : stepId === 4 ? '已退租' : stepId === 5 ? '已完成' : '';
+        } else if(orderStatusTemp.value === 7) {
+          titleStaus.value= '已驳回' ;
+          return stepId === 1 ? '已驳回' : '';
+        }
+        titleStaus.value=''
+        return ''; // 默认返回空字符串
+      }
+
+  // 根据步骤的 Id 返回对应的描述
+  const  getDescription=(desId:number)=>{
+    const operation = operationDetails.value[desId];
+        if (operation.title=="已出库" && titleStaus.value!=  "待出库" ) {
+            return `
+                操作人：${operation.preOutboundUser==null ?  ' ': operation.preOutboundUser}
+                操作时间：${operation.preOutboundTime==null ?  ' ': operation.preOutboundTime}
+            `;
+        }else if(operation.title=="已收货"  && titleStaus.value!=  "待收货" && titleStaus.value!=  "待出库"){
+            return `
+                操作人：${operation.takeOverUser==null ?  ' ': operation.takeOverUser}
+                操作时间：${operation.takeOverTime==null ?  ' ': operation.takeOverTime}
+            `;
+        }else if(operation.title=="租赁结束"  && (titleStaus.value!=  "待收货" && titleStaus.value!=  "待出库" && titleStaus.value!=  "租赁中")){
+            return `
+                操作人：${operation.rentOverUser==null ?  ' ': operation.rentOverUser}
+                操作时间：${operation.rentOverTime==null ?  ' ': operation.rentOverTime}
+            `;
+        }
+        return ''; // 默认返回空描述
+    }
+
+const getId = ()=>{
+    orderStatusTemp.value = Number(route.query.orderStatusTemp)
+    idTemp.value = String(route.query.idTemp)
+}
+
+/** 查询列表 */
+const getList = async () => {
+    let params = {
+        id: idTemp.value
+    }
+
+     const res: any = await getOrderListInfoApi(params)
+    cardList.value = res.data
+    operationDetails.value[1].preOutboundUser = res.data.detailsList[0].preOutboundUser
+    operationDetails.value[1].preOutboundTime = res.data.detailsList[0].preOutboundTime
+    operationDetails.value[2].takeOverUser = res.data.detailsList[0].takeOverUser
+    operationDetails.value[2].takeOverTime = res.data.detailsList[0].takeOverTime
+    operationDetails.value[3].rentOverUser = res.data.detailsList[0].rentOverUser
+    operationDetails.value[3].rentOverTime = res.data.detailsList[0].rentOverTime
+}
+
+onBeforeMount(()=>{
+   getId()
+})
+
+onMounted(() => {
+    getList()
+})
+
+
+const time = ref([])
+</script>
+
+<template>
+    <!-- 订单管理 -->
+    <div class="container">
+      <el-breadcrumb separator="/">
+      <el-breadcrumb-item :to="{ path: '/my-user/orderManagementCz' }">订单管理</el-breadcrumb-item>
+      <el-breadcrumb-item>订单明细</el-breadcrumb-item>
+      </el-breadcrumb>
+      <div class="section">
+        <el-header>
+          <el-row type="flex" justify="space-between" align="middle">
+          <el-col :span="3">
+            <span>订单流程</span>
+          </el-col>
+          <el-col :span="2" style="text-align:right;margin-right:20px;font-size: 20px;">
+            <div style="color:green;">{{titleStaus}}</div>
+          </el-col>
+          </el-row>
+        </el-header> 
+
+         <el-steps class="step" :space="400" :active="orderStatusTemp===7 ? 1 : orderStatusTemp-1" finish-status="success">
+            <el-step :title="getStepTitle(1)" :description="getDescription(1)"></el-step>
+            <el-step :title="getStepTitle(2)" :description="getDescription(2)"></el-step>
+            <el-step :title="getStepTitle(3)" :description="getDescription(3)"></el-step>
+            <el-step :title="getStepTitle(4)" ></el-step>
+            <el-step :title="getStepTitle(5)" ></el-step>
+        </el-steps>
+      </div>
+
+     <div class="section">
+        <el-header style="height:30px">租赁信息
+        </el-header>
+      <div style="height: 80px;">
+          <div
+            class="info"
+            style="margin-top: 5px; display: flex; flex-wrap: wrap;"
+            
+          >
+            <div class="item" style="width: 30%;flex-shrink: 0;margin-bottom: 5px;font-size: 14px;margin-left: 40px;opacity: 0.7">
+              <span>订单编号：{{cardList.code}}</span>
+            </div>
+            <div class="item" style="width: 30%;flex-shrink: 0;margin-bottom: 5px;font-size: 14px;opacity: 0.7">
+              <span>下单时间：{{cardList.orderTime}}</span>
+            </div>
+
+            <div class="item" style="width: 30%;flex-shrink: 0;margin-bottom: 5px;font-size: 14px;opacity: 0.7">
+              <span></span>
+            </div>
+
+            <div class="item" style="width: 30%;flex-shrink: 0;margin-bottom: 5px;font-size: 14px;margin-left: 40px;opacity: 0.7">
+              <span>出租单位：{{cardList.czcompanyName}}</span>
+            </div>
+
+            <div class="item" style="width: 30%;flex-shrink: 0;margin-bottom: 5px;font-size: 14px;opacity: 0.7">
+              <span>出租人：{{cardList.person}}</span>
+            </div>
+
+            <div class="item" style="width: 30%;flex-shrink: 0;margin-bottom: 5px;font-size: 14px;opacity: 0.7">
+              <span>出租人电话：{{cardList.personPhone}}</span>
+            </div>
+
+            <div class="item" style="width: 30%;flex-shrink: 0;margin-bottom: 5px;font-size: 14px;margin-left: 40px;opacity: 0.7">
+              <span>承租单位：{{cardList.companyName}}</span>
+            </div>
+
+            <div class="item" style="width: 30%;flex-shrink: 0;margin-bottom: 5px;font-size: 14px;opacity: 0.7">
+              <span>承租人：{{cardList.nickName}}</span>
+            </div>
+            
+            <div class="item" style="width: 30%;flex-shrink: 0;margin-bottom: 5px;font-size: 14px;opacity: 0.7">
+              <span>承租人电话：{{cardList.phoneNumber}}</span>
+            </div>
+
+            <div class="item" style="width: 30%;flex-shrink: 0;margin-bottom: 5px;font-size: 14px;margin-left: 40px;opacity: 0.7">
+              <span>租赁协议：</span>
+            </div>
+          </div>
+        </div>
+
+           <div class="cart-tbody" >
+            <el-row class="cart-list" v-for="(goods, j) in cardList.detailsList" :key="j">
+                <el-col :span="9" class="goods-info">
+                    <el-col :span="7">
+                        <img :src="goods.url" alt="" />
+                    </el-col>
+                    <div class="goods-code">
+                        <div style="font-size: 10px; font-weight: bold">{{ goods.deviceName }}</div>
+                        <div>租期：{{ goods.days }}{{ ' ' + '天' }}</div>
+                        <div>租金：{{ goods.dayLeasePrice }}{{ ' ' + '元/天' }}</div>
+                        <div>数量：{{ goods.num }}{{ ' ' + '台' }}</div>
+                    </div>
+                </el-col>
+                <el-col :span="2">
+                    <div style="font-size: 14px; font-weight: bold; margin-bottom: 10px">
+                        总费用
+                    </div>
+                    <div class="red-font">{{goods.costs}}</div>
+                </el-col>
+                <el-col :span="7">
+                    <div style="font-size: 14px; font-weight: bold; margin-bottom: 10px">租期</div>
+                    <div style="color: black; font-weight: bold">
+                        {{ goods.rentBeginTime  }}
+                    </div>
+                    <div style="margin-top:3px;margin-bottom:3px">{{ '至' }}</div>
+                    <div style="color: black; font-weight: bold">{{ goods.rentEndTime }}</div>
+                </el-col>
+                <el-col :span="2">
+                    <div v-if="goods.orderStatus=='0'" style="font-size: 14px; font-weight: bold; margin-bottom: 10px; color:blue">{{"未下单"}}</div>
+                    <div v-if="goods.orderStatus=='1'" style="font-size: 14px; font-weight: bold; margin-bottom: 10px; color:blue">{{"已下单"}}</div>
+                    <div v-if="goods.orderStatus=='2'" style="font-size: 14px; font-weight: bold; margin-bottom: 10px; color:blue">{{"待出库"}}</div>
+                    <div v-if="goods.orderStatus=='3'" style="font-size: 14px; font-weight: bold; margin-bottom: 10px; color:blue">{{"待收货"}}</div>
+                    <div v-if="goods.orderStatus=='4'" style="font-size: 14px; font-weight: bold; margin-bottom: 10px; color:blue">{{"租赁中"}}</div>
+                    <div v-if="goods.orderStatus=='5'" style="font-size: 14px; font-weight: bold; margin-bottom: 10px; color:blue">{{"已退租"}}</div>
+                    <div v-if="goods.orderStatus=='6'" style="font-size: 14px; font-weight: bold; margin-bottom: 10px; color:blue">{{"已完成"}}</div>
+                    <div v-if="goods.orderStatus=='7'" style="font-size: 14px; font-weight: bold; margin-bottom: 10px; color:blue">{{"已驳回"}}</div>
+                </el-col>
+                 <!-- <el-col :span="3">
+                    <div>
+                        <el-button
+                            @click="handleViewOrder(j)"
+                            type="text"
+                            size="mini"
+                            style="color: #blue; font-weight: bold"
+                        >
+                            出库
+                        </el-button>
+                        <el-button
+                            @click="handleViewOrder(j)"
+                            type="text"
+                            size="mini"
+                            style="color: #blue; font-weight: bold"
+                        >
+                            驳回
+                        </el-button>
+                    </div>
+                </el-col>  -->
+            </el-row>
+          </div> 
+
+        </div>
+    </div>
+</template>
+
+<style lang="scss" scoped>
+
+.container {
+    // width: 800px;
+    margin: 0 auto;
+    padding: 10px;
+    // background: #eeeff6;
+    font-size: 14px;
+    .step{
+        margin-left:80px;;
+    }
+
+    .section {
+        margin-top: 20px;
+        margin-bottom: 20px;
+    }
+   .cart-tbody {
+        background: #fff;
+        padding: 8px 12px;
+        margin: 10px;
+        border: 1px solid #ccc;
+        border-radius: 20px;
+        .cart-user-info {
+            display: flex;
+            align-items: center;
+            font-size: 13px;
+
+            .user-name,
+            .user-phone {
+                padding: 3px 18px;
+                border: 1px solid #ccc;
+            }
+
+            .user-name {
+                margin-left: 20px;
+                border-right: none;
+            }
+        }
+
+        .cart-list {
+            margin: 15px 0;
+            display: flex;
+            align-items: center;
+            
+            div {
+                text-align: center;
+            }
+
+            .goods-info {
+                display: flex;
+                align-content: center;
+                img {
+                    width: 140px;
+                    height: 80px;
+                }
+
+                .goods-code {
+                    margin-left: 70px;
+                    display: flex;
+                    flex-direction: column;
+                    justify-content: space-around;
+                    div {
+                        text-align: left;
+                    }
+                }
+            }
+
+            .lease-date {
+                display: flex;
+                flex-direction: column;
+                justify-content: center;
+                align-items: center;
+                font-size: 12px;
+            }
+
+            .red-font {
+                color: #ff4800;
+                font-weight: bold;
+            }
+        }
+    }
+}
+</style>