Merge branch 'master' of http://www.beijingsoft.cn:9090/r/smart-web

lzhe

2024-04-18 e28dcf85c227f3df8f72ec0e436a89233e9d8e0b

Merge branch 'master' of http://www.beijingsoft.cn:9090/r/smart-web

 package.json

@@ -20,6 +20,7 @@
        "deepmerge": "^1.5.2",
        "echarts": "5.4.1",
        "element-plus": "2.2.32",
        "moment": "^2.30.1",
        "nprogress": "0.2.0",
        "qrcodejs2": "0.0.2",
        "qs": "6.7.0",

 src/views/mdc/MYTree.vue

@@ -1,16 +1,17 @@
<!--
 * @Date: 2024-04-18 19:53:35
 * @LastEditors: Sneed
 * @LastEditTime: 2024-04-18 20:56:37
 * @LastEditTime: 2024-04-18 21:30:19
 * @FilePath: /belleson-frontend/Users/mache/Documents/demo/cps-web/src/views/mdc/MYTree.vue
-->
<template>
    <el-tree ref="treeRef" v-bind="$attrs" :show-checkbox="showCheckbox" :current-node-key="currentNodeKey"
        node-key="id" :props="defalutProps" :data="data" @check-change="checkChange" @node-click="handleNodeClick"
        highlight-current default-expand-all></el-tree>
        highlight-current default-expand-all :render-content="renderContent"></el-tree>
</template>

