From 2fde4b5e92cf74f7cf9b7a798ba52577753ef90d Mon Sep 17 00:00:00 2001
From: xiangpei <xiangpei@timesnew.cn>
Date: 星期五, 16 八月 2024 16:55:32 +0800
Subject: [PATCH] 自定义列图标
---
src/views/system/platform/index.vue | 265 +++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 265 insertions(+), 0 deletions(-)
diff --git a/src/views/system/platform/index.vue b/src/views/system/platform/index.vue
new file mode 100644
index 0000000..c15a226
--- /dev/null
+++ b/src/views/system/platform/index.vue
@@ -0,0 +1,265 @@
+<template>
+ <div class="app-container">
+ <el-form :model="queryParams" ref="queryForm" size="small" :inline="true">
+ <el-form-item label="骞冲彴鍚嶇О" prop="workOrderNo">
+ <el-input v-model="queryParams.platformName" placeholder="鍏抽敭璇嶆悳绱�" @clear="handleQuery" @keyup.enter.native="handleQuery" size="small"></el-input>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" icon="el-icon-search" size="small" @click="handleQuery">鎼滅储</el-button>
+ <el-button icon="el-icon-refresh" size="small" @click="resetQuery">閲嶇疆</el-button>
+ </el-form-item>
+ </el-form>
+
+ <el-row :gutter="10" class="mb8">
+ <el-col :span="1.5">
+ <el-button
+ type="primary"
+ plain
+ size="mini"
+ @click="handleAdd"
+ v-hasPermi="['platform:add']"
+ >娣诲姞
+ </el-button>
+ </el-col>
+ <el-col :span="1.5">
+ <el-button
+ type="danger"
+ plain
+ size="mini"
+ @click=""
+ v-hasPermi="['platform:del']"
+ >鍒犻櫎
+ </el-button>
+ </el-col>
+ </el-row>
+
+ <div>
+ <el-table
+ :data="tableData"
+ :span-method="spanMethod"
+ border
+ style="width: 100%; margin-top: 20px">
+ <el-table-column
+ prop="platformName"
+ label="骞冲彴鍚嶇О">
+ </el-table-column>
+ <el-table-column
+ prop="area"
+ label="琛屾斂鍖哄煙">
+ </el-table-column>
+ <el-table-column
+ prop="platformIP"
+ label="骞冲彴IP">
+ </el-table-column>
+ <el-table-column
+ prop="status"
+ label="鏄惁鍦ㄧ嚎">
+ </el-table-column>
+ <el-table-column
+ prop="monthOutLine"
+ label="鏈湀绂荤嚎鏃堕暱">
+ </el-table-column>
+ </el-table>
+
+ <pagination
+ v-show="total>0"
+ :total="total"
+ :page.sync="queryParams.pageNum"
+ :limit.sync="queryParams.pageSize"
+ @pagination="handleQuery"
+ />
+ </div>
+
+ <el-dialog
+ title="鏂板骞冲彴"
+ :visible.sync="addShow"
+ width="1000px"
+ :before-close="addClose">
+ <div style="display: flex; flex-direction: row">
+ <div style="flex: 2; padding-right: 20px;">
+ <div>
+ <h3>骞冲彴淇℃伅锛�</h3>
+ </div>
+ <el-form :model="addForm" :rules="addFormRules" ref="addForm" size="small">
+ <el-form-item label="骞冲彴鍚嶇О" prop="platformName">
+ <el-input v-model="addForm.platformName"></el-input>
+ </el-form-item>
+ <el-form-item label="骞冲彴IP" prop="platformIP">
+ <el-input v-model="addForm.platformIP"></el-input>
+ </el-form-item>
+ <el-form-item label="澶囨敞淇℃伅" prop="mark">
+ <el-input v-model="addForm.remark"></el-input>
+ </el-form-item>
+ </el-form>
+ </div>
+ <div style="flex: 4; padding-left: 20px;border-left: 1px solid #b2b2b2; min-height: 400px">
+ <div>
+ <h3>閮ㄧ讲淇℃伅锛�</h3>
+ </div>
+ <div v-for="(deploy, index) in addForm.deployList" :key="index" style="margin-bottom: 20px">
+ <el-form size="small" ref="deployForm" :inline="true">
+ <el-form-item label="骞冲彴鍚嶇О" prop="platformName">
+ <el-input v-model="deploy.platformName"></el-input>
+ </el-form-item>
+ <el-form-item label="骞冲彴IP" prop="platformIP">
+ <el-input v-model="deploy.platformIP"></el-input>
+ </el-form-item>
+ <el-form-item label="琛屾斂鍖哄煙" prop="area">
+ <el-input v-model="deploy.area"></el-input>
+ </el-form-item>
+ <el-form-item label="澶囨敞淇℃伅" prop="remark">
+ <el-input v-model="deploy.remark"></el-input>
+ </el-form-item>
+ </el-form>
+ </div>
+ <el-button style="float: right" size="small" type="primary" @click="next">缁х画娣诲姞</el-button>
+ </div>
+ </div>
+
+ <span slot="footer" class="dialog-footer">
+ <el-button @click="addClose">鍙� 娑�</el-button>
+ <el-button type="primary" @click="addPlatform">淇濆瓨</el-button>
+ </span>
+ </el-dialog>
+
+ </div>
+</template>
+
+<script>
+import { getPlatforms, addPlatform} from '@/api/platform/platform'
+export default {
+ name: 'index',
+ data() {
+ return {
+ deployRules: {
+ platformName: [
+ { required: true, message: '骞冲彴鍚嶇О涓嶈兘涓虹┖', trigger: 'blur' }
+ ],
+ platformIP: [
+ { required: true, message: '骞冲彴IP涓嶈兘涓虹┖', trigger: 'blur' }
+ ],
+ area: [
+ { required: true, message: '琛屾斂鍖哄煙涓嶈兘涓虹┖', trigger: 'blur' }
+ ]
+ },
+ addFormRules: {
+ platformName: [
+ { required: true, message: '骞冲彴鍚嶇О涓嶈兘涓虹┖', trigger: 'blur' }
+ ],
+ platformIP: [
+ { required: true, message: '骞冲彴IP涓嶈兘涓虹┖', trigger: 'blur' }
+ ]
+ },
+ addForm: {
+ platformName: '',
+ remark: '',
+ platformIp: '',
+ deployList: [
+ {
+ platformName: '',
+ platformIp: '',
+ remark: '',
+ area: ''
+ }
+ ] // 閮ㄧ讲鍦ㄤ簡鍝簺鍦版柟
+ },
+ addShow: false,
+ timeRange: [],
+ queryParams: {
+ platformName: ''
+ },
+ tableData: [],
+ total: 0
+ }
+ },
+ mounted() {
+ this.getList();
+ },
+ methods: {
+ next() {
+ this.addForm.deployList.push({
+ platformName: '',
+ platformIp: '',
+ remark: '',
+ area: ''
+ })
+ },
+ handleAdd() {
+ this.addShow = true
+ },
+ checkDeployList() {
+ if (this.addForm.deployList) {
+ this.addForm.deployList = this.addForm.deployList.filter(item => {
+ return item.platformName || item.platformIp || item.remark || item.area;
+ })
+ }
+ },
+ addPlatform() {
+ this.$refs['addForm'].validate((valid) => {
+ if (valid) {
+ this.checkDeployList()
+ if (this.addForm.deployList) {
+ console.log(this.addForm.deployList)
+ if (this.addForm.deployList.some(item => !item.platformName || !item.platformIP || !item.area)) {
+ this.$message.error("璇锋鏌ュ钩鍙伴儴缃蹭俊鎭槸鍚﹀～鍐欏畬鏁�");
+ return; // 閫�鍑� validate 鍥炶皟
+ }
+ }
+ addPlatform(this.addForm).then(res => {
+ this.$message.success("娣诲姞鎴愬姛")
+ this.addShow = false
+ this.getList()
+ })
+ }
+ })
+ },
+ addClose() {
+ this.addShow = false
+ // this.addForm = {
+ // platformName: '',
+ // remark: '',
+ // platformIp: '',
+ // deployList: []
+ // }
+ },
+ getList() {
+ this.loading = true
+ this.queryParams['start'] = this.timeRange ? this.timeRange[0] : null
+ this.queryParams['end'] = this.timeRange ? this.timeRange[1] : null
+ getPlatforms(this.queryParams).then(res => {
+ this.tableData = res.data
+ this.total = res.total
+ this.loading = false
+ })
+ },
+ resetQuery() {
+ this.daterangeYwHandleTime = []
+ this.resetForm('queryForm')
+ this.handleQuery()
+ },
+ handleQuery() {
+ this.queryParams.pageNum = 1
+ this.getList()
+ },
+ spanMethod({ row, column, rowIndex, columnIndex }) {
+ if (columnIndex === 0) {
+ if (rowIndex % 2 === 0) {
+ return {
+ rowspan: 2,
+ colspan: 1
+ };
+ } else {
+ return {
+ rowspan: 0,
+ colspan: 0
+ };
+ }
+ }
+ }
+ }
+}
+</script>
+
+<style scoped>
+
+</style>
--
Gitblit v1.8.0