|
@@ -0,0 +1,358 @@
|
|
|
+<template>
|
|
|
+ <div class="app-container">
|
|
|
+ <!-- 筛选start -->
|
|
|
+ <div class="filter-container mb-10">
|
|
|
+ <div class="left">
|
|
|
+ <div>
|
|
|
+ <a class="" style="margin-right: 30px">登录日志列表待排版</a>
|
|
|
+ <!-- <el-button
|
|
|
+ icon="el-icon-plus"
|
|
|
+ type="success"
|
|
|
+ @click="addItem()"
|
|
|
+ >
|
|
|
+ 添加模板
|
|
|
+ </el-button> -->
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="filter-container mb-10">
|
|
|
+ <div style="margin-top: 20px">
|
|
|
+ <div class="filter-item">
|
|
|
+ 平台名称:
|
|
|
+ <el-input
|
|
|
+ v-model="platformName"
|
|
|
+ placeholder="请输入内容"
|
|
|
+ style="width: 150px"
|
|
|
+ ></el-input>
|
|
|
+ </div>
|
|
|
+
|
|
|
+
|
|
|
+ <div class="filter-item planOutage">
|
|
|
+ 选择时间范围:
|
|
|
+ <el-date-picker
|
|
|
+ v-model="dateTime"
|
|
|
+ type="datetimerange"
|
|
|
+ range-separator="至"
|
|
|
+ start-placeholder="开始日期"
|
|
|
+ end-placeholder="结束日期"
|
|
|
+ style="width: auto"
|
|
|
+ ></el-date-picker>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ icon="el-icon-search"
|
|
|
+ @click="Select()"
|
|
|
+ class="search-button"
|
|
|
+ >
|
|
|
+ 查询
|
|
|
+ </el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 筛选end -->
|
|
|
+
|
|
|
+ <!-- 表格start -->
|
|
|
+ <el-table
|
|
|
+ :data="tableData"
|
|
|
+ border
|
|
|
+ stripe
|
|
|
+ :header-cell-style="headClass"
|
|
|
+ :cell-style="cellStyle"
|
|
|
+ >
|
|
|
+ <el-table-column type="index" label="序号" width="50px"></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="platformName"
|
|
|
+ label="平台名称"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="tenantCount"
|
|
|
+ label="在用租户数"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="createTime"
|
|
|
+ label="创建时间"
|
|
|
+ ></el-table-column>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ <el-table-column fixed="right" label="操作" width="80">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-button
|
|
|
+ type="text"
|
|
|
+ size="small"
|
|
|
+ @click.prevent="editRow(scope.row)"
|
|
|
+ >
|
|
|
+ 编辑
|
|
|
+ </el-button>
|
|
|
+
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <!-- 表格end -->
|
|
|
+
|
|
|
+ <!-- 分页start -->
|
|
|
+ <div class="paginationBlock">
|
|
|
+ <el-pagination
|
|
|
+ v-model:currentPage="page"
|
|
|
+ :page-sizes="[15, 20, 25, 30]"
|
|
|
+ :page-size="pageSize"
|
|
|
+ layout="total, sizes, prev, pager, next, jumper"
|
|
|
+ :total="total"
|
|
|
+ @size-change="handleSizeChange"
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
+ background
|
|
|
+ ></el-pagination>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 分页end -->
|
|
|
+
|
|
|
+ <!--弹框组件开始-----------------------start-->
|
|
|
+ <dialog-component
|
|
|
+ :dialog-title="dialogTitle"
|
|
|
+ :item-info="tableItem"
|
|
|
+ @closeDialog="closeDialog"
|
|
|
+ :show_Dialog="showDialog"
|
|
|
+ ></dialog-component>
|
|
|
+ <!--弹框组件开始-----------------------end-->
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import { useStore } from 'vuex'
|
|
|
+import { defineComponent, onMounted, ref } from 'vue'
|
|
|
+import DialogComponent from './dialogComponent'
|
|
|
+import * as api from '@/api/platManage/index.js'
|
|
|
+import { ElMessage } from 'element-plus'
|
|
|
+
|
|
|
+export default defineComponent({
|
|
|
+ name: 'VariableList',
|
|
|
+
|
|
|
+ components: { DialogComponent },
|
|
|
+ setup() {
|
|
|
+ const store = useStore()
|
|
|
+
|
|
|
+ const tableItem = ref()
|
|
|
+ const dialogTitle = ref('')
|
|
|
+ const showDialog = ref(false)
|
|
|
+
|
|
|
+ const tableData = ref()
|
|
|
+ const currentPage = ref(1)
|
|
|
+ const pageSize = ref(15)
|
|
|
+ const total = ref(0)
|
|
|
+
|
|
|
+ const status = ref(0)
|
|
|
+ const createTime = ref('')
|
|
|
+ const platformName = ref('')
|
|
|
+ const tenantCount = ref('')
|
|
|
+
|
|
|
+ const dateTime = ref('')
|
|
|
+ const select = ref(1)
|
|
|
+
|
|
|
+ const input = ref('')
|
|
|
+ const region = ref()
|
|
|
+
|
|
|
+ // 添加操作
|
|
|
+ const addItem = () => {
|
|
|
+ tableItem.value = {
|
|
|
+ platformName: '',
|
|
|
+ tenantCount: '',
|
|
|
+ tenantTerm: 3,
|
|
|
+ geoPosition: '',
|
|
|
+ createTime: '',
|
|
|
+ phoneNumber: '',
|
|
|
+ systemName: '',
|
|
|
+ email: '',
|
|
|
+ address: '',
|
|
|
+ status:0,
|
|
|
+ domain:''
|
|
|
+ }
|
|
|
+ dialogTitle.value = '添加模板'
|
|
|
+ showDialog.value = true
|
|
|
+ }
|
|
|
+ // 编辑操作
|
|
|
+ const editRow = (row) => {
|
|
|
+ console.log(row)
|
|
|
+ tableItem.value = {
|
|
|
+ id:row.id,
|
|
|
+ platformName: row.platformName,
|
|
|
+ tenantCount: row.tenantCount,
|
|
|
+ tenantTerm: row.tenantTerm=='永久有效'?3:4,
|
|
|
+ value1:row.tenantTerm,
|
|
|
+ status: Number(row.status),
|
|
|
+ geoPosition: row.geoPosition,
|
|
|
+ createTime: Number(row.createTime),
|
|
|
+ phoneNumber: row.phoneNumber,
|
|
|
+ systemName: Number(row.systemName),
|
|
|
+ email: row.email,
|
|
|
+ address: row.address,
|
|
|
+ remark:row.remark,
|
|
|
+ domain:row.domain
|
|
|
+ }
|
|
|
+ dialogTitle.value = '编辑'
|
|
|
+ showDialog.value = true
|
|
|
+ }
|
|
|
+
|
|
|
+ // 关闭操作
|
|
|
+ const closeDialog = (flag) => {
|
|
|
+ if (flag) {
|
|
|
+ // 重新刷新表格内容
|
|
|
+ // this.fetchData()
|
|
|
+ console.log(1)
|
|
|
+ }
|
|
|
+ showDialog.value = false
|
|
|
+ Select()
|
|
|
+ }
|
|
|
+
|
|
|
+ //删除 是否删除 ---- 是
|
|
|
+ const handleDelete = (row) => {
|
|
|
+ api.plannedOutageDel({ id: row.id }).then((requset) => {
|
|
|
+ if (requset.status === 'SUCCESS') {
|
|
|
+ ElMessage.success({
|
|
|
+ message: '删除成功',
|
|
|
+ type: 'success',
|
|
|
+ })
|
|
|
+ Select()
|
|
|
+ } else {
|
|
|
+ ElMessage.error(requset.msg)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ //是否删除 ---- 否
|
|
|
+ const cancelEvent = () => {
|
|
|
+ console.log('cancel!')
|
|
|
+ }
|
|
|
+
|
|
|
+ //查询列表
|
|
|
+ function Select() {
|
|
|
+ store.commit('TimeAll_function', dateTime.value)
|
|
|
+ const time = store.state.Time_Data
|
|
|
+ api
|
|
|
+ .getPlatformList({
|
|
|
+ size: pageSize.value,
|
|
|
+ page: currentPage.value,
|
|
|
+ startTime: time[0] ? time[0] : '',
|
|
|
+ endTime: time[1] ? time[1] : '',
|
|
|
+ // status: status.value,
|
|
|
+ // createTime: createTime.value,
|
|
|
+ platformName: platformName.value,
|
|
|
+ // tenantCount: tenantCount.value,
|
|
|
+ })
|
|
|
+ .then((requset) => {
|
|
|
+ if (requset.status === 'SUCCESS') {
|
|
|
+ tableData.value = requset.data.records.map((val) => {
|
|
|
+ store.commit('getTimestampAll', val.startTime)
|
|
|
+ val.startTime = store.state.timeProcessing
|
|
|
+ store.commit('getTimestampAll', val.endTime)
|
|
|
+ val.endTime = store.state.timeProcessing
|
|
|
+ store.commit('getTimestampAll', val.createTime)
|
|
|
+ val.createTime = store.state.timeProcessing
|
|
|
+ })
|
|
|
+ tableData.value = requset.data.records
|
|
|
+ total.value = requset.data.total
|
|
|
+ } else {
|
|
|
+ ElMessage.error(requset.msg)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ onMounted(() => {
|
|
|
+ Select()
|
|
|
+ })
|
|
|
+
|
|
|
+ const handleSizeChange = (val) => {
|
|
|
+ pageSize.value = val
|
|
|
+ Select()
|
|
|
+ }
|
|
|
+ const handleCurrentChange = (val) => {
|
|
|
+ currentPage.value = val
|
|
|
+ Select()
|
|
|
+ }
|
|
|
+ // 表头样式设置
|
|
|
+ const goVariableList = () => {
|
|
|
+ // 跳转至订单列表页面传参
|
|
|
+ this.$router.push({
|
|
|
+ path: '../siteManage/variableList/index.vue',
|
|
|
+ })
|
|
|
+ // this.$router.push({ name:'variableList'})
|
|
|
+ }
|
|
|
+ const headClass = () => {
|
|
|
+ return 'background:#FAFAFA;'
|
|
|
+ }
|
|
|
+ //处理状态状态值变色
|
|
|
+ const cellStyle = ({ row, column, rowIndex, columnIndex }) => {
|
|
|
+ row, column, rowIndex
|
|
|
+ // console.log(row, column, rowIndex)
|
|
|
+
|
|
|
+ if (columnIndex) {
|
|
|
+ // return `text-align:left;cursor:pointer;`
|
|
|
+ } else {
|
|
|
+ return ''
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ //导出
|
|
|
+ const DataReportExport = () => {
|
|
|
+ store.commit('TimeAll_function', dateTime.value)
|
|
|
+ const time = store.state.Time_Data
|
|
|
+ api
|
|
|
+ .outagePlanListExport({
|
|
|
+ type: region.value,
|
|
|
+ startTime: time[0] ? time[0] : '',
|
|
|
+ endTime: time[1] ? time[1] : '',
|
|
|
+ })
|
|
|
+ .then((requset) => {
|
|
|
+ if (requset.status === 'SUCCESS') {
|
|
|
+ window.location.href = window.PLATFROM_CONFIG.fileUrl + requset.data
|
|
|
+ ElMessage.success({
|
|
|
+ message: '导出成功',
|
|
|
+ type: 'success',
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ ElMessage.error(requset.msg)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ return {
|
|
|
+ cellStyle,
|
|
|
+ headClass,
|
|
|
+ goVariableList,
|
|
|
+
|
|
|
+ handleDelete,
|
|
|
+ cancelEvent,
|
|
|
+ closeDialog,
|
|
|
+ editRow,
|
|
|
+ addItem,
|
|
|
+ Select,
|
|
|
+
|
|
|
+ store,
|
|
|
+
|
|
|
+ total,
|
|
|
+ pageSize,
|
|
|
+ currentPage,
|
|
|
+ handleSizeChange,
|
|
|
+ handleCurrentChange,
|
|
|
+
|
|
|
+ createTime,
|
|
|
+ tableData,
|
|
|
+ platformName,
|
|
|
+ tenantCount,
|
|
|
+ status,
|
|
|
+
|
|
|
+ showDialog,
|
|
|
+ select,
|
|
|
+ dateTime,
|
|
|
+ tableItem,
|
|
|
+ dialogTitle,
|
|
|
+ input,
|
|
|
+ region,
|
|
|
+
|
|
|
+ DataReportExport,
|
|
|
+ }
|
|
|
+ },
|
|
|
+})
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+</style>
|