99ditui-admin-ui/src/views/admin/projectprice/index.vue

<template>
    <div class="my-layout">
        <el-card class="mt8" shadow="never" :body-style="{ paddingBottom: '0' }">
            <el-form :inline="true" @submit.stop.prevent>                
                <el-form-item>                    
                    <p>所有项目默认抽成比例<span style="color:red;">{{ state.companydraw.currentRatio }}%</span> （抽成金额精确到小数点后一位）</p>                    
                    <p v-if="state.companydraw.nextRatio != 0">修改所有项目默认抽成比例为<span style="color:red;"> {{state.companydraw.nextRatio}}% 于{{ state.companydraw.nextEffectDate}} </span>生效</p>                    
                </el-form-item>
                <el-form-item>                    
                    <el-button type="text" @click="onCompanyEdit"> 修改 </el-button>
                </el-form-item>
            </el-form>
        </el-card>        
        <el-card class="my-fill mt8" shadow="never">
            <el-table v-loading="state.loading" :data="state.listData" row-key="id" height="'100%'"
                style="width: 100%; height: 100%">
                <el-table-column type="expand">
                    <template v-slot="props">
                        <el-table :data="props.row.prices" style="width: 100%;margin-bottom: 20px;" row-key="id"                            >
                            <el-table-column prop="name" label="结算标准" width="180">
                            </el-table-column>
                            <el-table-column prop="price" label="价格" width="180">
                            </el-table-column>
                            <el-table-column label="设价方式" min-width="180">
                                <template #default="{ pRow }">
                                    <el-form label-position="left" inline class="demo-table-expand">
                                        <el-form-item>
                                            <el-select placeholder="请选择设价方式">
                                                <el-option label="抽成比例" value="1"></el-option>
                                                <el-option label="抽成金额" value="2"></el-option>
                                            </el-select>
                                        </el-form-item>
                                        <el-form-item>                                           
                                            <el-input placeholder="请输入设价信息"></el-input>                                                                                        
                                        </el-form-item>
                                        <el-form-item>                                             
                                            %
                                        </el-form-item>
                                        <el-form-item>
                                            <el-button type="primary" @click="SetPrice">设价</el-button>                                            
                                        </el-form-item>
                                    </el-form>
                                </template>
                            </el-table-column>                            
                        </el-table>                        
                    </template>
                </el-table-column>                                           
                <el-table-column label="Logo" prop="logo" min-width="120" show-overflow-tooltip >
                    <template #default="{ row }">
                        <div class="block"><el-avatar shape="square" size="medium" :src="row.logo"></el-avatar></div>
                    </template>
                </el-table-column>
                <el-table-column label="项目名称" prop="name" min-width="120" show-overflow-tooltip />                
                <el-table-column label="操作" width="180" header-align="center" align="center" fixed="right">
                    <template #default="{ row }">
                        <el-button size="small" text type="primary" @click="onDetail(row)">平台单独设价</el-button>                    
                    </template>
                </el-table-column>
            </el-table>
        </el-card>
        <!-- <LinkForm ref="LinkFormRef" :title="state.linkFormTitle"></LinkForm> -->
        <!-- <tenant-form ref="tenantFormRef" :title="state.tenantFormTitle"></tenant-form> -->
        <!-- 公司抽成from -->
        <company-form ref="companyFormRef" title="公司分成比例修改"></company-form>
    </div>
</template>
<script lang="ts" setup name="admin/projectprice">
import { stat } from 'fs'
import { onMounted, reactive, onBeforeMount, defineAsyncComponent, ref } from 'vue'
import { CompanyDrawOutput,pageInputProjectPriceSetPageInput, PriceGetPageOutput } from '/@/api/admin/data-contracts'
import { ProjectPriceApi } from '/@/api/admin/ProjectPrice'
import eventBus from '/@/utils/mitt'

// 引入组件
const CompanyForm = defineAsyncComponent(() => import('./components/company-form.vue'))
const companyFormRef = ref();

const state = reactive({    
    companydraw: {         
    } as CompanyDrawOutput,    
    loading: false,
    tenantFormTitle: '',
    linkFormTitle: '',            
    filter: {
    },
    pageInput: {
        currentPage: 1,
        pageSize: 20,
    } as pageInputProjectPriceSetPageInput,
    total: 0,
    listData: [] as Array<PriceGetPageOutput>        
})
onMounted(() => { 
    onCompanyQuery();   
    onQuery();   
    eventBus.on('refreshCompanyDraw', async () => { 
        onCompanyQuery();
    }) 
    eventBus.off('refreshProjectPrice')
    eventBus.on('refreshProjectPrice', async () => {
        onQuery()
    })

})
onBeforeMount(() => {
    eventBus.off('refreshProjectPrice')
})
//查询
const onQuery = async () => {
    state.loading = true
    state.pageInput.filter = state.filter
    const res = await new ProjectPriceApi().getPricePage(state.pageInput).catch(() => {
        state.loading = false
    })
    state.listData = res?.data?.list ?? []
    state.total = res?.data?.total ?? 0
    state.loading = false
}
//查询公司抽成
const onCompanyQuery = async () => {
    // state.loading = true
    const res = await new ProjectPriceApi().getCompanyDraw({ })

    if (res?.success) {
        state.companydraw = res.data as CompanyDrawOutput;
        state.companydraw.nextEffectDate = state.companydraw.nextEffectDate?.split(' ')[0];        
    }       
}
//更新公司抽成
const onCompanyEdit = () => {
    companyFormRef.value.open()
}



//平台单独设价
// const onDetail = (row: ProjectLinkManagePageOutput) => {
//     state.tenantFormTitle = '编辑租户'
//     tenantFormRef.value.open(row)    
// }
</script>