费用申请和订单互斥

src/api/ecw/mutexOrder.js

+// export function
+import request from '@/utils/request'
+
+export function guanlianList(params){
+  return request({
+    url:'order/mutual/getMutualOrderByOrderId',
+    method:'post',
+    data:params,
+  })
+};
+//未加入互斥
+export function getUnGuanlianOrderByOrderId(data){
+  return request({
+    url:'order/mutual/getUnMutualOrderByOrderId',
+    method:'post',
+    data:data,
+  })
+}
+//加入互斥
+export function guanlianCreate(data){
+  return request({
+    url:'order/mutual/create',
+    method:'post',
+    data:data,
+  })
+}
+//批量加入互斥
+export function ordeRcreateBatch(data){
+  return request({
+    url:'order/mutual/createBatch',
+    method:'post',
+    data:data,
+  })
+}
+//移出互斥
+export function deleteGuanlianOrderByOrderId(data){
+  return request({
+    url:'/order/mutual/deleteMutualOrderByOrderId',
+    method:'delete',
+    data:data
+  })
+}
+// 批量移出互斥
+export function deleteBatchGuanlianOrderByOrderId(data){
+  return request({
+    url:'/order/mutual/deleteBatchMutualOrderByOrderId',
+    method:'delete',
+    data:data,
+  })
+}
+

src/api/ecw/order.js

 import request from '@/utils/request'
+import {param} from "@/utils";
 
 // 创建订单
 export function createOrder(data) {
@@ -77,6 +78,22 @@ export function feeApplicationListByOrderId(query){
     data:data,
   })
  }
