财务2.4 暂存-2

src/views/financialManagement/components/permissionQyDia.vue

@@ -0,0 +1,196 @@
+
+<script setup>
+  
+import {getPermissionList} from '@/api/crm'
+  const props=defineProps({
+    visible:{
+      type:Boolean,
+      default:false
+    },
+    hasCheckedPermission:{
+      type:Array,
+      default:()=>[]
+    },
+    // view - 查看 edit - 编辑
+    type:{
+      type:String,
+      default:'view'
+    },
+    // 1-权益大套餐 2-行业套餐
+    serviceType:{
+      type:Number,
+      default:1
+    }
+  })
+
+  const emits=defineEmits(['update:visible','selectFinish'])
+
+  const permissionDia=reactive({
+    permissionList:[{industryServiceId:1,industryServiceName:'医药',checked:false,check_list:[],
+    children:[{subServiceId:11,subServiceIdName:'主观',checked:false},{subServiceId:111,subServiceIdName:'客观',checked:false}]},
+    {industryServiceId:2,industryServiceName:'消费',checked:false,check_list:[],
+    children:[{subServiceId:22,subServiceIdName:'主观',checked:false},{subServiceId:222,subServiceIdName:'客观',checked:false}]},
+    {industryServiceId:3,industryServiceName:'科技',checked:false,check_list:[],
+    children:[{subServiceId:33,subServiceIdName:'主观',checked:false},{subServiceId:333,subServiceIdName:'客观',checked:false}]},
+    {industryServiceId:4,industryServiceName:'智造',checked:false,check_list:[],
+    children:[{subServiceId:44,subServiceIdName:'主观',checked:false},{subServiceId:444,subServiceIdName:'客观',checked:false}]},
+    {industryServiceId:5,industryServiceName:'策略',checked:false,check_list:[],
+    children:[{subServiceId:55,subServiceIdName:'策略',checked:false}]}],
+    permissionChecked:[],
+    qyBigService:''
+  })
+
+  watch(()=>props.visible,(newVal)=>{
+    // console.log(newVal);
+    if(newVal){
+      // 初始化
+      if(props.serviceType==1){
+        permissionDia.qyBigService=props.hasCheckedPermission[0]
+      }else{
+        // console.log(permissionDia.permissionChecked);
+        permissionDia.permissionList.length>0&&permissionDia.permissionList.map(item=>{
+          item.check_list = [];
+          item.checked = false;
+          item.indeterminate = false;
+          item.Items?.map(it => {
+            it.checked=false
+          })
+        })
+        permissionDia.permissionChecked=[...props.hasCheckedPermission]
+        U:for (let i = 0,len=permissionDia.permissionChecked.length; i < len; i++) {
+          const permission_id = +permissionDia.permissionChecked[i];
+          for (let j = 0,jLen=permissionDia.permissionList.length; j < jLen; j++) {
+            const element = permissionDia.permissionList[j];
+            let index=element.children.findIndex(it => it.subServiceId==permission_id)
+            // console.log(index);
+            if(index!=-1){
+              element.children[index].checked=true
+              element.check_list.push(permission_id)
+              continue U
+            }
+          }
+        }
+        permissionDia.permissionList.map(item=>{
+          permissionCheckedChange(item)
+        })
+      }
+    }
+  },{immediately:true})
+
+  // -------method
+  const getPermissionData=()=>{
+    // 获得所有的权限
+    getPermissionList().then(res=>{
+      let arr = res.data.List || []
+      arr.forEach((item) => {
+        item.check_list = [];
+        item.checked = false;
+        item.indeterminate = false;
+      });
+      permissionDia.permissionList=arr
+    })
+  }
+  const permissionCheckedChange=(e)=>{
+    e.checked = e.check_list.length == e.children.length
+    e.indeterminate = e.check_list.length>0 && e.check_list.length < e.children.length
+  }
+  const permissionAllChecked=(e)=>{
+    // console.log(e);
+    let arr = e.children.map((item) => {
+      return item.subServiceId;
+    });
+    e.check_list = e.checked ? arr : [];
+    e.indeterminate = false;
+  }
+ 
+  const submit=()=>{
+    permissionDia.permissionList.map(item =>{
+      permissionDia.permissionChecked=[...permissionDia.permissionChecked,...item.check_list]
+    })
+    emits('selectFinish',props.serviceType==1?[permissionDia.qyBigService]: permissionDia.permissionChecked)
+    closeDia()
+  }
+
+  const closeDia=()=>{
+    emits('update:visible',false)
+  }
+
+  // --------------created
+  // getPermissionData()
+</script>
+
+<template>
+  <div id="permission-qy-container">
+    <el-dialog title="选择品种" :model-value="props.visible"
+    :close-on-click-modal="false" width="360" @close="closeDia">
+      <div class="variety-big-box" v-show='props.serviceType==1'>
+        <el-radio model-value="权益大套餐" label="权益大套餐" :disabled="props.type=='view'">
+          <span class="first-level">权益大套餐：</span>
+        </el-radio>
+        <el-radio-group v-model="permissionDia.qyBigService" :disabled="props.type=='view'">
+          <el-radio label="1" >70万</el-radio>
+          <el-radio label="2" >45万</el-radio>
+        </el-radio-group>
+      </div>
+      <div class="variety-small-box" v-show='props.serviceType==2'>
+        <div v-for="item in permissionDia.permissionList" class="variety-item" :key="item.industryServiceId" >
+          <el-checkbox v-model="item.checked" :indeterminate="item.check_list.length>0 && item.check_list.length < item.children.length" 
+            @change="permissionAllChecked(item)" :disabled="props.type=='view'">
+            <span class="first-level">{{item.industryServiceName}}：</span>
+          </el-checkbox>
+          <el-checkbox-group v-model="item.check_list" @change="permissionCheckedChange(item)" :disabled="props.type=='view'">
+            <el-checkbox :label="it.subServiceId" v-for="it in item.children" :key="it.subServiceId">{{it.subServiceIdName}}</el-checkbox>
+          </el-checkbox-group>
+        </div>
+      </div>
+      <template #footer v-if="props.type!='view'">
+        <div class="permission-buttons-zone">
+          <el-button @click="closeDia" style="background-color: #F5F7FA;border:none;color:var(--mainTextColor) ;">取消</el-button>
+          <el-button type="primary" @click="submit" style="color: white;margin-left: 30px;">保存</el-button>
+        </div>
+      </template> 
+    </el-dialog>
+  </div>
+</template>
+  
+  
+<style lang="scss" scoped>
+    .variety-big-box{
+      margin-right: -20px;
+      display: flex;
+      justify-content: center;
+    }
+    .variety-small-box{
+      // display: flex;
+      // justify-content: center;
+      // flex-wrap: wrap;
+      padding-left: 56px;
+      .variety-item{
+        display:flex;
+        justify-content: start;
+        margin: 0 auto;
+      }
+    }
+    .first-level{
+      font-weight: bold;
+    }
+    .permission-buttons-zone{
+      padding-bottom: 20px;
+    }
+</style>
+<style lang="scss">
+  #permission-qy-container{
+    .el-checkbox{
+      margin-right: 22px;
+    }
+    // .el-checkbox-group{
+    //   margin-right:-22px ;
+      // .el-checkbox{
+      //   margin-right: 22px;
+      // }
+    // }
+    .el-radio{
+      margin-right: 20px;
+    }
+  }
+</style>

