From 06933e0f1e8e9352a05608097dcc49a00b90cf4d Mon Sep 17 00:00:00 2001
From: GGJ <357021191@qq.com>
Date: Thu, 22 Feb 2024 11:34:13 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AE=8C=E6=88=90=20=E7=A8=8B=E5=BA=8F?=
 =?UTF-8?q?=E5=8D=87=E7=BA=A7=E7=AE=A1=E7=90=86=20=20=E8=BF=81=E7=A7=BB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/Business/index.ts                     |   8 +
 .../TerminalManagement/ProgramManagement.vue  | 351 ++++++++++++++++++
 2 files changed, 359 insertions(+)
 create mode 100644 src/views/pms/BusinessAdministrator/TerminalManagement/ProgramManagement.vue

diff --git a/src/api/Business/index.ts b/src/api/Business/index.ts
index 187c29b0..707f9d99 100644
--- a/src/api/Business/index.ts
+++ b/src/api/Business/index.ts
@@ -74,4 +74,12 @@ export function addTerminal(query:any) {
             }
     })
 }
+//查询终端程序版本升级日志
+export function getTerminalUpLog(data:any) {
+    return createAxios({
+        url: '/device-boot/version/getTerminalUpLog',
+        method: 'post',
+        params: data,
+    })
+}
 