+  //费用申请修改
+ export function applicationUpdate(data){
+  return request({
+    url:'/order/fee-application/update',
+    method:'put',
+    data:data,
+  })
+ }
+  export function ApplicationListByOrderId(params){
+   return request({
+     url:'order/fee-application/listByOrderId',
+     method:'get',
+     params:params
+
+   })
+  }
 // 创建特殊
 export  function specialNeedCreate(data){
   return request({

src/router/index.js

@@ -305,7 +305,7 @@ export const constantRoutes = [
           title:'添加关联订单',
           icon:'',
           activeMenu:'/order/addAssociatedOrder',
-          noCache:false,
+          noCache:true,
         }
       },
       {
@@ -341,8 +341,30 @@ export const constantRoutes = [
           activeMenu: '/order/feeApplication'
 
         }
+      },
+      {
+        path: 'mutex-order/:orderId',
+        component:()=> import('@/views/ecw/order/mutexOrder'),
+        name:'mutexOrder',
+        props: true,
+        meta: {
+          title: '订单互斥',
+          icon:'',
+          activeMenu: '/order/mutexOrder',
+          noCache: true,
+        }
+      },{
+      path: 'not-mutex-order/:orderId',
+        component:()=>import('@/views/ecw/order/notMutexOrder'),
+        name: 'notMutexOrder',
+        props: true,
+        meta:{
+          title: '未加入互斥',
+          icon:'',
+          activeMenu: '/order/notMutexOrder',
+          noCache: true,
+        }
       }
-
     ],
   },
   {

src/views/ecw/order/feeApplication.vue

@@ -14,28 +14,28 @@
      <el-table :data="list">
        <el-table-column label="序号" type="index"></el-table-column>
        <el-table-column label="费用类型">
-          <template  v-slot:default="scope">
-            <dict-selector :type="DICT_TYPE.FEE_TYPE" v-model="scope.row.feeType" />
+          <template  v-slot:default = "scope">
+            <dict-selector :disabled="isModify[forbidden(scope.row)]"  :type="DICT_TYPE.FEE_TYPE" v-model="scope.row.feeType" />
           </template>
        </el-table-column>
        <el-table-column label="金额">
          <template v-slot:default = 'scope'>
-           <el-input v-model="scope.row.applicationFee" ></el-input>
+           <el-input  :disabled="isModify[forbidden(scope.row)]" v-model="scope.row.applicationFee" ></el-input>
          </template>
        </el-table-column>
        <el-table-column label="货币类型">
          <template v-slot:default = 'scope'>
-           <dict-selector :type="DICT_TYPE.COMMISSION_CURRENCY_TYPE" v-model="scope.row.applicationFeeCurrency" />
+           <dict-selector  :disabled="isModify[forbidden(scope.row)]" :type="DICT_TYPE.COMMISSION_CURRENCY_TYPE" v-model="scope.row.applicationFeeCurrency" />
          </template>
        </el-table-column>
        <el-table-column label="付款类型">
-         <template v-slot:default = 'scope'>
-           <dict-selector :type="DICT_TYPE.PAY_TYPE" v-model="scope.row.payType" />
+         <template v-slot = {row}>
+           <dict-selector  :disabled="isModify[forbidden(row)]" :type="DICT_TYPE.PAY_TYPE" v-model="row.payType" />
          </template>
        </el-table-column>
        <el-table-column label="备注">
          <template v-slot:default="scope">
-           <el-input v-model="scope.row.remarks" type="textarea"></el-input>
+           <el-input  :disabled="isModify[forbidden(scope.row)]" v-model="scope.row.remarks" type="textarea"></el-input>
          </template>
        </el-table-column>
        <el-table-column label="确认收款">
@@ -45,13 +45,13 @@
        </el-table-column>
        <el-table-column label="申请人">
           <template v-slot:default ="scope">
-            {{scope.row.status == 0 ?'未提交': scope.row.applicationAuthor}}
+            {{scope.row.status === 0 ?'未提交': scope.row.applicationAuthor}}
           </template>
        </el-table-column>
        <el-table-column label="操作">
          <template v-slot:default = 'scope'>
-           <el-button type="text" v-if="scope.row.status !== 0">{{status[scope.row.status]}}</el-button>
-           <el-button type="text" v-if="scope.row.status === 2">修改</el-button>
+           <el-button type="text" v-if="scope.row.status !== 0">{{STATUS[scope.row.status]}}</el-button>
+           <el-button type="text" v-if="scope.row.status === 2" @click="modify(scope.row)">修改</el-button>
          </template>
        </el-table-column>
      </el-table>
@@ -63,10 +63,9 @@
 </template>
 
 <script>
-import {getOrder, feeApplicationListByOrderId, feeApplicationCreate} from "@/api/ecw/order";
+import {getOrder, feeApplicationCreate, ApplicationListByOrderId, applicationUpdate} from "@/api/ecw/order";
 import { getDictDatas, DICT_TYPE } from '@/utils/dict';
 import Template from "@/views/cms/template";
-let status = {0:'未提交',1:'审核中',2:'审核通过',3:'审核不通'}
 export default {
   name: "feeApplication",
   components: {Template},
@@ -79,22 +78,32 @@ export default {
       list:[],
       DICT_TYPE,
       getDictDatas,
-      status
+      STATUS:{},
+      isModify:[],
+      isModifyIf:false
     }
   },
   created() {
     getOrder(this.orderId).then(r =>{
       this.orderDetails = r.data
     })
-    this.feeApplicationFn();
+    this.getOrderList()
+    this.getDictDatas(this.DICT_TYPE.AUDIT_STATUS).forEach( e =>{
+      this.STATUS[e.value] = e.label
+    })
+  },
+  computed:{
+    forbidden(){
+      return (row)=>{
+        return this.list.findIndex(e => e.id = row.id)
+      }
+    }
   },
   methods:{
-    feeApplicationFn(){
-      feeApplicationListByOrderId({orderId:this.orderId}).then(r => {
-        console.log(r)
-      })
-    },
     addCost(){
+      if(this.list.some(e => e.status === 0 || e.status === 1)){
+        return this.$message.success('当前有申请费用为审核中或未提交，请审核后在申请');
+      }
         this.list.push(
           {
             orderId:this.orderId,
@@ -107,11 +116,39 @@ export default {
             status:0,
           }
         )
+      this.isModify.push(false)
+      this.isModifyIf = false;
     },
     submit(){
-      feeApplicationCreate(this.list[0]).then(r=>{
-        console.log(r);
+      if(this.isModifyIf){
+        applicationUpdate({...this.list[this.isModify.findIndex(e => e === false)],status:1}).then(r => {
+          if(r.code === 0){
+            this.getOrderList();
+            this.$message.success('修改成功');
+          }
+        })
+      }else {
+        if(this.list[this.list.length - 1].status !== 0){
+          feeApplicationCreate( {...this.list[this.list.length - 1],status:1}).then(r=>{
+            if(r.code === 0){
+              this.getOrderList();
+              this.$message.success('添加成功');
+            }
+          })
+        }
+      }
+    },
+    getOrderList(){
+      ApplicationListByOrderId({orderId: this.orderId}).then(r => {
+        if(r.code === 0){
+          this.list = r.data;
+          this.list.forEach(()=>this.isModify.push(true))
+        }
       })
+    },
+    modify(row){
+      this.isModifyIf = true;
+      this.$set(this.isModify, this.list.findIndex(e => e.id = row.id), false )
     }
   }
 }

src/views/ecw/order/index.vue

@@ -158,6 +158,7 @@
           <el-button type="text"  size="mini" @click="$router.push(`/order/fee-application/${scope.row.orderId}`)">费用申请</el-button>
           <el-button type="text"  size="mini" @click="orderId = scope.row.orderId;isShow = true" >特需</el-button>
           <el-button type="text"  size="mini" @click="$router.push(`/order/associated-order/${scope.row.orderId}`)" >关联</el-button>
+          <el-button type="text"  size="mini" @click="$router.push(`/order/mutex-order/${scope.row.orderId}`)" >互斥</el-button>
         </template>
       </el-table-column>
     </el-table>

src/views/ecw/order/mutexOrder.vue

+<template>
+  <div class="associated-order">
+    <h1 class="title">
+      互斥订单-{{orderDetails.orderNo}}
+    </h1>
+    <el-divider></el-divider>
+    <orde-details-form  :details ="orderDetails" ></orde-details-form>
+    <el-divider></el-divider>
+    <el-form inline label-width="100px">
+      <el-form-item label="订单号"><div class="content">
+        <el-input v-model="params.relateOrderId"></el-input>
+      </div></el-form-item>
+      <el-form-item><div class="content">
+        <el-button @click="getList">查询</el-button>
+      </div></el-form-item>
+    </el-form>
+    <el-divider></el-divider>
+    <div style="display: flex;align-items: center;">
+      <h1 class="title">
+        已加入互斥订单列表
+      </h1>
+      <div style="flex: 1;margin-left: 20px;">
+        <el-button :disabled="multipleSelection.length === 0" type="primary" @click="batchGuanlianOrderByOrderId(multipleSelection.map(e =>({orderId:orderId,mutualOrderId:e.orderId})))" >批量移出</el-button>
+      </div>
+      <div>
+        <el-button type="primary" @click="$router.push('/order/not-mutex-order/'+ orderId)" >添加互斥订单</el-button>
+      </div>
+    </div>
+    <el-table :data="list"  @selection-change="handleSelectionChange" >
+      <el-table-column
+        type="selection"
+        width="55">
+      </el-table-column>
+      <el-table-column type="index" label="序号"></el-table-column>
+      <el-table-column label="订单号" prop="orderNo"></el-table-column>
+      <el-table-column label="唛头" prop="marks"></el-table-column>
+      <el-table-column label="货物数据"></el-table-column>
+      <el-table-column label="入仓时间" prop="remarks"></el-table-column>
+      <el-table-column label="状态" prop="status" >
+        <template v-slot:default="scope">
+          <dict-tag :value="scope.row.status" :type="DICT_TYPE.ORDER_STATUS" ></dict-tag>
+        </template>
+      </el-table-column>
+      <el-table-column label="操作人"></el-table-column>
+      <el-table-column label="操作时间" prop="createTime"></el-table-column>
+      <el-table-column label="操作">
+        <template v-slot:default='scope'>
+          <el-button type="text"  @click ="guanlianOrderByOrderId(scope.row.orderId)">
+            移出
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+  </div>
+</template>
+
+<script>
+//关联订单
+import ordeDetailsForm from "@/views/ecw/order/components/ordeDetailsForm";
+import {getOrder} from "@/api/ecw/order";
+import {
+  deleteBatchGuanlianOrderByOrderId,
+  deleteGuanlianOrderByOrderId,
+  guanlianList,
+} from "@/api/ecw/mutexOrder";
+import {getDictDatas,DICT_TYPE} from '@/utils/dict'
+export default {
+  name: "mutexOrder",
+  props:{
+    orderId:[String,Boolean]
+  },
+  components:{
+    ordeDetailsForm
+  },
+  data(){
+    return {
+      orderDetails:{},
+      params:{
+        orderId:undefined,
+        mutualOrderId:undefined
+      },
+      list:[],
+      DICT_TYPE,
+      getDictDatas,
+      multipleSelection:[]
+    }
+  },
+  created() {
+    this.params.orderId = this.orderId;
+    this.getList();
+    getOrder(this.orderId).then( r =>{
+      if(r.code === 0){
+        this.orderDetails = r.data;
+      }
+    })
+  },
+  methods:{
+    getList(){
+      guanlianList(this.params).then(r => {
+        if(r.code === 0){
+          this.list = r.data
+        }
+      })
+    },
+    guanlianOrderByOrderId(id){
+      deleteGuanlianOrderByOrderId({orderId:this.orderId,mutualOrderId:id}).then(r =>{
+        if(r.code === 0){
+          this.getList()
+          this.$message.success('操作成功');
+        }
+      })
+    },
+    batchGuanlianOrderByOrderId(val){
+      deleteBatchGuanlianOrderByOrderId(val).then(r => {
+        this.getList()
+        this.$message.success('操作成功');
+        this.multipleSelection = []
+      })
+    },
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    }
+  },
+
+}
+</script>
+
+<style scoped lang="scss">
+.associated-order{
+  padding: 20px;
+  box-sizing: border-box;
+  .title{
+    font-size: 30px;
+    font-weight: 600;
+  }
+}
+</style>

src/views/ecw/order/notMutexOrder.vue

+<template>
+  <div class="add-associated-order">
+    <h1 class="title">订单号：{{ orderDetails.orderNo }} 选择订单</h1>
+    <el-divider></el-divider>
+    <el-form inline label-width="85px" label-position="left">
+      <el-form-item label="订单号">
+        <div class="content">
+          <el-input v-model="mutualOrderId"></el-input>
+        </div>
+      </el-form-item>
+      <el-form-item>
+        <el-button @click="getUnassociatedOrder">查询</el-button>
+      </el-form-item>
+    </el-form>
+    <h1 class="title">
+      未加入关联订单列表
+    </h1>
+    <el-divider></el-divider>
+    <el-table :data="list" @selection-change="handleSelectionChange">
+      <el-table-column
+        type="selection"
+        width="55"
+      ></el-table-column>
+      <el-table-column label="序号" type="index"></el-table-column>
+      <el-table-column label="订单号" prop="orderNo"></el-table-column>
+      <el-table-column label="唛头" prop="marks"></el-table-column>
+      <el-table-column label="货物数据"></el-table-column>
+      <el-table-column label="入仓时间" prop="rucangtime"></el-table-column>
+      <el-table-column label="状态">
+        <template v-slot:default="scope">
+          <dict-tag :value="scope.row.status" :type="DICT_TYPE.ORDER_STATUS"></dict-tag>
+        </template>
+      </el-table-column>
+      <el-table-column label="操作人"></el-table-column>
+      <el-table-column label="操作时间"></el-table-column>
+      <el-table-column label="操作">
+        <template v-slot:default="scope">
+          <el-button type="text" size="mini" @click="joinAssociation(scope.row.orderId)">加入互斥</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    <el-row style="margin-top: 40px">
+      <el-col>
+        <el-button type="primary" @click="batchJoin(multipleSelection.map(e => e.orderId))"
+                   :disabled="multipleSelection.length === 0">
+          批量加入互斥
+        </el-button>
+        <el-button @click="$router.push('/order/mutex-order/'+ orderId);">
+          取消
+        </el-button>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+//添加关联订单
+import {getOrder} from "@/api/ecw/order";
+import Template from "@/views/cms/template";
+import {getUnGuanlianOrderByOrderId, guanlianCreate, ordeRcreateBatch} from "@/api/ecw/mutexOrder";
+
+export default {
+  name: "notMutexOrder",
+  components: {Template},
+  props: {
+    orderId: [String, Number]
+  },
+  data() {
+    return {
+      orderDetails: {},
+      mutualOrderId: '',
+      list: [],
+      multipleSelection: [],
+    }
+  },
+  created() {
+    getOrder(this.orderId).then(r => {
+      if (r.code === 0) {
+        this.orderDetails = r.data;
+      }
+    })
+    this.getUnassociatedOrder();
+  },
+  mounted() {
+  },
+  methods: {
+    getUnassociatedOrder() {
+      getUnGuanlianOrderByOrderId({
+        orderId: this.orderId,
+        mutualOrderId: this.mutualOrderId ? this.mutualOrderId : 0
+      }).then(r => {
+        if (r.code === 0) {
+          this.list = r.data
+        }
+      })
+    },
+    joinAssociation(val) {
+      guanlianCreate({orderId: this.orderId, mutualOrderId: val}).then(this.operation)
+    },
+    batchJoin(val) {
+      let p = val.map(e => ({orderId:this.orderId,mutualOrderId:e}))
+      ordeRcreateBatch(p).then(this.operation)
+    },
+    operation(r) {
+      if (r.code === 0) {
+        this.$message.success('操作成功')
+        this.getUnassociatedOrder();
+      }
+    },
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.add-associated-order {
+  padding: 20px;
+  box-sizing: border-box;
+
+  .title {
+    font-size: 30px;
+    font-weight: 600;
+    text-align: left;
+  }
+
+  .el-form {
+    .content {
+      width: 300px;
+    }
+  }
+}
+</style>