src/views/financialManagement/contractProgress.vue

@@ -1,6 +1,7 @@
 
 <script setup>
   import permissionDia from './components/permissionDia.vue'
+  import permissionQyDia from './components/permissionQyDia.vue'
   import {useRouter,useRoute} from 'vue-router'
   import {useStore} from 'vuex'
   import {ElMessage} from 'element-plus'
@@ -62,6 +63,9 @@
       sign_date:'',
       agreed_pay_time:'',
       services:[],
+      services_amount:'',
+      servicesQy:[],
+      services_Qy_amount:'',
       service_remark:'',
       remark:""
     },
@@ -115,20 +119,38 @@
     contractNoTotal:0,
     contractNoLoading:false,
     // --------------套餐信息
-    // // 选中的套餐
+    showServiceFicc:true,
+    showServiceQy:true,
+    // 选中的套餐 - ficc
     checkedService:[],
-    // //套餐列表
+    // 选中的套餐 - 权益
+    checkedServiceQy:[],
+    // 套餐列表
     serviceArray:[],
+    // 套餐列表 - 权益
+    serviceArrayQy:[{service_template_id:33,title:'权益大套餐'},{service_template_id:35,title:'行业套餐'},
+    {service_template_id:36,title:'研选'},{service_template_id:37,title:'路演'},{service_template_id:38,title:'一对一专家'},{service_template_id:39,title:'行业数据跟踪'},
+    {service_template_id:40,title:'专家套餐'}],
     // 小套餐选中的品种
     checkedPermission:[],
+    // 权益大套餐选中的品种
+    checkedPermissionQyBig:[],
+    // 行业套餐选中的品种
+    checkedPermissionQySmall:[],
     // 查看套餐弹窗
     serviceShow:false,
     // 显示选择品种 - FICC小套餐
     serviceVarietyShow:false,
     // 1-大套餐  2-小套餐
     serviceType:0,
-    // 品种选择
+    // 权益套餐 1、权益大套餐 2、行业套餐
+    serviceTypeQy:0,
+    // 品种选择 - Ficc
     varietyDiaShow:false,
+    //品种选择 - Qy
+    varietyDiaShowQy:false,
+    // 1 - 权益大套餐 2-行业套餐 
+    qYDiaType:1,
     varietyDiaType:'view',
     // -----------------登记进度
     progressList:[],