diff --git a/src/views/pms/BusinessAdministrator/TerminalManagement/ProgramManagement.vue b/src/views/pms/BusinessAdministrator/TerminalManagement/ProgramManagement.vue
new file mode 100644
index 00000000..5efbbd8e
--- /dev/null
+++ b/src/views/pms/BusinessAdministrator/TerminalManagement/ProgramManagement.vue
@@ -0,0 +1,351 @@
+<template>
+    <div class="default-main" style="position: relative">
+        <TableHeader>
+            <template #select>
+                <el-form-item label="终端型号">
+                    <el-select v-model="tableStore.table.params.teriminal" clearable placeholder="请选择终端型号">
+                        <el-option
+                            v-for="item in teriminaloption"
+                            :key="item.id"
+                            :label="item.name"
+                            :value="item.id"
+                        ></el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="终端状态">
+                    <el-select v-model="tableStore.table.params.teriminalstatus" clearable placeholder="请选择终端状态">
+                        <el-option
+                            v-for="item in teriminalstatusoption"
+                            :key="item.id"
+                            :label="item.name"
+                            :value="item.id"
+                        ></el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="通讯状态">
+                    <el-select v-model="tableStore.table.params.state" clearable placeholder="请选择通讯状态">
+                        <el-option
+                            v-for="item in stateoption"
+                            :key="item.id"
+                            :label="item.name"
+                            :value="item.id"
+                        ></el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="程序版本">
+                    <el-select v-model="tableStore.table.params.program" clearable placeholder="请选择程序版本">
+                        <el-option
+                            v-for="item in programoption"
+                            :key="item.id"
+                            :label="item.name"
+                            :value="item.id"
+                        ></el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="筛选">
+                    <el-input v-model="filterName" @keyup="searchEvent" placeholder="输入关键字筛选" />
+                </el-form-item>
+            </template>
+            <template #operation>
+                <el-button icon="el-icon-Download" type="primary" @click="add">导出</el-button>
+                <el-button icon="el-icon-Check" type="primary" @click="add">批量升级</el-button>
+            </template>
+        </TableHeader>
+        <div :style="{ height: pageHeight.height }">
+            <vxe-table
+                v-loading="tableStore.table.loading"
+                height="auto"
+                auto-resize
+                ref="tableRef"
+                v-bind="defaultAttribute"
+                :data="treeData"
+                :column-config="{ resizable: true }"
+                :tree-config="{}"
+            >
+                <vxe-column field="name" align="left" title="电网拓扑" min-width="200" tree-node></vxe-column>
+                <vxe-column field="devType" title="终端型号" :formatter="formFilter"></vxe-column>
+                <vxe-column field="versionName" title="版本号"></vxe-column>
+                <vxe-column field="protocol" title="协议版本"></vxe-column>
+                <vxe-column field="versionDate" title="版本日期"></vxe-column>
+                <vxe-column field="runFlag" title="终端状态">
+                    <template #default="{ row }">
+                        <el-tag
+                            type="primary"
+                            v-if="row.runFlag === 0"
+                            style="color: #fff; background: #0099cc"
+                            size="small"
+                        >
+                            投运
+                        </el-tag>
+                        <el-tag
+                            type="primary"
+                            v-if="row.runFlag === 1"
+                            style="color: #fff; background: #996600"
+                            size="small"
+                        >
+                            热备用
+                        </el-tag>
+                        <el-tag
+                            type="primary"
+                            v-if="row.runFlag === 2"
+                            style="color: #fff; background: #cc0000"
+                            size="small"
+                        >
+                            停运
+                        </el-tag>
+                    </template>
+                </vxe-column>
+                <vxe-column field="comFlag" title="通讯状态">
+                    <template #default="{ row }">
+                        <el-tag
+                            type="primary"
+                            v-if="row.comFlag === 0"
+                            style="color: #fff; background: #cc0000"
+                            size="small"
+                        >
+                            中断
+                        </el-tag>
+                        <el-tag
+                            type="primary"
+                            v-if="row.comFlag === 1"
+                            style="color: #fff; background: #2e8b57"
+                            size="small"
+                        >
+                            正常
+                        </el-tag>
+                    </template>
+                </vxe-column>
+                <vxe-column field="updateBy" title="升级人员">
+                    <template #default="{ row }">
+                        <span v-if="row.updateBy == null || row.updateBy == '/'">--</span>
+                        <span v-else>{{ row.updateBy }}</span>
+                    </template>
+                </vxe-column>
+                <vxe-column field="updateTime" title="最新升级时间"></vxe-column>
+                <vxe-column field="updateBy" title="升级人员">
+                    <template #default="{ row }">
+                        <el-button v-if="row.level == 4" type="primary" size="small" link @click="updateprogram(row)">
+                            升级
+                        </el-button>
+                        <el-button
+                            v-if="row.level == 4"
+                            :disabled="row.state == 1 ? true : false"
+                            type="primary"
+                            size="small"
+                            link
+                            @click="queryview(row)"
+                        >
+                            日志查看
+                        </el-button>
+                    </template>
+                </vxe-column>
+            </vxe-table>
+        </div>
+        <el-dialog
+            v-model="dialogVisible"
+            :close-on-click-modal="false"
+            :title="protitle + '#终端升级日志查看'"
+            width="70%"
+        >
+            <div :style="{ height: dialogHeight.height }">
+                <vxe-table height="auto" auto-resize :data="logtableData" v-bind="defaultAttribute">
+                    <vxe-column field="devTypeName" align="center" title="装置序号"></vxe-column>
+                    <vxe-column field="versionId" align="center" title="版本序号"></vxe-column>
+                    <vxe-column field="flag" align="center" title="版本状态" width="100">
+                        <template #default="{ row }">
+                            <el-tag type="primary" v-if="row.flag == true" style="color: #fff; background: #fc0">
+                                前期版本
+                            </el-tag>
+                            <el-tag type="primary" v-if="row.flag == false" style="color: #fff; background: #0c0">
+                                当前版本
+                            </el-tag>
+                        </template>
+                    </vxe-column>
+                    <vxe-column field="result" align="center" title="升级结果" width="100">
+                        <template #default="{ row }">
+                            <el-tag type="primary" v-if="row.result == false" style="color: #fff; background: #f30">
+                                升级失败
+                            </el-tag>
+                            <el-tag type="primary" v-if="row.result == true" style="color: #fff; background: #093">
+                                升级成功
+                            </el-tag>
+                        </template>
+                    </vxe-column>
+                    <vxe-column field="state" align="center" title="状态" width="100">
+                        <template #default="{ row }">
+                            <el-tag type="primary" v-if="row.state == false" style="color: #fff; background: #f30">
+                                删除
+                            </el-tag>
+                            <el-tag type="primary" v-if="row.state == true" style="color: #fff; background: #093">
+                                正常
+                            </el-tag>
+                        </template>
+                    </vxe-column>
+                    <vxe-column field="createBy" align="center" title="创建用户"></vxe-column>
+                    <vxe-column field="createTime" align="center" title="创建时间"></vxe-column>
+                    <vxe-column field="updateTime" align="center" title="升级时间"></vxe-column>
+                    <vxe-column field="updateBy" align="center" title="升级人员"></vxe-column>
+                </vxe-table>
+            </div>
+        </el-dialog>
+        <!-- 升级 -->
+        <el-dialog
+            v-model="prodialogVisible"
+            :close-on-click-modal="false"
+            :title="protitle + '#终端程序升级'"
+            width="40%"
+        >
+            <el-col v-for="(item, index) in percentageoption" :key="index">
+                <span style="font-size: 14px; font-weight: bold">{{ item.name }}</span>
+                :
+                <el-progress
+                    :text-inside="true"
+                    :stroke-width="24"
+                    :percentage="item.percentage"
+                    :status="item.status"
+                    :format="format"
+                ></el-progress>
+            </el-col>
+        </el-dialog>
+    </div>
+</template>
+<script setup lang="ts">
+import { ref, onMounted, provide, nextTick } from 'vue'
+import TableStore from '@/utils/tableStore'
+import { defaultAttribute } from '@/components/table/defaultAttribute'
+import TableHeader from '@/components/table/header/index.vue'
+import { mainHeight } from '@/utils/layout'
+import { getTerminalUpLog } from '@/api/Business/index.ts'
+import XEUtils from 'xe-utils'
+import { debounce } from 'lodash-es'
+import { useDictData } from '@/stores/dictData'
+defineOptions({
+    name: 'ProgramManagement'
+})
+
+const pageHeight = mainHeight(83)
+const dialogHeight = mainHeight(300)
+const dictData = useDictData()
+const teriminaloption: any = dictData.getBasicData('Dev_Type')
+const teriminalstatusoption = ref([
+    { name: '全部', id: '' },
+    { name: '投运', id: 0 },
+    { name: '热备用', id: 1 },
+    { name: '停运', id: 2 }
+])
+const stateoption = ref([
+    { name: '全部', id: '' },
+    { name: '正常', id: 1 },
+    { name: '中断', id: 0 }
+])
+const prodialogVisible = ref(false)
+const dialogVisible = ref(false)
+const protitle = ref('')
+const filterName = ref('')
+const treeData: any = ref([])
+//进度条对象
+const percentageoption = ref([
+    {
+        name: '1号测试终端',
+        status: 'exception',
+        percentage: 20
+    },
+    {
+        name: '2号测试终端',
+        status: 'warning',
+        percentage: 50
+    },
+    {
+        name: '3号测试终端',
+        status: 'success',
+        percentage: 90
+    }
+])
+const programoption: any = ref([])
+const logtableData: any = ref([])
+const tableRef = ref()
+const status = ref('')
+const tableStore = new TableStore({
+    url: '/device-boot/version/getTerminalVersionList',
+    method: 'POST',
+    column: [],
+    loadCallback: () => {
+        treeData.value = tableStore.table.data
+        setTimeout(() => {
+            tableRef.value.setAllTreeExpand(true)
+        }, 0)
+    }
+})
+
+provide('tableStore', tableStore)
+tableStore.table.params.searchValue = ''
+tableStore.table.params.searchState = 0
+onMounted(() => {
+    tableStore.index()
+})
+const add = () => {}
+const updateprogram = (row: any) => {
+    protitle.value = row.name
+    prodialogVisible.value = true
+}
+const queryview = (row: any) => {
+    dialogVisible.value = true
+    protitle.value = row.name
+    let data = {
+        id: row.id
+    }
+    getTerminalUpLog(data).then((res: any) => {
+        logtableData.value = res.data
+    })
+}
+const format = (percentage: any) => {
+    if (percentage <= 100 && percentage >= 90) {
+        status.value = 'success'
+        return percentage === 100 ? '升级成功' : `${percentage}%`
+    } else if (percentage > 0 && percentage < 50) {
+        status.value = 'exception'
+        return percentage <= 20 ? '升级失败' + percentage + '%' : `${percentage}%`
+    } else if (percentage > 0 && percentage <= 50) {
+        status.value = 'warning'
+        return percentage <= 50 ? '升级中断' : `${percentage}%`
+    }
+}
+const formFilter = (row: any) => {
+    let title = '/'
+    if (row.cellValue != null) {
+        teriminaloption.forEach((item: any) => {
+            if (item.id == row.cellValue) {
+                title = item.name
+            }
+        })
+    }
+
+    return title
+}
+
+// 表格过滤
+const searchEvent = debounce(e => {
+    const filterVal = XEUtils.toValueString(filterName.value).trim().toLowerCase()
+    if (filterVal) {
+        const options = { children: 'children' }
+        const searchProps = ['name']
+        const rest = XEUtils.searchTree(
+            tableStore.table.data,
+            item => searchProps.some(key => String(item[key]).toLowerCase().indexOf(filterVal) > -1),
+            options
+        )
+
+        treeData.value = rest
+
+        // 搜索之后默认展开所有子节点
+    } else {
+        treeData.value = tableStore.table.data
+    }
+    nextTick(() => {
+        const $table = tableRef.value
+        if ($table) {
+            $table.setAllTreeExpand(true)
+        }
+    })
+}, 300)
+</script>