85 lines
2.0 KiB
Vue
85 lines
2.0 KiB
Vue
<template>
|
|
<div class="percentage-content">
|
|
<el-radio-group class="rg" v-model="tabIndex" @change="clickRadio">
|
|
<template v-for="item in tabs" :key="item.sortId">
|
|
<el-radio-button :label="item.sortId">{{ item.typeName }}</el-radio-button>
|
|
</template>
|
|
</el-radio-group>
|
|
<div class="content">
|
|
<!-- <transition name="main" mode="out-in" appear>
|
|
<component :is="tabs[tabIndex].compon" />
|
|
</transition> -->
|
|
<CG :tabIndex="tabIndex" :typeId="typeId"></CG>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang='ts' setup>
|
|
import { onMounted, ref } from "vue";
|
|
// import { ElMessageBox } from "element-plus";
|
|
import { wkTypes } from "@/api/Work";
|
|
import CG from "./components/cg.vue";
|
|
|
|
const tabIndex = ref(0);
|
|
const tabs = ref([
|
|
{ typeName: "常规工作", sortId: 1, },
|
|
]);
|
|
const typeId = ref('');
|
|
//头部点击取id
|
|
const clickRadio = ()=>{
|
|
tabs.value.forEach(item => {
|
|
if (item.sortId == tabIndex.value) {
|
|
typeId.value = item.typeId
|
|
}
|
|
|
|
});
|
|
}
|
|
//工作类型
|
|
const getWkTypes = ()=>{
|
|
let params = {
|
|
classify:1
|
|
}
|
|
wkTypes(params).then((res: any) => {
|
|
tabs.value = res.data;
|
|
typeId.value = res.data[0].typeId;
|
|
tabIndex.value = 1;
|
|
});
|
|
}
|
|
onMounted(() => {
|
|
getWkTypes();
|
|
});
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.percentage-content {
|
|
height: auto;
|
|
display: flex;
|
|
flex-direction: column;
|
|
.rg {
|
|
padding: 16px;
|
|
background: #fff;
|
|
box-shadow: 0 0 6px rgb(0 120 255 / 10%);
|
|
border-radius: 6px;
|
|
display: flex;
|
|
flex-direction: row;
|
|
margin-bottom: 10px;
|
|
:deep(.el-radio-button__inner) {
|
|
min-width: 150px;
|
|
}
|
|
}
|
|
.content {
|
|
width: 100%;
|
|
background: #fff;
|
|
border-radius: 0.26042vw;
|
|
box-shadow: 0 0 0.41667vw 0 rgb(8 33 85 / 10%);
|
|
padding: 0.83333vw;
|
|
overflow-y: auto;
|
|
overflow-x: hidden !important;
|
|
box-sizing: border-box;
|
|
.table {
|
|
margin-top: 16px;
|
|
}
|
|
}
|
|
}
|
|
</style>
|