@@ -157,6 +179,7 @@
   const invoiceForm=reactive({
     invoiceData:[
       {
+        service_type:'',
         origin_amount:'',
         amount:'',
         invoice_date:'',
@@ -173,6 +196,7 @@
   const placementForm=reactive({
     placementData:[
       {
+        service_type:'',
         origin_amount:'',
         amount:'',
         invoice_date:'',
@@ -188,12 +212,114 @@
   const haveGetCurrencyList=ref(false)
   const rmbRate=ref(1)
 
+  const sellerArray=[{
+    label:'FICC套餐',
+    value:"FICC",
+    children:[{
+      label:'FICC大套餐',
+      value:"FICC大",
+      children:[{
+        label:'宏观',
+        value:"宏观",
+      },{
+        label:'利率债',
+        value:"利率债",
+      }]
+    },
+    {
+      label:'FICC小套餐',
+      value:"FICC小",
+      children:[{
+        label:'石油',
+        value:"原油",
+      },{
+        label:'铁矿',
+        value:"铜矿",
+      }]
+    }]
+  },
+  {
+    label:'权益套餐',
+    value:"权益套餐",
+    children:[{
+      label:'医药',
+      value:"医药",
+      children:[{
+        label:'医药主观',
+        value:"医药主观",
+      },{
+        label:'医药客观',
+        value:"医药客观",
+      }]
+    },
+    {
+      label:'消费',
+      value:"消费",
+      children:[{
+        label:'消费主观',
+        value:"消费主观",
+      },{
+        label:'消费客观',
+        value:"消费客观",
+      }]
+    }]
+  }]
+  const sellerChange=(value)=>{
+    // console.log(value);
+    let ficcSeller,qySeller;
+    if(value?.length>0){
+      for (let i = 0; i < value.length; i++) {
+        const element = value[i];
+        if(element[0]=='FICC'){
+          ficcSeller = element[2]
+        }else{
+          qySeller = element[2]
+        }
+      }
+      contractInfo.form.seller_id=[ficcSeller,qySeller]
+      // 根据销售选择是否显示套餐
+      if(ficcSeller && qySeller){
+        // 都有
+        contractInfo.showServiceFicc=true
+        contractInfo.showServiceQy=true
+        contractInfo.form.services_amount = contractInfo.form.services_Qy_amount = ''
+      }else if(!ficcSeller){
+        // 没有ficc销售
+        contractInfo.showServiceFicc=false
+        contractInfo.showServiceQy=true
+        contractInfo.form.services_Qy_amount = contractInfo.form.contract_amount
+        contractInfo.form.services_amount =''
+      }else{
+        // 没有权益销售
+        contractInfo.showServiceFicc=true
+        contractInfo.showServiceQy=false
+        contractInfo.form.services_amount = contractInfo.form.contract_amount
+        contractInfo.form.services_Qy_amount =''
+      }
+    }else{
+      contractInfo.showServiceFicc = contractInfo.showServiceQy=true
+      contractInfo.form.services_amount = contractInfo.form.services_Qy_amount = ''
+      contractInfo.form.seller_id=[]
+    }
+  }
+
+  const selectVisible=(value,service_type,that,selectRef)=>{
+    console.log(value,service_type,that.$refs[selectRef],selectRef);
+    if(value && !service_type){
+      ElMessage.warning('请选择套餐类型')
+      that.$refs[selectRef].blur()
+    }
+  }
+
   // 查看套餐报价单 图片
   const previewImage=ref('')
   // 查看套餐报价单 标题
   const previewImageTitle=ref('')
   // 是否是新公司的复选框勾选判断
   let is_new_company=ref(false)
+  // 合同套餐 - 1-ficc 2-权益 3-ficc+权益
+  const contractServiceType=ref(3)
+
 
 // -----------------------------监听
   // 已开票金额
@@ -215,6 +341,17 @@
     }
   })
 
+  watch(()=>contractInfo.form.contract_amount,(newVal)=>{
+    if(contractInfo.showServiceFicc && contractInfo.showServiceQy){
+      return 
+    }else if(!contractInfo.showServiceFicc){
+      contractInfo.form.services_Qy_amount = newVal
+    }else{
+      contractInfo.form.services_amount = newVal
+    }
+    
+  })
+
   // -----------------------method
   // 权限验证
   const permissionValidation=()=>{
@@ -305,12 +442,18 @@
       remark:""
     }
     contractInfo.checkedService=[]
-    // 小套餐选中的品种
+    contractInfo.checkedServiceQy=[]
+
     contractInfo.checkedPermission=[]
+    contractInfo.checkedPermissionQyBig=[]
+    contractInfo.checkedPermissionQySmall=[]
     // 1-大套餐  2-小套餐
-    contractInfo.serviceType=0,
-    // 品种选择
+    contractInfo.serviceType=0
+    contractInfo.serviceTypeQy=0
+    // 品种选择 - Ficc
     contractInfo.serviceVarietyShow=false
+    // 品种选择 - Qy
+    contractInfo.serviceVarietyShowQy=false
     contractInfo.contractValidityDate=[]
     setTimeout(()=>{
       // 去除错误信息
@@ -319,37 +462,69 @@
   }
   // 合同类型改变
   const contractTypeChange=(value)=>{
-    // console.log(value);
     if(value!=3){
+      if(value==1){
+        // 新签 -- 新客户
+        contractInfo.form.new_company = 1
+      }else{
+        // 续约、补充 -- 老客户
+        contractInfo.form.new_company = 0
+      }
+
+      if(value!=4){
+        // 新签、续约
+        contractInfo.form.actual_company_name=''
+      }
       contractInfo.form.relate_contract_code=''
     }else{
+      // 代付
       contractInfo.form.has_payment=''
     }
-    if(value!=4 && value!=3){
-      contractInfo.form.actual_company_name=''
-    }
   }
 
   // 服务改变
-  const serciveChange=(value,type,openDia=true)=>{
-    // console.log(value,type);
-    if(type==2){
-      contractInfo.serviceVarietyShow=value
-      contractInfo.varietyDiaType='edit'
-      contractInfo.varietyDiaShow=openDia&&value
+  const serciveChange=(value,type,serviceType='ficc',openDia=true)=>{
+    // console.log(value,type,serviceType);
+    if(serviceType=='ficc'){
+      // ficc套餐修改
+      if(type==2){
+        contractInfo.serviceVarietyShow=value
+        contractInfo.varietyDiaType='edit'
+        contractInfo.varietyDiaShow=openDia&&value
+      }
+      contractInfo.serviceType = value?type:0
+    }else{
+      // 权益套餐修改
+      // if(type==2){
+        contractInfo.serviceVarietyShowQy=value
+        contractInfo.varietyDiaType='edit'
+        contractInfo.varietyDiaShowQy=openDia&&value
+      // }
+      contractInfo.serviceTypeQy = contractInfo.qYDiaType =  value?type:0
     }
-    contractInfo.serviceType = value?type:0
   }
-  // 选择品种
+  // 选择品种 - ficc
   const selectVariety=()=>{
     contractInfo.varietyDiaType='edit'
     contractInfo.varietyDiaShow=true
   }
+  // 选择品种 - 权益
+  const selectVarietyQy=(diaType)=>{
+    contractInfo.varietyDiaType='edit'
+    contractInfo.varietyDiaShowQy=true
+    contractInfo.qYDiaType = diaType
+  }
 
   const getPermissionChecked=(list)=>{
-    console.log(list);
     contractInfo.checkedPermission=list
   }
+
+  const getPermissionQYChecked=(list)=>{
+    console.log(list,'list');
+    if(contractInfo.qYDiaType==1) contractInfo.checkedPermissionQyBig=list
+    else if(contractInfo.qYDiaType==2) contractInfo.checkedPermissionQySmall=list
+  }
+
   // 合同编号远程搜索
   const contractNoSearch=(value)=>{
     if(!value.trim()) return 
@@ -387,11 +562,25 @@
       let hasBigService = contractInfo.form.services.some(item => item.ServiceTemplateId==1)
 
       contractInfo.serviceVarietyShow=!!smallService
+      contractInfo.serviceVarietyShowQy=!!false
       contractInfo.varietyDiaType='edit'
       contractInfo.serviceType = !!smallService?2:hasBigService?1:0
       contractInfo.checkedService=contractInfo.form.services.map(item => item.ServiceTemplateId)
       contractInfo.checkedPermission=smallService?smallService.ChartPermissionIds||[]:[]
     })
+    if(selectItem.ifFicc){
+        contractInfo.sellerList=[{
+          admin_id: 13,
+          admin_name: "时代1",
+          real_name: "时代1"
+        }]
+      }else{
+        contractInfo.sellerList=[{
+          admin_id: 14,
+          admin_name: "时代2",
+          real_name: "时代2"
+        }]
+      }
     contractInfo.form.company_name=selectItem.company_name
     contractInfo.form.crm_contract_id=selectItem.contract_id
     contractInfo.form.start_date=selectItem.start_date
@@ -408,6 +597,10 @@
       'contract_code','company_name','contract_type','seller_id',
       'start_date','contract_amount','relate_contract_code','actual_company_name'
     ])
+  
+    contractInfo.showServiceFicc = selectItem.company_type == 'ficc'
+    contractInfo.showServiceFicc = selectItem.company_type == 'qy'
+
   }
   // 销售选中
   const selectSeller=(value)=>{
@@ -427,7 +620,8 @@
   // 添加行
   const addTableRow=(type)=>{
     if(type=='invoice'){
-      invoiceForm.invoiceData.push({origin_amount:'',amount:'',invoice_date:'',remark:'',seller_id:'',seller_name:'',amountDomType:'text',remarkDomType:'text'})
+      invoiceForm.invoiceData.push({service_type:'',origin_amount:'',amount:'',invoice_date:'',remark:'',
+      seller_id:'',seller_name:'',amountDomType:'text',remarkDomType:'text'})
     }else{
       placementForm.placementData.push({origin_amount:'',amount:'',invoice_date:'',remark:'',amountDomType:'text',remarkDomType:'text'})
     }
@@ -436,7 +630,7 @@
   // 表格添加行
   const addRow=(type,row,index)=>{
     console.log(type,row,index);
-    if(!(row.amount && row.invoice_date)){
+    if(!(row.amount && row.invoice_date && row.service_type)){
       ElMessage.error('请填写完整信息')
       return
     }
@@ -446,7 +640,7 @@
         return
       }
       invoiceForm.invoiceData.splice((index+1),0,
-      {origin_amount:'',amount:'',invoice_date:'',remark:'',seller_id:'',seller_name:'',amountDomType:'text',remarkDomType:'text'})
+      {service_type:'',origin_amount:'',amount:'',invoice_date:'',remark:'',seller_id:'',seller_name:'',amountDomType:'text',remarkDomType:'text'})
     }else{
       placementForm.placementData.splice((index+1),0,{origin_amount:'',amount:'',invoice_date:'',remark:'',amountDomType:'text',remarkDomType:'text'})
     }
@@ -464,7 +658,8 @@
       tempArr=placementForm.placementData
       word='到款'
     }
-    if(tempArr[index].origin_amount=='' && tempArr[index].amount=='' && tempArr[index].invoice_date=='' && !haveSalesman){
+    if(tempArr[index].origin_amount=='' && tempArr[index].amount=='' && tempArr[index].service_type==''
+    && tempArr[index].invoice_date=='' && !haveSalesman){
       // 没有内容 直接删除
       tempArr.splice(index,1)
     }else{
@@ -552,7 +747,7 @@
     contractInfoForm.value.validate(valid=>{
       if(valid){
         if(contractInfo.checkedService.length==0){
-          ElMessage.warning('请选择套餐')
+          ElMessage.warning('请FICC选择套餐')
           return 
         }
         if((!contractInfo.checkedPermission || contractInfo.checkedPermission.length==0) 
@@ -654,10 +849,15 @@
   const registrationCancel=()=>{
     router.back()
   }
-  const canServiceShow=(serviceTemplateId)=>{
-    return contractInfo.form.services.find(item => item.service_template_id == serviceTemplateId) && contractInfo.operationtype!='compliance'
+  const canServiceShow=(serviceTemplateId,service_type ='Ficc')=>{
+    if(service_type=='Ficc'){
+      return contractInfo.form.services.find(item => item.service_template_id == serviceTemplateId) && contractInfo.operationtype!='compliance'
+    }else{
+      return contractInfo.form.servicesQy.find(item => item.service_template_id == serviceTemplateId) && contractInfo.operationtype!='compliance'
+    }
+    
   }
-  // 查看套餐
+  // 查看套餐 - ficc
   const viewService=(serviceTemplateId)=>{
     if(!canServiceShow(serviceTemplateId)) return 
     if(serviceTemplateId==2){
@@ -671,6 +871,14 @@
     contractInfo.serviceShow=true
   }
 
+  // 查看套餐 - 权益
+  const viewServiceQy=(serviceTemplateId,diaType)=>{
+    if(!canServiceShow(serviceTemplateId,'Qy')) return 
+    contractInfo.varietyDiaShowQy=true
+    contractInfo.qYDiaType = diaType
+    contractInfo.varietyDiaType='view'
+  }
+
   const isNewChange=(value)=>{
     contractInfo.form.new_company = value?1:0
     // console.log(contractInfo.form);
@@ -777,6 +985,20 @@
         remark:res.data.remark,
         contract_source:res.data.contract_source,
       }
+      // contractServiceType.value=res.data.ifFicc
+      if(res.data.ifFicc){
+        contractInfo.sellerList=[{
+          admin_id: 13,
+          admin_name: "时代1",
+          real_name: "时代1"
+        }]
+      }else{
+        contractInfo.sellerList=[{
+          admin_id: 14,
+          admin_name: "时代2",
+          real_name: "时代2"
+        }]
+      }
       rmbRate.value=res.data.rmb_rate
       console.log(rmbRate.value,res.data.rmb_rate);
       if(haveGetCurrencyList.value){
@@ -812,7 +1034,7 @@
       contractInfo.checkedService=res.data.service_list.map(item => {
         let serviceId=item.service_template_id
         // 大套餐或者小套餐
-        if(serviceId==1 || serviceId==2) serciveChange(true,serviceId,false)
+        if(serviceId==1 || serviceId==2) serciveChange(true,serviceId,'ficc',false)
         return serviceId
       })
       // 开票
@@ -824,6 +1046,7 @@
         res.data.invoice_list.map(item=>{
           invoiceForm.invoiceData.push({
             invoice_id:item.contract_invoice_id,
+            service_type:item.service_type,
             origin_amount:item.origin_amount,
             amount:item.amount,
             invoice_date:item.invoice_time,
@@ -834,7 +1057,8 @@
         })
         // 添加一行空的
         if(contractInfo.operationtype=='invoice'){
-          invoiceForm.invoiceData.push({                   
+          invoiceForm.invoiceData.push({
+            service_type:'',              
             origin_amount:'',
             amount:'',
             invoice_date:'',
@@ -913,12 +1137,18 @@
                         <el-input v-model="contractInfo.form.company_name"
                         placeholder="请输入客户名称" />
                         <el-checkbox v-model="is_new_company" label="新客户" style="margin-left: 20px;min-width: 100px;"
-                        size="large" @change="isNewChange" />
+                        size="large" @change="isNewChange" :disabled="contractInfo.form.contract_type!='' && contractInfo.form.contract_type!=3 "  />
                       </el-form-item>
                       <el-form-item label="销售" prop="seller_id">
-                        <el-select v-model="contractInfo.form.seller_id" placeholder="请选择销售" filterable @change="selectSeller">
+                        <el-select v-if="contractInfo.form.contract_source==1" v-model="contractInfo.form.seller_id" placeholder="请选择销售" 
+                        filterable @change="selectSeller" >
                           <el-option :label="item.real_name" :value="item.admin_id" v-for="item in contractInfo.sellerList" :key="item.admin_id"></el-option>
                         </el-select>
+                        <el-cascader v-else filterable :options="sellerArray" placeholder="请选择销售" @change="sellerChange"
+                          clearable :show-all-levels="false" v-model="contractInfo.form.seller_id"
+                          :props="{multiple:true,label:'label',value:'value',children:'children'}"
+                          key="seller" >
+                        </el-cascader>
                       </el-form-item>
                       <el-form-item label="合同金额" id="contractInfo-contractAmount"
                       prop="contract_amount">
@@ -978,36 +1208,67 @@
                 </div>
                 <div class="info-row">
                   <div class="info-row-title" >套餐信息</div>
-                  <el-checkbox-group :disabled="contractInfo.operationtype!='compliance'"
-                  v-model="contractInfo.checkedService" class="info-service-box" id="service-information">
-                    <!-- 大套餐 -->
-                    <el-checkbox :label="contractInfo.serviceArray[0]?.service_template_id" @change="(e) => serciveChange(e,1)" 
-                      :class="{'viewService':canServiceShow(contractInfo.serviceArray[0]?.service_template_id)}"
-                    :disabled="contractInfo.serviceType==2" @click="viewService(contractInfo.serviceArray[0]?.service_template_id)">
-                      {{contractInfo.serviceArray[0]?.title}}
-                    </el-checkbox>
-                    <!-- 小套餐 -->
-                    <div class="service-small">
-                      <el-checkbox :label="contractInfo.serviceArray[1]?.service_template_id" style="margin-right: 0;"
-                      @change="(e) => serciveChange(e,2)" 
-                        :class="{'viewService':canServiceShow(contractInfo.serviceArray[1]?.service_template_id)}"
-                        :disabled="contractInfo.serviceType==1" @click="viewService(contractInfo.serviceArray[1]?.service_template_id)">
-                        {{contractInfo.serviceArray[1]?.title}}
+                  <div class="info-row-services" v-if="contractInfo.showServiceFicc">
+                    <div class="info-row-services-header" id="info-row-services-header">
+                      <span>FICC套餐</span>
+                      <el-input v-model="contractInfo.form.services_amount" placeholder="请输入套餐金额" style="width: 200px;" />
+                    </div>
+                      <el-checkbox-group :disabled="contractInfo.operationtype!='compliance'"
+                    v-model="contractInfo.checkedService" class="info-service-box" id="service-information">
+                      <!-- 大套餐 -->
+                      <el-checkbox :label="contractInfo.serviceArray[0]?.service_template_id" @change="(e) => serciveChange(e,1)" 
+                        :class="{'viewService':canServiceShow(contractInfo.serviceArray[0]?.service_template_id)}"
+                      :disabled="contractInfo.serviceType==2" @click="viewService(contractInfo.serviceArray[0]?.service_template_id)">
+                        {{contractInfo.serviceArray[0]?.title}}
+                      </el-checkbox>
+                      <!-- 小套餐 -->
+                      <div class="service-small">
+                        <el-checkbox :label="contractInfo.serviceArray[1]?.service_template_id" style="margin-right: 0;"
+                        @change="(e) => serciveChange(e,2)" 
+                          :class="{'viewService':canServiceShow(contractInfo.serviceArray[1]?.service_template_id)}"
+                          :disabled="contractInfo.serviceType==1" @click="viewService(contractInfo.serviceArray[1]?.service_template_id)">
+                          {{contractInfo.serviceArray[1]?.title}}
+                        </el-checkbox>
+                        <span v-if="(contractInfo.serviceVarietyShow&&contractInfo.operationtype=='compliance')" 
+                        @click="selectVariety">选择品种</span>
+                      </div>
+                      <!-- 市场策略 -->
+                      <el-checkbox :label="contractInfo.serviceArray[2]?.service_template_id"
+                      @click="viewService(contractInfo.serviceArray[2]?.service_template_id)"
+                      :class="{'viewService':canServiceShow(contractInfo.serviceArray[2]?.service_template_id)}">
+                      {{contractInfo.serviceArray[2]?.title}}
+                      </el-checkbox>
+                      <!-- 财富管理类似没有详情的套餐 -->
+                      <el-checkbox v-for="item in contractInfo.serviceArray.slice(3)" :label="item.service_template_id">
+                        {{item.title}}
                       </el-checkbox>
-                      <span v-if="(contractInfo.serviceVarietyShow&&contractInfo.operationtype=='compliance')" 
-                      @click="selectVariety">选择品种</span>
+                    </el-checkbox-group>
+                  </div>
+                  <div class="info-row-services" v-if="contractInfo.showServiceQy">
+                    <div class="info-row-services-header" id="info-row-services-header">
+                      <span>权益套餐</span>
+                      <el-input v-model="contractInfo.form.services_Qy_amount" placeholder="请输入套餐金额" style="width: 200px;" />
                     </div>
-                    <!-- 市场策略 -->
-                    <el-checkbox :label="contractInfo.serviceArray[2]?.service_template_id"
-                    @click="viewService(contractInfo.serviceArray[2]?.service_template_id)"
-                    :class="{'viewService':canServiceShow(contractInfo.serviceArray[2]?.service_template_id)}">
-                    {{contractInfo.serviceArray[2]?.title}}
-                    </el-checkbox>
-                    <!-- 财富管理类似没有详情的套餐 -->
-                    <el-checkbox v-for="item in contractInfo.serviceArray.slice(3)" :label="item.service_template_id">
-                      {{item.title}}
-                    </el-checkbox>
-                  </el-checkbox-group>
+                      <el-checkbox-group :disabled="contractInfo.operationtype!='compliance'"
+                    v-model="contractInfo.checkedServiceQy" class="info-service-box" id="service-information">
+                      <!-- 权益大套餐、行业套餐 -->
+                      <div class="service-small" v-for="(item,index) in [1,2]" :key="item">
+                        <el-checkbox :label="contractInfo.serviceArrayQy[index]?.service_template_id" style="margin-right: 0;"
+                        @change="(e) => serciveChange(e,item,'qy')" 
+                          :class="{'viewService':canServiceShow(contractInfo.serviceArrayQy[index]?.service_template_id,'Qy')}"
+                          :disabled="contractInfo.serviceTypeQy!=0 && contractInfo.serviceTypeQy != item" 
+                          @click="viewServiceQy(contractInfo.serviceArrayQy[index]?.service_template_id,item)">
+                          {{contractInfo.serviceArrayQy[index]?.title}}
+                        </el-checkbox>
+                        <span v-if="(contractInfo.serviceVarietyShowQy&&contractInfo.qYDiaType==item&&contractInfo.operationtype=='compliance')" 
+                        @click="selectVarietyQy(item)">选择品种</span>
+                      </div>
+                      <!-- 非行业套餐 -->
+                      <el-checkbox v-for="item in contractInfo.serviceArrayQy.slice(2)" :label="item.service_template_id">
+                        {{item.title}}
+                      </el-checkbox>
+                    </el-checkbox-group>
+                  </div>
                   <div class="remark info-service-remark">
                     <span style="white-space: nowrap;font-size: 14px;margin-right: 20px;">套餐备注</span>
                     <el-input style="flex-grow: 1;" :disabled="contractInfo.operationtype!='compliance'"
@@ -1061,12 +1322,28 @@
                     </div>
                     <el-form ref="invoiceFormRef" :model="invoiceForm" :disabled="contractInfo.operationtype!='invoice'">
                       <el-table :data="invoiceForm.invoiceData" border v-if="invoiceForm.invoiceData.length>0" style="width: 100%;"> 
-                        <el-table-column label="序号" width="50" align="center">
+                        <el-table-column label="序号" width="80" align="center">
                           <template #default="{row,$index}">
                             {{$index+1}}
                           </template>
                         </el-table-column>
-                        <el-table-column label="开票金额" width="150" show-overflow-tooltip  align="center" prop="origin_amount">
+                        <el-table-column label="套餐类型" width="160" align="center" prop="service_type" v-if="contractServiceType==3">
+                          <template #header>
+                            <span style="color: var(--dangerColor);">*</span>套餐类型
+                          </template>
+                          <template #default="{row,$index}">
+                            <el-form-item :prop="`invoiceData.${$index}.service_type`" :show-message="false" v-if="!row.invoice_id"
+                            :rules="{required:true,message:()=>{ ElMessage.error('套餐类型不能为空')},trigger:'change'}">
+                              <el-select v-model="row.service_type" style="width: 124px;"
+                              placeholder="请选择套餐" filterable>
+                                <el-option label="FICC套餐" :value="1"></el-option>
+                                <el-option label="权益套餐" :value="2"></el-option>
+                              </el-select>
+                            </el-form-item>
+                            <span v-else>{{ row.service_type || '--' }}</span>
+                          </template>
+                        </el-table-column>
+                        <el-table-column label="开票金额" width="160" show-overflow-tooltip  align="center" prop="origin_amount">
                           <template #header>
                             <span style="color: var(--dangerColor);">*</span>开票金额
                           </template>
@@ -1085,13 +1362,13 @@
                             <span  v-else>{{ row.origin_amount.toFixed(2)}}</span>
                           </template>
                         </el-table-column>
-                        <el-table-column label="换算金额（元）" show-overflow-tooltip width="200" align="center" prop="amount">
+                        <el-table-column label="换算金额（元）" show-overflow-tooltip width="160" align="center" prop="amount">
                           <template #default="{row,$index}">
                             <span v-if="row.amount">{{ row.amount.toFixed(2)}}</span>
-                            <span v-else style="color: var(--hitTextColorOne);">开票金额为空不可换算</span>
+                            <span v-else style="color: var(--hitTextColorOne);">开票金额为空</span>
                           </template>
                         </el-table-column>
-                        <el-table-column label="开票日" width="150" align="center" prop="invoice_date">
+                        <el-table-column label="开票日" width="120" align="center" prop="invoice_date">
                           <template #header>
                             <span style="color: var(--dangerColor);">*</span>开票日
                           </template>
@@ -1104,15 +1381,15 @@
                             <span v-else>{{ row.invoice_date }}</span>
                           </template>
                         </el-table-column >
-                        <el-table-column label="销售" width="150" align="center" prop="seller_id">
+                        <el-table-column label="销售" width="120" align="center" prop="seller_id">
                           <template #header>
                             <span style="color: var(--dangerColor);">*</span>销售
                           </template>
                           <template #default="{row,$index}">
                             <el-form-item :prop="`invoiceData.${$index}.seller_id`" :show-message="false" v-if="!row.invoice_id"
                             :rules="{required:true,message:()=>{ ElMessage.error('销售不能为空')},trigger:'change'}">
-                              <el-select v-model="row.seller_id" style="width: 124px;"
-                              placeholder="请选择销售" filterable>
+                              <el-select v-model="row.seller_id" style="width: 124px;" :ref='`invoiceData-service_type${$index}`'
+                              placeholder="请选择销售" filterable @visible-change="(value)=>selectVisible(value,row.service_type,this,`invoiceData-service_type${$index}`)">
                                 <el-option :label="item.real_name" :value="item.admin_id" 
                                 v-for="item in contractInfo.sellerList" :key="item.admin_id">
                                 </el-option>
@@ -1121,7 +1398,7 @@
                             <span v-else>{{ row.seller_name || '--' }}</span>
                           </template>
                         </el-table-column>
-                        <el-table-column label="备注" width="150" align="center" prop="remark" show-overflow-tooltip >
+                        <el-table-column label="备注" width="160" align="center" prop="remark" show-overflow-tooltip >
                           <template #default="{row,$index}">
                             <el-form-item  v-if="!row.invoice_id">             
                               <label :for="'invoice'+$index+'remark'" style="cursor: pointer;" v-show="row.remarkDomType=='text'" 
@@ -1133,9 +1410,10 @@
                             <span v-else>{{row.remark || '--'}}</span>
                           </template>
                         </el-table-column>
-                        <el-table-column label="操作" width="140" align="center" v-if="contractInfo.operationtype=='invoice'">
-                          <template #default="{row,$index}" >
-                            <span class="table-operation-button" @click="addRow('invoice',row,$index)" style="margin-right: 10px;">添加</span>
+                        <el-table-column label="操作" width="120" align="center" v-if="contractInfo.operationtype=='invoice'">
+                          <template #default="{row,$index,column}" >
+                            <span class="table-operation-button" v-show="$index==invoiceForm.invoiceData.length-1" 
+                            @click="addRow('invoice',row,$index)" style="margin-right: 10px;">添加</span>
                             <span class="table-operation-button" style="color: var(--dangerColor);" 
                             @click="deleteRow('invoice',$index)">删除</span>
                           </template>
@@ -1259,7 +1537,7 @@
         <div class="contract-operation-zone" 
         v-if="contractInfo.operationtype=='placement' || contractInfo.operationtype=='invoice' || contractInfo.operationtype=='compliance'">
           <el-button class="element-common-button" size="large" style="margin-right: 30px;" @click="registrationCancel">取消</el-button>
-          <el-button type="primary" @click="submit" class="operation-button">保存</el-button>
+          <el-button type="primary" @click="submit" style="margin-left: 0;" class="operation-button">保存</el-button>
         </div>
         <div class="contract-progress-zone" 
         :style="{height:(contractInfo.operationtype=='placement' || 
@@ -1293,6 +1571,10 @@
       <!-- 小套餐选择品种弹窗 -->
       <permission-dia v-model:visible="contractInfo.varietyDiaShow" :type="contractInfo.varietyDiaType"
       @selectFinish="getPermissionChecked" :hasCheckedPermission="contractInfo.checkedPermission"></permission-dia>
+      <!-- 权益大套餐、行业套餐选择品种弹窗 -->
+      <permission-qy-dia v-model:visible="contractInfo.varietyDiaShowQy" :type="contractInfo.varietyDiaType" :serviceType="contractInfo.qYDiaType"
+      @selectFinish="getPermissionQYChecked" 
+      :hasCheckedPermission="contractInfo.qYDiaType==1?contractInfo.checkedPermissionQyBig:contractInfo.checkedPermissionQySmall"></permission-qy-dia>
       <!-- 查看套餐弹窗 -->
       <el-dialog v-model="contractInfo.serviceShow" style="min-width: 800px;" title="" width="70vw" top="5vh">
         <template #header>
@@ -1356,7 +1638,7 @@
                   font-weight: bold;
                   padding-left: 16px;
                   position: relative;
-                  margin-bottom: 24px;
+                  // margin-bottom: 24px;
                   &::after{
                     content: '';
                     height: 22px;
@@ -1367,6 +1649,24 @@
                     left: 0;
                   }
                 }
+                .info-row-services{
+                  min-width: 560px;
+                  padding-left: 80px;
+                  margin-top: 30px;
+                  .info-row-services-header{
+                    display: flex;
+                    align-items: center;
+                    margin-bottom: 20px;
+                    span{
+                      white-space: nowrap;
+                      font-weight: bold;
+                      font-size: 14px;
+                      color: $mainTextColor;
+                      margin-right: 20px;
+                    }
+                  }
+                }
+
                 .contractInfo-form{
                   display: flex;
                   flex-wrap: wrap;
@@ -1374,10 +1674,10 @@
                 }
                 // 套餐信息
                 .info-service-box{
-                  min-width: 560px;
-                  // width: 560px;
-                  padding-left: 80px;
-                  margin-top: 20px;
+                  // min-width: 560px;
+                  // // width: 560px;
+                  // padding-left: 80px;
+                  // margin-top: 20px;
                   margin-right: -40px;
                   display: flex;
                   align-items: center;
@@ -1448,21 +1748,21 @@
         }
       }
       .contract-progress-aside{
-        // background-color: white;
-        width: 26vw;
-        min-width: 300px;
+        width: 21vw;
+        min-width: 280px;
       }
     }
     .contract-progress-detail{
-      width: 26vw;
+      width: 21vw;
       position: fixed;
       right: 30px;
       top: 90px;
-      min-width: 300px;
+      min-width:280px;
       height: calc(100vh - 120px);
-      z-index: 2;
+      z-index: 4;
       .contract-operation-zone{
         margin-bottom: 30px;
+        display: flex;
         .operation-button{
           height: 40px;
           width: 130px;
@@ -1478,7 +1778,7 @@
         }
         .progress-box{
           margin-top: 10px;
-          padding:0 20px 20px 70px;
+          padding:0 20px 20px 30px;
           .customize-circle-outside{
             display: flex;
             justify-content: center;
@@ -1554,6 +1854,11 @@
         }
       }
     }
+    #info-row-services-header{
+      .el-input__wrapper{
+        height: 30px;
+      }
+    }
     #service-information{
       .el-checkbox{
         margin-right: 40px;
@@ -1566,7 +1871,7 @@
         }
       }
       .el-input__wrapper{
-        width: 124px;
+        width: 100px;
       }
       .el-form-item{
         margin-bottom: 0;

src/views/financialManagement/financialList.vue

@@ -234,27 +234,27 @@ const statusArray=[{id:1,label:"进行中"},{id:2,label:"已完成"}]
           <!-- 搜索区域 -->
           <div class="financial-search-zone">
             <el-input v-model="financial.searchParams.keyword" placeholder="合同编号/客户姓名/销售/实际使用方" :prefix-icon="Search"
-            style="width: 286px;margin-bottom: 8px;" @input="searchFinancial" clearable />
+            style="width: 340px;margin-bottom: 8px;" @input="searchFinancial" clearable />
             <el-date-picker v-model="financial.createtime" start-placeholder="登记日期-开始"
-            end-placeholder="登记日期-结束" style="margin-right: 30px;max-width: 286px;margin-bottom: 8px;"
+            end-placeholder="登记日期-结束" style="margin-right: 30px;max-width: 240px;margin-bottom: 8px;"
             value-format="YYYY-MM-DD" type="daterange"></el-date-picker>
             <!-- <el-select v-model="financial.searchParams.service_type" placeholder="请选择套餐类型" clearable
             @change="searchFinancial" style="width: 286px;margin-bottom: 8px;">
               <el-option v-for="item in financial.serviceTypeArray" :key="item.service_template_id"
               :label="item.title" :value="item.service_template_id"></el-option>
             </el-select> -->
-            <el-cascader :options="financial.serviceTypeArray" style="width: 286px;margin-bottom: 8px;margin-right: 30px;"
+            <el-cascader :options="financial.serviceTypeArray" style="width: 240px;margin-bottom: 8px;margin-right: 30px;"
              v-model="financial.searchParams.service_type" @change="serviceTypeChange" 
              placeholder="请选择套餐" clearable collapse-tags :show-all-levels="false"
             :props="{multiple:true,label:'label',value:'value',children:'children',emitPath:false}"
             collapse-tags-tooltip>
             </el-cascader>
             <el-select v-model="financial.searchParams.contract_type" placeholder="请选择合同类型" clearable
-            @change="searchFinancial" style="width: 286px;margin-bottom: 8px;">
+            @change="searchFinancial" style="width: 240px;margin-bottom: 8px;">
               <el-option :label="item.label" :value="item.id" v-for="item in contractTypeArray" :key="item.id"></el-option>
             </el-select>
             <el-select v-model="financial.searchParams.register_status" placeholder="请选择登记状态" clearable
-            @change="searchFinancial" style="width: 286px;margin-bottom: 8px;">
+            @change="searchFinancial" style="width: 240px;margin-bottom: 8px;">
               <el-option :label="item.label" :value="item.id" v-for="item in statusArray" :key="item.id"></el-option>
             </el-select>
           </div>