<script>
import pmsPng from '@/assets/pms.png'
export default {
    props: {
        showCheckbox: {
@@ -20,6 +21,7 @@
    },
    data() {
        return {
            pmsPng,
            firstWorkKey: '',
            currentNodeKey: '',
            defalutProps: {
@@ -44,6 +46,16 @@
        this.getList()
    },
    methods: {
        renderContent(h, { data }) {
            let img = data.groupTag == 'fms_beltline'
            return h('span', {

            },
                img ? h('img', {
                    src: pmsPng
                }, '') : '',
                data.title)
        },
        getList() {
            this.$HTTP.post('/api/blade-cps/group/groupWorkstation/type', {
                groupCategory: 1,

 src/views/mdc/components/Shift.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,168 @@
<!--
 * @Date: 2024-04-18 21:52:18
 * @LastEditors: Sneed
 * @LastEditTime: 2024-04-18 23:43:13
 * @FilePath: /belleson-frontend/Users/mache/Documents/demo/cps-web/src/views/mdc/components/Shift.vue
-->
<template>
    <el-row>
        <el-col>
            <el-button-group>
                <el-button :type="btnListActive == item.id ? 'primary' : ''" v-for="item in btnList" :key="item.id">{{
                    item.title }}</el-button>
            </el-button-group>
        </el-col>
        <el-col>
            <el-card shadow="never">
                <scEcharts height="300px" :option="option2"></scEcharts>
            </el-card>
        </el-col>
        <el-col>
            ç»Ÿè®¡æ•°æ®
        </el-col>
        <el-col>
            <scTable ref="table" row-key="id" border :params="params" :apiObj="apiObj" stripe>
                <el-table-column prop="workstationCode" label="工位编码" />
                <el-table-column prop="workstationName" label="工位名称" />
                <el-table-column prop="" label="班次1">
                    <template #default="scope">
                        <span>{{ scope.row.nameData['1'] }}</span>
                    </template>
                </el-table-column>
                <el-table-column prop="" label="效率">
                    <template #default="scope">
                        <span>{{ scope.row.data['1'] }}</span>
                    </template>
                </el-table-column>
                <el-table-column prop="" label="班次2">
                    <template #default="scope">
                        <span>{{ scope.row.nameData['2'] }}</span>
                    </template>
                </el-table-column>
                <el-table-column prop="" label="效率">
                    <template #default="scope">
                        <span>{{ scope.row.data['2'] }}</span>
                    </template>
                </el-table-column>
            </scTable>
        </el-col>
    </el-row>
</template>

<script>
import scEcharts from '@/components/scEcharts';
export default {
    components: {
        scEcharts
    },
    data() {
        return {
            apiObj: '',
            params: {},
            statisticalMethod: 'SHIFT',
            btnList: [],
            btnListActive: '',
            chartsData: [],
            option2: {
                title: {
                    text: '统计图表',
                    subtext: '基础折线图',
                },
                grid: {
                    top: '80px'
                },
                tooltip: {
                    trigger: 'axis'
                },
                xAxis: {
                    type: 'category',
                    data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
                },
                yAxis: {
                    type: 'value'
                },
                series: [{
                    data: [120, 200, 150, 80, 70, 110, 130],
                    type: 'line',
                },
                {
                    data: [110, 180, 120, 120, 60, 90, 110],
                    type: 'line',
                }]
            },
        }
    },
    methods: {
        init(params) {
            this.getTime({
                endDate: params.endDate,
                startDate: params.startDate,
                statisticalMethod: this.statisticalMethod
            }).then(res => {
                this.query({
                    ...params,
                    startDate: this.btnListActive,
                    endDate: this.btnListActive
                })
                this.queryChart({
                    ...params,
                    startDate: this.btnListActive,
                    endDate: this.btnListActive
                })
            })

        },
        getTime(data) {
            return this.$HTTP.post('/api/blade-mdc/efficiency-analysis/interval', {
                ...data
            }).then(res => {
                if (res.code === 200) {
                    this.btnList = res.data
                    this.btnListActive = res?.data?.[0]?.id
                }
            })
        },
        queryChart(data) {
            let params = {
                size: -1
            }
            let dataSend = {
                ...data,
                queryType: 0,
                statisticalMethod: this.statisticalMethod
            }
            return this.$HTTP.post('/api/blade-mdc/efficiency-analysis', dataSend, { params }).then(res => {
                this.chartsData = res.data.items.records
            })
        },
        query(params) {
            this.params = params
            this.apiObj = {
                get: async (data) => {
                    let params = {
                        current: data.current,
                        size: data.size
                    }
                    let dataSend = {
                        ...data,
                        queryType: 1,
                        statisticalMethod: this.statisticalMethod
                    }
                    delete dataSend.current
                    delete dataSend.size
                    delete dataSend.order
                    delete dataSend.prop
                    return await this.$HTTP.post('/api/blade-mdc/efficiency-analysis', dataSend, { params }).then(res => {
                        return {
                            ...res,
                            data: res.data.items
                        }
                    })
                }
            }
        }
    }
}
</script>

<style lang="scss" scoped></style>

 src/views/mdc/components/Time.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,19 @@
<!--
 * @Date: 2024-04-18 21:52:28
 * @LastEditors: Sneed
 * @LastEditTime: 2024-04-18 21:54:53
 * @FilePath: /belleson-frontend/Users/mache/Documents/demo/cps-web/src/views/mdc/components/Time.vue
-->
<template>
    <div>

    </div>
</template>

<script>
export default {

}
</script>

<style lang="scss" scoped></style>

 src/views/mdc/efficiency-analysis.vue

@@ -1,55 +1,120 @@
<!--
 * @Date: 2024-04-09 22:11:21
 * @LastEditors: Sneed
 * @LastEditTime: 2024-04-18 20:57:46
 * @LastEditTime: 2024-04-18 22:47:36
 * @FilePath: /belleson-frontend/Users/mache/Documents/demo/cps-web/src/views/mdc/efficiency-analysis.vue
 * æ•ˆçŽ‡åˆ†æž
-->
<template>
    <el-main>
        <el-card shadow="never">
            <el-container>
                <el-aside width="200px" v-loading="showGrouploading">
    <el-main style="height: 100%;">
        <el-card shadow="never" style="height: 100%;" body-style="height: 100%">
            <el-container style="height: 100%;">
                <el-aside width="300px" style="height: 100%;">
                    <el-container>
                        <el-main class="nopadding">
                            <el-row>
                                <el-col>统计数据</el-col>
                                <el-col>
                                    <el-select></el-select>
                                    <el-select style="width: 250px" v-model="productivityType">
                                        <el-option v-for="(item, index) in options" :key="index" :label="item.label"
                                            :value="item.value"></el-option>
                                    </el-select>
                                </el-col>
                                <el-col>日期</el-col>
                                <el-col style="margin-top: 14px;">日期</el-col>
                                <el-col>
                                    <el-select></el-select>
                                    <el-date-picker value-format="YYYY-MM-DD" style="width: 250px" v-model="time"
                                        type="daterange" range-separator="-" start-placeholder="" end-placeholder="" />
                                </el-col>
                            </el-row>
                            <el-row style="margin-top: 14px;">
                                å·¥ä½
                            </el-row>
                            <MYTree v-model="treeChecked" show-checkbox></MYTree>
                        </el-main>
                        <el-footer>
                            <el-button @click="query">查询</el-button>
                            <el-button>导出</el-button>
                        </el-footer>
                    </el-container>
                </el-aside>
                <el-container>
                    <el-main>
                        <el-tabs tab-position="top" v-model="activeName" type="card">
                            <el-tab-pane label="按班次统计" name="shift">
                                <Shift ref="shift" v-if="activeName == 'shift'" />
                            </el-tab-pane>
                            <el-tab-pane label="按时间周期统计" name="time">
                                <Time ref="time" v-if="activeName == 'time'" />
                            </el-tab-pane>
                        </el-tabs>
                    </el-main>
                </el-container>
            </el-container>
        </el-card>
    </el-main>
</template>

<script>
import moment from 'moment';
import MYTree from './MYTree.vue'
import Shift from './components/Shift.vue'
import Time from './components/Time.vue'

export default {
    components: {
        MYTree,
        Shift,
        Time
    },
    watch: {
        treeChecked(value) {
            this.query(value)
            // this.query(value)
        }
    },
    data() {
        return {
            treeChecked: []
            activeName: 'shift',
            productivityType: 'OEE',
            time: [],
            treeChecked: [],
            options: [
                {
                    label: '稼动率',
                    value: 'OEE',
                },
                {
                    label: '报警率',
                    value: 'ALARM',
                },
                {
                    label: '运行率',
                    value: 'RUNNING',
                },
            ]
        }
    },
    created() {
        this.time = [moment().format('YYYY-MM-DD'), moment().format('YYYY-MM-DD')]
    },
    mounted() {
        this.query()
    },
    methods: {
        query(vals) {
            console.log([...vals])
        query() {
            this.$refs[this.activeName].init({
                endDate: this.time[1],
                startDate: this.time[0],
                productivityType: this.productivityType,
                shiftIndexList: [1, 2],
                workStationIdList: [...this.treeChecked]
            })
            // this.$HTTP.post('/api/blade-mdc/efficiency-analysis?size=-1', {

            // })
            // this.$HTTP.post('/api/blade-mdc/efficiency-analysis?current=1&size=15', {

            // })
            // this.$HTTP.post('/api/blade-cps/workstation-wcs-feedback/feedback-status', [...vals])
        }
    }
}