123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935 |
- <template>
- <hc-drawer
- v-model="isShow"
- to-id="hc-main-box"
- is-close
- @close="drawerClose"
- >
- <div class="hc-project-wbs-tree flex">
- <div class="header hc-flex">
- <div class="name flex-1">
- {{ dataInfo.wbsName }}
- </div>
- <div class="hc-flex">
- <el-button
- v-if="curTreeNode && curTreeNode.level == 2"
- hc-btn
- type="primary"
- >
- 导入划分
- </el-button>
- <el-button
- v-if="!isShowInfo"
- hc-btn
- type="primary"
- @click="showInfoClick"
- >
- 元素设置
- </el-button>
- <el-button
- v-if="isShowInfo"
- hc-btn
- type="primary"
- @click="hideInfoClick"
- >
- 元素公式设置
- </el-button>
- <el-button hc-btn type="warning" @click="nodeParamClick">
- 节点参数设置
- </el-button>
- </div>
- </div>
- <div class="body">
- <hc-body split :options="splitOptions">
- <template #left>
- <hc-card scrollbar>
- <template #header>
- <hc-search-input
- v-model="searchTreeName"
- @search="searchTreeNameClick"
- @clear="searchTreeNameClick"
- >
- <template #prepend>
- <el-select
- v-model="queryType"
- placeholder="类型"
- style="width: 75px"
- >
- <el-option label="节点" value="1" />
- <el-option label="表名" value="2" />
- </el-select>
- </template>
- </hc-search-input>
- </template>
- <hc-lazy-tree
- v-if="isTreeMode"
- :root-menu="treeMenuData"
- :menus="treeMenuDatas"
- :h-props="treeProps"
- tree-key="id"
- :auto-expand-keys="autoExpandKeys"
- @load="treeLoadNode"
- @node-tap="treeNodeTap"
- @menu-tap="treeMenuClick"
- >
- <template #nodeName="{ data }">
- <span class="text-16px font-400">{{
- data.nodeName
- }}</span>
- </template>
- </hc-lazy-tree>
- <template v-if="isTreeMode === false">
- <hc-data-tree
- ref="treeRef"
- default-expand-all
- :h-props="treeProps"
- tree-key="id"
- :datas="treeData"
- @node-tap="treeNodeTap"
- >
- <template #name="{ data }">
- <span class="text-16px font-400">{{
- data.title
- }}</span>
- </template>
- </hc-data-tree>
- </template>
- </hc-card>
- </template>
- <hc-card class="hc-desk-system-unit-temp">
- <template v-if="!isNullES(nodeInfo.id)">
- <div v-if="isShowInfo" class="body-top">
- <hc-card title="节点信息">
- <hc-table
- :is-index="false"
- :column="nodeTableColumn"
- :datas="nodeTableData"
- >
- <template #nodeType="{ row }">
- {{
- getDictionaryName(
- majorDatatype,
- row.nodeType,
- true,
- )
- }}
- </template>
- </hc-table>
- </hc-card>
- </div>
- <div class="body-content">
- <hc-card title="当前已创建的元素表">
- <template #extra>
- <el-button
- v-if="isShowInfo"
- size="small"
- type="primary"
- @click="createNew"
- >
- 创建元素表
- </el-button>
- <el-button
- v-if="isShowInfo"
- size="small"
- type="warning"
- @click="editEleClick"
- >
- 编辑元素表单
- </el-button>
- <el-button
- v-if="isShowInfo"
- size="small"
- type="success"
- @click="sortClick"
- >
- 排序
- </el-button>
- </template>
- <hc-table
- :column="tableColumn"
- :datas="tableData"
- :loading="tableLoading"
- :is-index="false"
- :is-current-row="false"
- >
- <template #tableType="{ row }">
- {{
- getDictionaryName(
- tableTypelist,
- row.tableType,
- true,
- )
- }}
- </template>
- <template #tableOwner="{ row }">
- {{
- getDictionaryName(
- ownerTypeList,
- row.tableOwner,
- true,
- )
- }}
- </template>
- <template #action="{ row, index }">
- <el-link
- v-if="isShowInfo"
- type="warning"
- @click="editRowClick(row)"
- >
- 编辑
- </el-link>
- <el-link
- v-else
- type="warning"
- @click="editFormulaClick(row)"
- >
- 编辑元素公式
- </el-link>
- <el-link
- type="danger"
- @click="rowDelClick(row)"
- >
- 删除
- </el-link>
- </template>
- </hc-table>
- </hc-card>
- </div>
- </template>
- <hc-empty v-else title="请先点击左侧树节点" />
- </hc-card>
- </hc-body>
- </div>
- </div>
- <!-- 树节点调整排序 -->
- <hc-dialog
- v-model="isSortingShow"
- title="调整排序"
- widths="600px"
- is-table
- @close="sortingClose"
- >
- <hc-table
- ref="tableSortingRef"
- :column="tableSortingColumn"
- :datas="tableSortingData"
- is-row-drop
- is-sort
- quick-sort
- @row-drop="sortingRowDropTap"
- @row-sort="sortingRowSortTap"
- />
- <template #footer>
- <el-button hc-btn @click="sortingClose">取消</el-button>
- <el-button
- hc-btn
- type="primary"
- :disabled="tableSortingData.length <= 0"
- :loading="sortingLoading"
- @click="sortingSubmit"
- >
- 提交
- </el-button>
- </template>
- </hc-dialog>
- <!-- 树节点新增修改 -->
- <TreeNodeEditDialog
- v-model="isAddEditShow"
- :node="formModel"
- :type="Number(wbsType)"
- :wid="dataInfo.id"
- :tree-props="treeProps"
- :node-type="majorDatatype"
- :major-type="majorDataTypeList"
- :title="modalTreeTitle"
- @close="addEditClose"
- @change="treeNodeEditChange"
- />
- <!-- 创建新的元素表 -->
- <createNewExcel
- v-model="isCreateShow"
- :node="nodeDetail"
- :wid="dataInfo.id"
- :table-typelist="tableTypelist"
- :owner-type-list="ownerTypeList"
- :title="modalTitle"
- :table-id="tableId"
- :init-table-name="initTableName"
- :init-table-id="initTableId"
- :e-key="eKey"
- :is-add="isAddType"
- @close="createClose"
- />
- <!-- 编辑元素表信息 -->
- <editElePage
- v-model="editEleShow"
- :table-typelist="tableTypelist"
- :owner-type-list="ownerTypeList"
- :tab="tableData"
- @close="editClose"
- />
- <!-- 表单调整排序 -->
- <tableSort
- v-model="tableSortShow"
- :tab="tableData"
- @close="tableSortShowClose"
- />
- <!-- 编辑元素公式 -->
- <editFormulaDialog
- v-model="editFormulaShow"
- :table-id="tableId"
- @close="editFormulaClose"
- @formula="toFormulaClick"
- />
- </hc-drawer>
- <!-- 节点参数设置 -->
- <nodeParamDialog
- v-model="nodeParamShow"
- :node-id="nodeInfo.id"
- :scope-type="1"
- :node-info="nodeInfo"
- @close="nodeParamClose"
- />
- <!-- 编辑公式 -->
- <HcEditFormula
- v-model="isEditFormulaShow"
- :data="editFormulaData"
- @finish="editFormulaFinish"
- />
- </template>
- <script setup>
- import { nextTick, onMounted, ref, watch } from 'vue'
- import { HcDelMsg } from 'hc-vue3-ui'
- import { getDictionaryData, getDictionaryName } from '~src/utils/tools'
- import HcEditFormula from '~src/views/project/list/edit-formula.vue'
- import { getStoreValue, setStoreValue } from '~uti/storage'
- import tableSort from './table-sort.vue'
- import editFormulaDialog from './edit-formula-dialog.vue'
- import {
- arrToId,
- deepClone,
- getArrValue,
- getObjValue,
- isNullES,
- } from 'js-fast-way'
- import mainApi from '~api/wbs/tree'
- import mainWbsApi from '~api/wbs/wbsforelement'
- import { useAppStore } from '~src/store'
- import TreeNodeEditDialog from './tree-node-edit.vue'
- import createNewExcel from './create-new-excel.vue'
- import editElePage from './edit-ele.vue'
- import nodeParamDialog from './node-param-dialog.vue'
- const props = defineProps({
- data: {
- type: Object,
- default: () => ({}),
- },
- })
- const emit = defineEmits(['close'])
- const splitOptions = { sizes: [25, 75], snapOffset: 0, minSize: [300, 300] }
- //缓存
- const store = useAppStore()
- const userInfo = ref(store.getUserInfo)
- watch(
- () => store.getUserInfo,
- (info) => {
- userInfo.value = info
- },
- { immediate: true, deep: true },
- )
- //双向绑定
- const isShow = defineModel('modelValue', {
- default: false,
- })
- //监听数据
- const dataInfo = ref(props.data)
- const wbsType = ref(props.data.wbsType)
- watch(
- () => props.data,
- (data) => {
- dataInfo.value = data
- wbsType.value = data.wbsType
- },
- { immediate: true, deep: true },
- )
- //监听显示
- watch(isShow, (val) => {
- if (val) getDataApi()
- getMajorList()
- getOwnerTypelist()
- getTableTypelist(Number(wbsType.value - 1))
- })
- //渲染完成
- onMounted(() => {
- autoExpandKeys.value = getStoreValue('autoExpandKeys') || []
- })
- //处理相关数据
- const majorDatatype = ref([])
- const getDataApi = async () => {
- isTreeMode.value = true
- const type = wbsType.value
- let code = ''
- if (type === 5) {
- code = 'lar_node_type' //征拆
- } else if (type === 2) {
- code = 'trial_node_type' //试验
- } else if (type === 3) {
- code = 'meter_node_type' //计量
- } else {
- {
- code = 'wbs_node_type' //质检
- }
- }
- majorDatatype.value = await getDictionaryData(code, false)
- }
- //树搜索
- const queryType = ref('1')
- const searchTreeName = ref('')
- const searchTreeNameClick = async () => {
- if (isNullES(searchTreeName.value)) {
- isTreeMode.value = true
- } else {
- isTreeMode.value = false
- await getSearchData()
- }
- }
- const getSearchData = async () => {
- const { id } = getObjValue(dataInfo.value)
- const { data } = await mainApi.getQueryValueByType({
- wbsId: id,
- type: queryType.value,
- queryValue: searchTreeName.value,
- projectId: '',
- })
- treeData.value = data
- }
- //节点详情
- const nodeDetail = ref({})
- const getNodeDetail = async (data1, node) => {
- let parentName = ''
- if (node.parent.data) {
- parentName = node.parent.data.title
- }
- const { data } = await mainApi.getDetail(data1.id, node)
- nodeInfo.value = data
- nodeDetail.value = data
- formModel.value = data
- formModel.value.parentName = parentName
- nodeInfo.value.parentName = parentName
- nodeInfo.value.nodeTypeName = getDictionaryName(
- majorDatatype.value,
- data.nodeType,
- )
- defaultCheckedKeys.value = nodeDetail.value.mixRatioTestIds
- ? nodeDetail.value.mixRatioTestIds.split(',')
- : []
- const res = getObjValue(data)
- nodeTableData.value = [res]
- }
- //内业资料类型
- const majorDataTypeList = ref([])
- const getMajorList = async () => {
- majorDataTypeList.value = await getDictionaryData('major_data_type', false)
- }
- //树配置
- const isTreeMode = ref(false)
- const treeProps = {
- label: 'title',
- children: 'children',
- isLeaf: function (data) {
- if (data.hasChildren && data.isExistForm != 1) {
- return false
- } else if (data.hasChildren && data.isExistForm == 1) {
- return true
- } else {
- return true
- }
- },
- }
- const treeData = ref([])
- const autoExpandKeys = ref([])
- const defaultCheckedKeys = ref([])
- //懒加载树
- const treeLoadNode = async ({ item, level }, resolve) => {
- const { tenant_id } = getObjValue(userInfo.value)
- const parentId = level === 0 ? 0 : item.id
- const { id } = getObjValue(dataInfo.value)
- const { data } = await mainApi.getLazytree({
- parentId: parentId,
- wbsId: id,
- tenantId: tenant_id,
- })
- resolve(getArrValue(data))
- }
- //树菜单根节点
- const treeMenuData = [
- { icon: 'add-circle', label: '新增节点', key: 'add' },
- { icon: 'draft', label: '编辑节点', key: 'edit' },
- { icon: 'delete-bin', label: '删除节点', key: 'del' },
- ]
- const treeMenuDatas = [
- { icon: 'add-circle', label: '新增节点', key: 'add' },
- { icon: 'draft', label: '编辑节点', key: 'edit' },
- { icon: 'arrow-up-down', label: '排序节点', key: 'rank' },
- { icon: 'delete-bin', label: '删除节点', key: 'del' },
- ]
- //试验树数据
- //菜单被点击
- const treeMenuClick = async ({ key, data, node, keys }) => {
- nodeInfo.value = data
- autoExpandKeys.value = keys || []
- setStoreValue('autoExpandKeys', keys)
- if (key === 'add') {
- formModel.value = {}
- let parentName = ''
- if (node.parent.data) {
- parentName = node.parent.data.title
- }
- formModel.value.parentName = parentName
- await getNodeDetail(data, node)
- formModel.value.parentId = data.id
- formModel.value.id = ''
- formModel.value.nodeName = ''
- formModel.value.partitionCode = ''
- formModel.value.uniqueCode = ''
- formModel.value.majorDataType = ''
- formModel.value.fullName = ''
- await nextTick()
- if (
- nodeInfo.value.nodeType == 6
- || nodeInfo.value.isExistForm == 1
- || nodeInfo.value.unitName
- || nodeInfo.value.className
- ) {
- window.$message({
- type: 'warning',
- message: '该节点下无法新增节点',
- })
- return
- }
- isAddEditShow.value = true
- modalTreeTitle.value = '新增节点'
- } else if (key === 'edit') {
- formModel.value = deepClone(data)
- formModel.value.nodeName = formModel.value.title
- getNodeDetail(data, node)
- await nextTick()
- isAddEditShow.value = true
- modalTreeTitle.value = '编辑节点'
- } else if (key === 'rank') {
- const pid = node.parent.data.id
- const { data } = await mainApi.findWbsTreeSameLevel({ parentId: pid })
- tableSortingData.value = getArrValue(data)
- isSortingShow.value = true
- } else if (key === 'del') {
- HcDelMsg(async (resolve) => {
- const { code } = await mainApi.remove(data.id)
- resolve() //关闭弹窗的回调
- if (code !== 200) return
- window.$message.success('删除成功')
- setTreeMode()
- }).then()
- }
- }
- //树节点被点击
- const nodeInfo = ref({})
- const curTreeNode = ref({})
- const treeNodeTap = async ({ data, node, keys }) => {
- curTreeNode.value = node
- autoExpandKeys.value = keys || []
- setStoreValue('autoExpandKeys', keys)
- await getNodeDetail(data, node)
- await getTableData()
- }
- //节点信息
- const nodeTableColumn = ref([
- { key: 'nodeName', name: '当前节点', align: 'center' },
- { key: 'nodeType', name: '节点类型', align: 'center' },
- { key: 'parentName', name: '上级节点', align: 'center' },
- ])
- const nodeTableData = ref([])
- //表格数据
- const tableColumn = ref([
- { key: 'tableName', name: '表单名称' },
- { key: 'elementTotal', name: '元素总量' },
- { key: 'fillRate', name: '填报率' },
- { key: 'tableType', name: '表单类型' },
- { key: 'tableOwner', name: '所属方' },
- { key: 'action', name: '操作', align: 'center' },
- ])
- const tableData = ref([{}])
- //获取表格数据
- const tableLoading = ref(false)
- //获取数据
- const getTableData = async () => {
- tableData.value = []
- const { id } = nodeInfo.value
- tableLoading.value = true
- const { data } = await mainApi.selectByNodeTable({
- id,
- })
- tableLoading.value = false
- const res = getArrValue(data)
- tableData.value = res
- }
- //获取表单类型
- const tableTypelist = ref([])
- const getTableTypelist = async (type) => {
- //计量管理,征拆划分,实验划分,WBS树管理,日志树管理
- const types = [
- 'table_type',
- 'trial_table_type',
- 'table_type',
- 'table_type',
- 'table_type',
- ]
- const data = await getDictionaryData(types[type])
- tableTypelist.value = getArrValue(data)
- }
- const ownerTypeList = ref([])
- const getOwnerTypelist = async () => {
- const data = await getDictionaryData('owner_type')
- ownerTypeList.value = getArrValue(data)
- }
- //新增、编辑节点
- const isAddEditShow = ref(false)
- const modalTreeTitle = ref('新增节点')
- const formModel = ref({})
- //新增、编辑节点提交
- //关闭 新增、编辑节点
- const addEditClose = () => {
- isAddEditShow.value = false
- formModel.value = {}
- }
- //编辑节点被修改
- const treeNodeEditChange = () => {
- isAddEditShow.value = false
- formModel.value = {}
- console.log('编辑节点被修改')
- setTreeMode()
- }
- //树重加载
- const setTreeMode = () => {
- isTreeMode.value = false
- nodeInfo.value = {}
- tableData.value = []
- setTimeout(() => {
- isTreeMode.value = true
- }, 500)
- }
- //排序
- const isSortingShow = ref(false)
- const tableSortingRef = ref(null)
- //排序表
- const tableSortingColumn = [{ key: 'nodeName', name: '节点名称' }]
- const tableSortingData = ref([])
- // 行拖拽
- const sortingRowDropTap = async (rows) => {
- // 先清空,否则排序会异常
- tableData.value = []
- await nextTick()
- tableData.value = rows
- }
- // 点击排序
- const sortingRowSortTap = async (rows) => {
- // 先清空,否则排序会异常
- tableData.value = []
- await nextTick()
- tableData.value = rows
- }
- //排序提交
- const sortingLoading = ref(false)
- const sortingSubmit = async () => {
- const arr = tableSortingData.value
- if (arr.length <= 0) {
- window?.$message?.warning('暂无数据')
- return
- }
- sortingLoading.value = true
- const ids = arrToId(arr)
- const { error, code } = await mainApi.wbsTreeSort(arr)
- sortingLoading.value = false
- if (!error && code === 200) {
- window?.$message?.success('操作成功')
- sortingClose()
- setTreeMode()
- }
- }
- //关闭排序
- const sortingClose = () => {
- isSortingShow.value = false
- tableData.value = []
- }
- //关闭抽屉
- const drawerClose = () => {
- isShow.value = false
- isTreeMode.value = false
- nodeInfo.value = {}
- emit('close')
- }
- const tableId = ref('')
- const initTableName = ref('')
- const initTableId = ref('')
- const eKey = ref('')
- const editRowClick = async (row) => {
- await nextTick()
- isCreateShow.value = true
- isAddType.value = false
- modalTitle.value = row.tableName + '元素编辑'
- tableId.value = row.id
- initTableName.value = row.initTableName
- initTableId.value = row.initTableId
- eKey.value = row.ekey
- }
- const rowDelClick = async (row) => {
- console.log('删除')
- HcDelMsg(async (resolve) => {
- const { isRes } = await mainWbsApi.removeTable({ id: row.id })
- resolve() //关闭弹窗的回调
- if (!isRes) return
- getTableData()
- })
- }
- //创建新的元素表
- const isCreateShow = ref(false)
- const modalTitle = ref('创建新的元素表')
- const isAddType = ref(false)
- const createClose = async () => {
-
- // getTableData()
-
- isCreateShow.value = false
- }
- const createNew = async () => {
- const { id } = nodeInfo.value
- tableId.value = ''
- if (id) {
- await nextTick()
- isCreateShow.value = true
- modalTitle.value = '创建新的元素表'
- isAddType.value = true
- tableId.value = ''
- } else {
- window.$message.warning('请先选择在哪个节点下创建表')
- }
- }
- //编辑元素表单
- const editEleShow = ref(false)
- const editClose = () => {
- editEleShow.value = false
- getTableData()
- }
- const editEleClick = () => {
- const { id } = nodeInfo.value
- if (id) {
- editEleShow.value = true
- } else {
- window.$message.warning('请先选择编辑哪个节点')
- }
- }
- // 元素表排序
- const tableSortShow = ref(false)
- const sortClick = () => {
- tableSortShow.value = true
- }
- const tableSortShowClose = () => {
- tableSortShow.value = false
- getTableData()
- }
- //按钮切换
- const isShowInfo = ref(true)
- const hideInfoClick = () => {
- const { id } = nodeInfo.value
- if (id) {
- isShowInfo.value = false
- } else {
- window.$message.warning('请先选择左侧节点')
- }
- }
- const showInfoClick = () => {
- isShowInfo.value = true
- }
- //编辑元素公式
- const editFormulaShow = ref(false)
- const editFormulaClose = () => {
- editFormulaShow.value = false
- elementFormulasObj.value = {}
- }
- const elementFormulasObj = ref({})
- const editFormulaClick = (row) => {
- const { id } = nodeInfo.value
- elementFormulasObj.value = row
- if (id) {
- tableId.value = row.id
- editFormulaShow.value = true
- } else {
- window.$message.warning('请先选择左侧节点')
- }
- }
- //公式
- const editFormulaData = ref({})
- const isEditFormulaShow = ref(false)
- const toFormulaClick = async ({ type, data }) => {
- const { id } = getObjValue(dataInfo.value)
- if (type === 'global') {
- //全局公式
- editFormulaData.value = {
- node: data,
- wbsId: id,
- nodeId: nodeDetail.value.id,
- eleId: data.id,
- eleType: false,
- tableType: true,
- globalType: 1,
- }
- await nextTick()
- isEditFormulaShow.value = true
- } else if (type === 'node') {
- //节点公式
- editFormulaData.value = {
- node: nodeDetail.value,
- wbsId: id,
- nodeId: nodeDetail.value.id,
- eleId: data.id,
- globalType: 2,
- }
- await nextTick()
- isEditFormulaShow.value = true
- }
- }
- //公式操作完成
- const editFormulaFinish = () => {
- }
- //节点参数设置
- const nodeParamShow = ref(false)
- const nodeParamClose = () => {
- nodeParamShow.value = false
- }
- const nodeParamClick = () => {
- const { id } = nodeInfo.value
- if (id) {
- nodeParamShow.value = true
- } else {
- window.$message.warning('请先选择左侧节点')
- }
- }
- </script>
- <style lang="scss">
- .hc-desk-system-unit-temp .el-card {
- .hc-card-item-box {
- height: auto;
- padding: 10px 14px;
- .hc-card-item-header {
- color: #4a4a4a;
- margin-bottom: 6px;
- }
- }
- .hc-card-item-box + .hc-card-item-box {
- margin-top: 20px;
- }
- }
- .border-class {
- position: relative;
- height: 300px;
- border: 1px solid #dddfe6;
- }
- </style>
- <style scoped lang="scss">
- .hc-project-wbs-tree {
- position: relative;
- background: #ececec;
- border-radius: 4px;
- height: 100%;
- flex-direction: column;
- overflow: hidden;
- .header {
- color: white;
- background: #54565a;
- padding: 10px 14px;
- flex-shrink: 0;
- .name {
- white-space: nowrap;
- overflow: hidden;
- text-overflow: ellipsis;
- }
- }
- .body {
- flex: 1;
- flex-basis: auto;
- position: relative;
- }
- }
- </style>
- <style lang="scss">
- .hc-project-wbs-tree .body {
- .el-card.hc-card-box {
- --el-card-padding: 12px;
- --el-card-border-radius: 5px;
- }
- .hc-page-split-content {
- position: relative;
- .body-top {
- position: relative;
- height: 119.5px;
- }
- .body-content {
- position: relative;
- margin-top: 10px;
- height: calc(100% - 129.5px);
- }
- }
- }
- </style>
|