| | |
| | | class="spiSe" |
| | | :teleported="false" |
| | | v-model="spiValue" |
| | | :options="spiOptions" |
| | | :options="departList" |
| | | :props="spiProps" |
| | | :show-all-levels="false" |
| | | @change="handleChange" |
| | |
| | | import * as echarts from 'echarts'; |
| | | import '/@/theme/bigScreen.css' |
| | | import {useScreenTheme} from "/@/stores/screenTheme"; |
| | | import {teamManageApi} from "/@/api/systemManage/basicDateManage/personShiftManage/teamManage"; |
| | | |
| | | interface stateType { |
| | | spiValue: number; |
| | | spiOptions: Array<any>; |
| | | spiChart: string |
| | | departList: Array<any>; |
| | | spiChart: string; |
| | | spiProps: object |
| | | } |
| | | export default defineComponent({ |
| | | name: 'SPI', |
| | |
| | | const { screenTheme } = storeToRefs(screenThemes); |
| | | const spi = ref("eChartSpi" + Date.now() + Math.random()) |
| | | const state = reactive<stateType>({ |
| | | spiValue: 0, |
| | | spiOptions: [ |
| | | { |
| | | value: 0, |
| | | label: '公司级别SPI' |
| | | }, |
| | | { |
| | | value: 1, |
| | | label: 'A事业部SPI', |
| | | children: [ |
| | | { |
| | | value: 11, |
| | | label: 'A车间SPI' |
| | | }, |
| | | { |
| | | value: 12, |
| | | label: 'B车间SPI' |
| | | }, |
| | | { |
| | | value: 13, |
| | | label: 'C车间SPI' |
| | | } |
| | | ] |
| | | }, |
| | | { |
| | | value: 2, |
| | | label: 'B事业部SPI', |
| | | children: [ |
| | | { |
| | | value: 21, |
| | | label: 'D车间SPI' |
| | | }, |
| | | { |
| | | value: 22, |
| | | label: 'E车间SPI' |
| | | }, |
| | | { |
| | | value: 23, |
| | | label: 'F车间SPI' |
| | | } |
| | | ] |
| | | } |
| | | ], |
| | | spiValue: 1, |
| | | departList: [], |
| | | spiProps: { |
| | | expandTrigger: 'hover', |
| | | checkStrictly: true, |
| | | value: 'depId', |
| | | label: 'depName', |
| | | }, |
| | | spiChart: 'spi-dark' |
| | | }) |
| | | const spiProps = { |
| | | expandTrigger: 'hover', |
| | | checkStrictly: true |
| | | } |
| | | |
| | | // 获取部门列表 |
| | | const getAllDepartment = async () => { |
| | | let res = await teamManageApi().getAllDepartment(); |
| | | if (res.data.code === '200') { |
| | | state.departList = JSON.parse(JSON.stringify(res.data.data)) |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | type EChartsOption = echarts.EChartsOption |
| | | // 隐患整改情况 |
| | | const initSpi =()=>{ |
| | |
| | | grid: { |
| | | left: '8%', |
| | | right: '8%', |
| | | bottom: '4%', |
| | | bottom: '5%', |
| | | }, |
| | | xAxis: [ |
| | | { |
| | |
| | | |
| | | // 页面载入时执行方法 |
| | | onMounted(() => { |
| | | getAllDepartment(); |
| | | initSpi(); |
| | | getTheme(); |
| | | }); |
| | |
| | | return { |
| | | spi, |
| | | Search, |
| | | spiProps, |
| | | fontSize, |
| | | ...toRefs(state) |
| | | }; |