|
|
@@ -0,0 +1,417 @@
|
|
|
+<script setup>
|
|
|
+import { Search } from '@element-plus/icons-vue'
|
|
|
+import {useRouter} from 'vue-router'
|
|
|
+import {getSellerList} from '@/api/crm'
|
|
|
+import {getCurrencyList} from '@/api/common'
|
|
|
+import {getPrePlacementList,prePlacementAdd,prePlacementEdit,prePlacementDelete} from '@/api/financialMana'
|
|
|
+
|
|
|
+
|
|
|
+const router = useRouter()
|
|
|
+
|
|
|
+ const placemenetPre=reactive({
|
|
|
+ searchParams:{
|
|
|
+ keyword:'',
|
|
|
+ start_date:'',
|
|
|
+ end_date:'',
|
|
|
+ sort_type:'',
|
|
|
+ page_size:10,
|
|
|
+ current:1,
|
|
|
+ },
|
|
|
+ // 创建时间数组
|
|
|
+ createtime:[],
|
|
|
+ tableData:[],
|
|
|
+ total:0,
|
|
|
+ })
|
|
|
+ // 销售列表
|
|
|
+ const sellerList = ref([])
|
|
|
+ // 货币列表
|
|
|
+ const currencyList=ref([])
|
|
|
+
|
|
|
+ // -----------------弹窗
|
|
|
+ const editPreForm=ref(null)
|
|
|
+
|
|
|
+ const dialog=reactive({
|
|
|
+ // 更改合同状态
|
|
|
+ editPreShow:false,
|
|
|
+ title:'',
|
|
|
+ editPreForm:{
|
|
|
+ company_name:'',
|
|
|
+ new_company:0,
|
|
|
+ seller_id:'',
|
|
|
+ seller_name:'',
|
|
|
+ amount:'',
|
|
|
+ currency_unit:'CNY',
|
|
|
+ start_date:'',
|
|
|
+ end_date:'',
|
|
|
+ remark:''
|
|
|
+ },
|
|
|
+ rules:{
|
|
|
+ company_name:{required:true,message:'客户名称不能为空',trigger:'blur'},
|
|
|
+ seller_id:{required:true,message:'销售不能为空',trigger:'change'},
|
|
|
+ amount:[{required:true,message:'到款金额不能为空',trigger:'blur'},
|
|
|
+ {
|
|
|
+ validator:(rule,value,callback)=>{
|
|
|
+ if(!parseFloat(value)){
|
|
|
+ callback(new Error('到款金额格式错误'))
|
|
|
+ }else{
|
|
|
+ callback()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ trigger:'blur'
|
|
|
+ }],
|
|
|
+ start_date:{required:true,message:'约定有效期不能为空',trigger:'change'}
|
|
|
+ },
|
|
|
+ validityDate:[]
|
|
|
+ })
|
|
|
+ // 是否是新公司的复选框勾选判断
|
|
|
+ const is_new_company=ref(false)
|
|
|
+
|
|
|
+ // 监听
|
|
|
+ watch(()=>placemenetPre.createtime,(newVal)=>{
|
|
|
+ console.log(newVal);
|
|
|
+ if(!newVal){
|
|
|
+ placemenetPre.searchParams.start_date=''
|
|
|
+ placemenetPre.searchParams.end_date=''
|
|
|
+ }else{
|
|
|
+ placemenetPre.searchParams.start_date = newVal[0]
|
|
|
+ placemenetPre.searchParams.end_date = newVal[1]
|
|
|
+ }
|
|
|
+ searchPlacementPre()
|
|
|
+ })
|
|
|
+
|
|
|
+ watch(()=>dialog.editPreForm.new_company,(newVal)=>{
|
|
|
+ if(newVal==1){
|
|
|
+ is_new_company.value=true
|
|
|
+ }else{
|
|
|
+ is_new_company.value=false
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+ watch(()=>dialog.validityDate,(newVal)=>{
|
|
|
+ console.log(newVal);
|
|
|
+ if(!newVal){
|
|
|
+ dialog.editPreForm.start_date=''
|
|
|
+ dialog.editPreForm.end_date=''
|
|
|
+ }else{
|
|
|
+ dialog.editPreForm.start_date = newVal[0]
|
|
|
+ dialog.editPreForm.end_date = newVal[1]
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+// --------------------------method
|
|
|
+
|
|
|
+ //获取销售列表
|
|
|
+ const getSellerListFun=()=>{
|
|
|
+ getSellerList().then(res=>{
|
|
|
+ sellerList.value=res.data || []
|
|
|
+ })
|
|
|
+ }
|
|
|
+ // 销售选中
|
|
|
+ const selectSeller=(value)=>{
|
|
|
+ dialog.editPreForm.seller_name=sellerList.value.find(item => item.admin_id==value).real_name
|
|
|
+ }
|
|
|
+
|
|
|
+ // 获取货币列表
|
|
|
+ const getCurrencyListFun=()=>{
|
|
|
+ getCurrencyList().then(res=>{
|
|
|
+ currencyList.value=res.data || []
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ // 预到款登记列表
|
|
|
+ const placementPreList=()=>{
|
|
|
+ getPrePlacementList(placemenetPre.searchParams).then(res=>{
|
|
|
+ placemenetPre.tableData=res.data.list || []
|
|
|
+ placemenetPre.total=res.data.page?.total || 0
|
|
|
+ console.log(res);
|
|
|
+ })
|
|
|
+ }
|
|
|
+ // 切换每页的数量
|
|
|
+ const changePageSize=(pageSize)=>{
|
|
|
+ placemenetPre.searchParams.page_size = pageSize
|
|
|
+ placementPreList()
|
|
|
+ }
|
|
|
+ const changePageNo = (pageNo)=>{
|
|
|
+ placemenetPre.searchParams.current = pageNo
|
|
|
+ placementPreList()
|
|
|
+ }
|
|
|
+ const searchPlacementPre=()=>{
|
|
|
+ placemenetPre.searchParams.current = 1
|
|
|
+ placementPreList()
|
|
|
+ }
|
|
|
+
|
|
|
+ const sortChange=({order})=>{
|
|
|
+ console.log(order);
|
|
|
+ placemenetPre.searchParams.sort_type = order=='ascending'?1:order=='descending'?2:''
|
|
|
+ searchPlacementPre()
|
|
|
+ }
|
|
|
+
|
|
|
+ // 补录合同
|
|
|
+ const supplementaryContract=(row)=>{
|
|
|
+ // console.log(id);
|
|
|
+ router.push({path:'/financial/list/contractProgress',query:{
|
|
|
+ supplementaryId:row.pre_pay_id,
|
|
|
+ company_name:row.company_name,
|
|
|
+ seller_id:row.seller_id,
|
|
|
+ seller_name:row.seller_name,
|
|
|
+ amount_unit:row.currency_unit,
|
|
|
+ placement_amount:row.origin_amount,
|
|
|
+ new_company:row.new_company,
|
|
|
+ start_date:row.start_date,
|
|
|
+ end_date:row.end_date
|
|
|
+ }})
|
|
|
+ }
|
|
|
+
|
|
|
+ //新增预到款
|
|
|
+ const addPre=()=>{
|
|
|
+ dialog.title='新增到款预登记'
|
|
|
+ dialog.editPreShow=true
|
|
|
+ }
|
|
|
+ //编辑预到款
|
|
|
+ const editPre=(row)=>{
|
|
|
+ dialog.editPreForm.pre_pay_id = row.pre_pay_id
|
|
|
+ dialog.editPreForm.company_name=row.company_name
|
|
|
+ dialog.editPreForm.new_company=row.new_company
|
|
|
+ dialog.editPreForm.seller_id=row.seller_id
|
|
|
+ dialog.editPreForm.seller_name=row.seller_name
|
|
|
+ dialog.editPreForm.amount=row.origin_amount
|
|
|
+ dialog.editPreForm.currency_unit=row.currency_unit
|
|
|
+ dialog.editPreForm.remark=row.remark
|
|
|
+ dialog.validityDate=[row.start_date,row.end_date]
|
|
|
+ dialog.title='编辑到款预登记'
|
|
|
+ dialog.editPreShow=true
|
|
|
+ }
|
|
|
+
|
|
|
+ //弹窗关闭动画 回调
|
|
|
+ const dialogClosed=()=>{
|
|
|
+ dialog.editPreForm.pre_pay_id = ''
|
|
|
+ dialog.editPreForm.company_name=''
|
|
|
+ dialog.editPreForm.new_company=0
|
|
|
+ dialog.editPreForm.seller_id=''
|
|
|
+ dialog.editPreForm.seller_name=''
|
|
|
+ dialog.editPreForm.amount=''
|
|
|
+ dialog.editPreForm.currency_unit='CNY'
|
|
|
+ dialog.editPreForm.remark=''
|
|
|
+ dialog.validityDate=[]
|
|
|
+ setTimeout(()=>{
|
|
|
+ editPreForm.value.clearValidate()
|
|
|
+ },0)
|
|
|
+ }
|
|
|
+
|
|
|
+ // 提交
|
|
|
+ const submitForm=()=>{
|
|
|
+ editPreForm.value.validate((valid)=>{
|
|
|
+ if(valid){
|
|
|
+ console.log(dialog.editPreForm);
|
|
|
+ dialog.editPreForm.amount = parseFloat(dialog.editPreForm.amount)
|
|
|
+ let prePlacementProp=prePlacementAdd
|
|
|
+ if(dialog.editPreForm.pre_pay_id){
|
|
|
+ // 编辑
|
|
|
+ prePlacementProp=prePlacementEdit
|
|
|
+ }
|
|
|
+ prePlacementProp(dialog.editPreForm).then(res=>{
|
|
|
+ dialog.editPreShow=false
|
|
|
+ ElMessage.success(`${dialog.title}成功`)
|
|
|
+ placementPreList()
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ // 删除
|
|
|
+ const delteRecord=(row)=>{
|
|
|
+ let hintText = '已补录合同，删除后不可恢复，是否确认删除该条到款预登记信息？'
|
|
|
+ if(row.contract_register_id== 0){
|
|
|
+ hintText='未补录合同，删除后不可恢复，是否确认删除该条到款预登记信息？'
|
|
|
+ }
|
|
|
+ ElMessageBox.confirm(hintText,'操作提示',
|
|
|
+ {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning',
|
|
|
+ }).then(res=>{
|
|
|
+ prePlacementDelete({pre_pay_id:row.pre_pay_id}).then(res=>{
|
|
|
+ ElMessage.success('删除成功')
|
|
|
+ placementPreList()
|
|
|
+ })
|
|
|
+ }).catch(()=>{})
|
|
|
+ }
|
|
|
+
|
|
|
+ // ---------------------created
|
|
|
+ getSellerListFun()
|
|
|
+ getCurrencyListFun()
|
|
|
+ placementPreList()
|
|
|
+</script>
|
|
|
+
|
|
|
+<template>
|
|
|
+ <div class="placemenetPre-list-container" id="placemenetPre-list-container" >
|
|
|
+ <!-- 顶部区域 -->
|
|
|
+ <div class="placemenetPre-top-zone">
|
|
|
+ <div class="placemenetPre-top-search-zone">
|
|
|
+ <el-input v-model="placemenetPre.searchParams.keyword" placeholder="客户姓名/销售" :prefix-icon="Search"
|
|
|
+ style="width: 340px;margin-right: 30px;" @input="searchPlacementPre" clearable />
|
|
|
+ <el-date-picker v-model="placemenetPre.createtime" start-placeholder="开始日期"
|
|
|
+ end-placeholder="结束日期" style="max-width: 240px;"
|
|
|
+ value-format="YYYY-MM-DD" type="daterange"></el-date-picker>
|
|
|
+ </div>
|
|
|
+ <!-- 按钮区域 -->
|
|
|
+ <div class="placemenetPre-top-option-zone" v-permission="'financial:placementPre:add'">
|
|
|
+ <el-button type="primary" size="large" style="color: white;"
|
|
|
+ @click="addPre" class="element-common-button">新增</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="placemenetPre-table-zone">
|
|
|
+ <!-- 表格 -->
|
|
|
+ <el-table :data="placemenetPre.tableData" border max-height="695px" @sort-change="sortChange"
|
|
|
+ size="default" style="position: sticky;">
|
|
|
+ <el-table-column label="客户名称" prop="company_name"
|
|
|
+ show-overflow-tooltip min-width="120"></el-table-column>
|
|
|
+ <el-table-column label="是否新客户" prop="new_company" width="100">
|
|
|
+ <template #default="{row}">
|
|
|
+ {{ row.new_company==1?'是':'否' }}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="销售" width="90" prop="seller_name">
|
|
|
+ <!-- <template #default="{row}">
|
|
|
+
|
|
|
+ </template> -->
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="到款金额" prop="origin_amount" width="120"></el-table-column>
|
|
|
+ <el-table-column label="金额单位" prop="unit_name" width="90">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="约定有效期" width="210" prop="start_date">
|
|
|
+ <template #default="{row}">
|
|
|
+ {{(row.start_date+' 至 '+row.end_date)}}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="备注" prop="remark" show-overflow-tooltip></el-table-column>
|
|
|
+ <el-table-column label="创建时间" prop="create_time" width="165" sortable="custom"></el-table-column>
|
|
|
+ <el-table-column label="创建人" width="90" prop="admin_name"></el-table-column>
|
|
|
+ <el-table-column label="操作" fixed="right"
|
|
|
+ v-permission="['financial:placementPre:supplementary','financial:placementPre:edit','financial:placementPre:delete']">
|
|
|
+ <template #default="{row}">
|
|
|
+ <div class="table-options">
|
|
|
+ <span class="table-option-buttons" v-permission="'financial:placementPre:supplementary'"
|
|
|
+ @click="supplementaryContract(row)">
|
|
|
+ 补录合同
|
|
|
+ </span>
|
|
|
+ <span class="table-option-buttons" v-permission="'financial:placementPre:edit'"
|
|
|
+ @click="editPre(row)">
|
|
|
+ 编辑
|
|
|
+ </span>
|
|
|
+ <span class="table-option-buttons" v-permission="'financial:placementPre:delete'"
|
|
|
+ @click="delteRecord(row)" style="color:var(--dangerColor);">
|
|
|
+ 删除
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <template #empty>
|
|
|
+ <div class="table-no-data">
|
|
|
+ <img src="@/assets/img/icon/empty-data.png" />
|
|
|
+ <span>暂无数据</span>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table>
|
|
|
+ <!-- 分页 -->
|
|
|
+ <m-page :pageSize="placemenetPre.searchParams.page_size" :page_no="placemenetPre.searchParams.current"
|
|
|
+ style="display: flex;justify-content: flex-end;margin-top: 20px;"
|
|
|
+ :total="placemenetPre.total" @handleCurrentChange="changePageNo" @handleSizeChange="changePageSize"/>
|
|
|
+ </div>
|
|
|
+ <!-- 新增/编辑弹窗 -->
|
|
|
+ <el-dialog v-model="dialog.editPreShow" :title="dialog.title" width="556px" @closed="dialogClosed"
|
|
|
+ :close-on-click-modal="false">
|
|
|
+ <!-- <template style="display: flex;justify-content: center;"> -->
|
|
|
+ <el-form :model="dialog.editPreForm" ref="editPreForm" label-width="130px"
|
|
|
+ :rules="dialog.rules" style="margin-top: 10px;">
|
|
|
+ <el-form-item label="客户名称" prop="company_name">
|
|
|
+ <el-input v-model="dialog.editPreForm.company_name"
|
|
|
+ placeholder="请输入客户名称" style="width:260px" />
|
|
|
+ <el-checkbox v-model="is_new_company" label="新客户" style="margin-left: 20px;min-width: 100px;"
|
|
|
+ size="large" @change="(value) => dialog.editPreForm.new_company = value?1:0" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="销售" prop="seller_id">
|
|
|
+ <el-select v-model="dialog.editPreForm.seller_id" placeholder="请选择销售" style="width: 346px;"
|
|
|
+ filterable @change="selectSeller">
|
|
|
+ <el-option :label="item.real_name" :value="item.admin_id" v-for="item in sellerList" :key="item.admin_id"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="到款金额" id="contractInfo-contractAmount"
|
|
|
+ prop="amount">
|
|
|
+ <el-input v-model.trim="dialog.editPreForm.amount"
|
|
|
+ placeholder="请输入到款金额" style="width: 206px;" />
|
|
|
+ <el-select v-model="dialog.editPreForm.currency_unit" placeholder="请选择货币类型"
|
|
|
+ style="margin-left: 20px;width: 120px;">
|
|
|
+ <el-option v-for="item in currencyList" :key="item.code" :label="item.name" :value="item.code">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="约定有效期" prop="start_date">
|
|
|
+ <el-date-picker type="daterange"
|
|
|
+ v-model="dialog.validityDate" style="max-width: 346px;"
|
|
|
+ start-placeholder="开始日期" end-placeholder="结束日期" value-format="YYYY-MM-DD"
|
|
|
+ :clearable="false">
|
|
|
+ </el-date-picker>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="备注" prop="remark">
|
|
|
+ <el-input
|
|
|
+ v-model="dialog.editPreForm.remark"
|
|
|
+ style="width: 346px;"
|
|
|
+ :rows="3"
|
|
|
+ placeholder="请输入内容"
|
|
|
+ type="textarea"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <!-- </template> -->
|
|
|
+ <template #footer>
|
|
|
+ <div>
|
|
|
+ <el-button @click="dialog.editPreShow=false">取消</el-button>
|
|
|
+ <el-button type="primary" @click="submitForm" style="margin-left: 30px;">确定</el-button>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+ .placemenetPre-list-container{
|
|
|
+ min-height: 100%;
|
|
|
+ .placemenetPre-top-zone{
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ align-items: flex-start;
|
|
|
+ justify-content: space-between;
|
|
|
+ margin-bottom: 20px;
|
|
|
+ .placemenetPre-top-search-zone{
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ margin-bottom: 8px;
|
|
|
+ }
|
|
|
+ .placemenetPre-top-option-zone{
|
|
|
+ // margin-bottom: 8px;
|
|
|
+ .element-common-button{
|
|
|
+ width: 118px;
|
|
|
+ margin-left: 30px;
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .placemenetPre-table-zone{
|
|
|
+ margin-top: 20px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|
|
|
+<style lang="scss">
|
|
|
+ #placemenetPre-list-container{
|
|
|
+ .el-dialog__footer{
|
|
|
+ padding-top: 0!important;
|
|
|
+ padding: 0 0 36px 0;
|
|
|
+ }
|
|
|
+ .el-date-editor{
|
|
|
+ .el-input__wrapper{
|
|
|
+ width: 286px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+</style>
|
hbchen
