Skip to content

H
haoban-operation-4
Commit 95e7713d by 无尘
Options

feat: 增加接口

parent f6c767a2
Showing with 177 additions and 61 deletions
src/api/sql.js
......@@ -4,21 +4,38 @@
* @Author: 无尘
* @Date: 2020-11-09 11:22:08
* @LastEditors: 无尘
* @LastEditTime: 2020-11-10 14:48:12
* @LastEditTime: 2020-11-11 15:13:39
*/
import getFetch from './get-fetch';
let api = {
getProjectList: '/', // 获取项目列表,
getTableList: '/', // 获取表列表,
getSqlList: '/', // 获取 sql 列表,
getProjectList: "/list-project", // 获取项目列表,
getTableList: "/list-table", // 获取表列表,
getSqlList: "/list-sql", // 获取 sql 列表,
addSqlIndex: {
url: '/', // 添加索引
method: 'post',
url: "/perfect-sql-index", // 添加索引
method: "post",
useFormData: true,
useIntercept: false
},
getSqlDetail: '/', // 获取 sql 详情
setPerfect: {
url: "/sql-perfect-need", // 完善开关
method: "post",
useFormData: true,
useIntercept: false
},
setStatus: {
url: "/sql-online", // 上线开关
method: "post",
useFormData: true,
useIntercept: false
},
exportData: {
url: "/exportList", // 导出
method: "post",
useFormData: true,
useIntercept: false
}
};
api = getFetch(api, '/hb-manage-operation-web');
......
src/components/sql/index-dialog.vue
......@@ -4,9 +4,12 @@
* @Author: 无尘
* @Date: 2020-11-10 13:46:15
* @LastEditors: 无尘
* @LastEditTime: 2020-11-10 15:04:20
* @LastEditTime: 2020-11-11 15:31:09
-->
<!-- -->
<!--
<index-dialog :sql-check-sql-id="sqlCheckSqlId"></index-dialog>
import indexDialog from '@/components/sql/index-dialog.vue';
-->
<template>
<el-dialog title="完善索引" :visible.sync="dialogVisible" width="600px" :before-close="handleClose">
<div class="">
......@@ -31,19 +34,20 @@ const { addSqlIndex } = fetch;
import showMsg from '@/common/js/showmsg';
export default {
name: '',
name: 'IndexDialog',
components: {},
props: {
sqlId: {
sqlCheckSqlId: {
type: String
}
},
data() {
return {
userInfo: localStorage.getItem('haobanOperate') ? JSON.parse(localStorage.getItem('haobanOperate')) : { id: '', userMobile: '', realName: '', },
dialogVisible: true,
loadBtn: false,
ruleForm: {
sqlId: '',
sqlCheckSqlId: '',
sqlIndex: ''
},
rules: {
......@@ -54,8 +58,8 @@ export default {
// 生命周期 - 挂载完成（访问DOM元素）
mounted() {
const that = this;
if (that.sqlId) {
that.ruleForm.sqlId = that.sqlId;
if (that.sqlCheckSqlId) {
that.ruleForm.sqlCheckSqlId = that.sqlCheckSqlId;
}
},
// methods
......@@ -91,8 +95,9 @@ export default {
const that = this;
that.loadBtn = true;
const data = {
sqlId: that.ruleForm.sqlId,
sqlCheckSqlId: that.ruleForm.sqlCheckSqlId,
sqlIndex: emojiToStr(that.ruleForm.sqlIndex),
commitId: that.userInfo.id
};
addSqlIndex(data)
.then(res => {
......
src/components/sql/sql-detail.vue
......@@ -4,27 +4,30 @@
* @Author: 无尘
* @Date: 2020-11-10 13:46:26
* @LastEditors: 无尘
* @LastEditTime: 2020-11-10 15:06:15
* @LastEditTime: 2020-11-11 15:31:23
-->
<!--
<sql-detail :sql-row="sqlRow"></sql-detail>
import sqlDetail from '@/components/sql/sql-detail.vue';
-->
<template>
<el-dialog title="SQL 详情" :visible.sync="dialogVisible" width="600px" :before-close="handleClose">
<div class="">
<el-form :model="ruleForm" ref="ruleForm" label-width="10px" class="demo-ruleForm" @submit.native.prevent>
<el-form-item label="项目名称" prop="">
{{ruleForm.projectName || '--'}}
{{ruleForm.sqlCheckProjectName || '--'}}
</el-form-item>
<el-form-item label="表名称" prop="">
{{ruleForm.tableName || '--'}}
{{ruleForm.sqlCheckTableName || '--'}}
</el-form-item>
<el-form-item label="SQL" prop="">
<el-input class="w-440" readonly type="textarea" rows="3" v-model="ruleForm.sqlIndex" maxlength="500" show-word-limit></el-input>
<el-input class="w-440" readonly type="textarea" rows="3" v-model="ruleForm.sqlCheckSql" maxlength="500" show-word-limit></el-input>
</el-form-item>
<el-form-item label="完善状态" prop="">
{{ruleForm.projectName || '--'}}
{{ruleForm.sqlCheckIndexType ? '已完善':'未完善'}}
</el-form-item>
<el-form-item label="上线状态" prop="">
{{ruleForm.tableName || '--'}}
{{ruleForm.statusFlag ? '已上线':'未上线'}}
</el-form-item>
</el-form>
</div>
......@@ -33,7 +36,7 @@
<script>
export default {
name: '',
name: 'SqlDetail',
components: {},
props: {
sqlRow: {
......@@ -48,10 +51,12 @@ export default {
dialogVisible: true,
loadBtn: false,
ruleForm: {
sqlId: '',
sqlIndex: '',
projectName: '',
tableName: ''
sqlCheckSqlId: '',
sqlCheckSql: '',
sqlCheckProjectName: '',
sqlCheckTableName: '',
sqlCheckIndexType: '',
statusFlag: ''
}
};
},
......
src/views/sql/project-sql.vue
......@@ -4,7 +4,7 @@
* @Author: 无尘
* @Date: 2020-11-09 11:15:16
* @LastEditors: 无尘
* @LastEditTime: 2020-11-11 10:06:58
* @LastEditTime: 2020-11-11 11:26:03
-->
<template>
<div class="common-right">
......@@ -13,7 +13,7 @@
</div>
<el-table class="select-table" ref="multipleTable" v-loading="loading" :data="tableData" tooltip-effect="dark" :style="{ width: '100%', minHeight: tableH }">
<el-table-column label="项目名称" show-overflow-tooltip>
<template slot-scope="scope">{{ scope.row.projectName || '--' }}</template>
<template slot-scope="scope">{{ scope.row.sqlCheckProjectName || '--' }}</template>
</el-table-column>
<el-table-column prop="" label="创建时间" show-overflow-tooltip>
<template slot-scope="scope">
......@@ -109,12 +109,13 @@ export default {
const that = this;
that.loading = true;
const param = {
project: that.searchInput,
pageNum: that.currentPage,
pageSize: that.pageSize
};
getProjectList(param).then(res => {
that.loading = false;
that.tableData = res.result.list || [];
that.tableData = res.result.result || [];
that.total = res.result.totalCount || 0;
})
.catch(function(error) {
......@@ -128,7 +129,7 @@ export default {
*/
toSqlPage(row) {
const that = this;
that.$router.push(`/sql-list?projectId=${row.projectId}`);
that.$router.push(`/sql-list?sqlCheckProjectId=${row.sqlCheckProjectId}`);
}
},
watch: {}
......
src/views/sql/sql-list.vue
......@@ -4,15 +4,15 @@
* @Author: 无尘
* @Date: 2020-11-09 11:16:12
* @LastEditors: 无尘
* @LastEditTime: 2020-11-11 11:00:10
* @LastEditTime: 2020-11-11 15:39:52
-->
<!-- -->
<template>
<div class="common-right">
<div class="m-b-20">
<el-input placeholder="SQL搜索" maxlength="150" v-model="searchInput" class="w-274" @keyup.native="value => toInput(value, searchInput)" clearable @clear="clearInput"></el-input>
<el-date-picker class="m-l-10" v-model="createDate" type="date" placeholder="选择日期"></el-date-picker>
<el-select class="m-l-10 w-130" v-model="perfectState" placeholder="请选择">
<el-date-picker class="m-l-10" v-model="createDate" prefix-icon="el-icon-time" type="daterange" range-separator="~" placeholder="选择日期" @change="changeDate"></el-date-picker>
<el-select class="m-l-10 w-130" v-model="sqlCheckIndexType" placeholder="请选择">
<el-option
v-for="item in perfectOption"
:key="item.value"
......@@ -20,7 +20,7 @@
:value="item.value">
</el-option>
</el-select>
<el-select class="m-l-10 w-130" v-model="onlineState" placeholder="请选择">
<el-select class="m-l-10 w-130" v-model="statusFlag" placeholder="请选择">
<el-option
v-for="item in onlineOption"
:key="item.value"
......@@ -28,7 +28,7 @@
:value="item.value">
</el-option>
</el-select>
<el-select class="m-l-10 w-130" v-model="isPerfect" placeholder="请选择">
<el-select class="m-l-10 w-130" v-model="sqlCheckIndexStatus" placeholder="请选择">
<el-option
v-for="item in isPerfectOption"
:key="item.value"
......@@ -40,32 +40,34 @@
<el-table class="select-table" ref="multipleTable" v-loading="loading" :data="tableData" tooltip-effect="dark" :style="{ width: '100%', minHeight: tableH }" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55"> </el-table-column>
<el-table-column label="项目名称" show-overflow-tooltip>
<template slot-scope="scope">{{ scope.row.projectName || '--' }}</template>
<template slot-scope="scope">{{ scope.row.sqlCheckProjectName || '--' }}</template>
</el-table-column>
<el-table-column label="表名称" show-overflow-tooltip>
<template slot-scope="scope">{{ scope.row.tableName || '--' }}</template>
<template slot-scope="scope">{{ scope.row.sqlCheckTableName || '--' }}</template>
</el-table-column>
<el-table-column label="是否需要完善" show-overflow-tooltip>
<template slot-scope="scope">
<el-switch
v-model="scope.row.tableName"
v-model="scope.row.sqlCheckIndexStatus"
active-text="''"
inactive-text="''">
inactive-text="''"
@change="changePerfect($event, scope.row)">
</el-switch>
</template>
</el-table-column>
<el-table-column label="SQL" show-overflow-tooltip>
<template slot-scope="scope">{{ scope.row.tableName || '--' }}</template>
<template slot-scope="scope">{{ scope.row.sqlCheckSql || '--' }}</template>
</el-table-column>
<el-table-column label="完善状态" show-overflow-tooltip>
<template slot-scope="scope">{{ scope.row.tableName || '--' }}</template>
<template slot-scope="scope">{{ scope.row.sqlCheckIndexType== 1? '已完善' : '未完善' }}</template>
</el-table-column>
<el-table-column label="上线状态" show-overflow-tooltip>
<template slot-scope="scope">
<el-switch
v-model="scope.row.tableName"
v-model="scope.row.statusFlag"
active-text="''"
inactive-text="''">
inactive-text="''"
@change="changeStatus($event, scope.row)">
</el-switch>
</template>
</el-table-column>
......@@ -76,33 +78,39 @@
</template>
</el-table-column>
<el-table-column label="操作人" show-overflow-tooltip>
<template slot-scope="scope">{{ scope.row.tableName || '--' }}</template>
<template slot-scope="scope">{{ scope.row.commitName || '--' }}</template>
</el-table-column>
<el-table-column prop="" label="操作" >
<template slot-scope="scope">
<el-button type="text" @click="toSqlPage(scope.row)">完善索引</el-button><el-button type="text" @click="toShowDetail(scope.row)">详情</el-button>
<el-button type="text" @click="toShowIndex(scope.row)">完善索引</el-button><el-button type="text" @click="toShowDetail(scope.row)">详情</el-button>
</template>
</el-table-column>
</el-table>
<div class="block common-wrap__page text-right m-t-24" v-if="tableData.length != 0">
<el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage" :page-sizes="[20, 40, 60, 80]" :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total"> </el-pagination>
</div>
<sql-detail v-if="showDetail" :sql-row="sqlRow"></sql-detail>
<index-dialog v-if="showIndex" :sql-check-sql-id="sqlCheckSqlId"></index-dialog>
</div>
</template>
<script>
import sqlDetail from '@/components/sql/sql-detail.vue';
import indexDialog from '@/components/sql/index-dialog.vue';
import { _debounce } from '@/common/js/public';
import fetch from '@/api/dictionary';
const { getSqlList } = fetch;
const { getSqlList, setPerfect, setStatus } = fetch;
export default {
name: 'SqlList',
components: {},
components: { sqlDetail, indexDialog },
data() {
return {
userInfo: localStorage.getItem('haobanOperate') ? JSON.parse(localStorage.getItem('haobanOperate')) : { id: '', userMobile: '', realName: '', },
searchInput: '',
createDate: '',
perfectState: '',
createDate: [],
sqlCheckIndexType: '',
perfectOption: [
{
value: '',
......@@ -113,11 +121,11 @@ export default {
label: '已完善'
},
{
value: '2',
value: '0',
label: '未完善'
},
],
onlineState: '',
statusFlag: '',
onlineOption: [
{
value: '',
......@@ -128,11 +136,11 @@ export default {
label: '已上线'
},
{
value: '2',
value: '0',
label: '未上线'
},
],
isPerfect: '',
sqlCheckIndexStatus: '',
isPerfectOption: [
{
value: '',
......@@ -143,7 +151,7 @@ export default {
label: '是'
},
{
value: '2',
value: '0',
label: '否'
},
],
......@@ -153,7 +161,11 @@ export default {
total: 0,
loading: false,
tableData: [],
multipleSelection: []
multipleSelection: [],
showDetail: false,
sqlRow: {},
showIndex: false,
sqlCheckSqlId: ''
};
},
// 生命周期 - 挂载完成（访问DOM元素）
......@@ -165,6 +177,68 @@ export default {
// methods
methods: {
/**
* @description: 完善索引
* @param {Object} row
* @author: 无尘
*/
toShowIndex(row) {
const that = this;
that.showIndex = true;
that.sqlCheckSqlId = row.sqlCheckSqlId;
},
changePerfect(e, row) {
const that = this;
const param = {
sqlCheckIndexStatus: e ? 1 : 0,
sqlCheckSqlId: row.sqlCheckSqlId,
commitId: that.userInfo.id
};
setPerfect(param).then(res => {
if (res.code == '0000') {
that.$message({
message: '设置成功',
type: 'success'
});
that.currentPage = 1;
that.getTableData();
}else{
that.$message.error(res.message);
}
})
.catch(function(error) {
});
},
changeStatus(e, row) {
const that = this;
const param = {
statusFlag: e ? 1 : 0,
sqlCheckSqlId: row.sqlCheckSqlId,
commitId: that.userInfo.id
};
setStatus(param).then(res => {
if (res.code == '0000') {
that.$message({
message: '设置成功',
type: 'success'
});
that.currentPage = 1;
that.getTableData();
}else{
that.$message.error(res.message);
}
})
.catch(function(error) {
});
},
changeDate(e) {
const that = this;
if (!e) {
that.createDate = [];
}
},
/**
* @description: 输入
* @param {Object} e
* @param {String} value
......@@ -221,12 +295,25 @@ export default {
const that = this;
that.loading = true;
const param = {
project: that.$route.query.sqlCheckProjectId,
table: that.$route.query.sqlCheckTableId,
sqlCheckIndexType: that.sqlCheckIndexType,
statusFlag: that.statusFlag,
sqlCheckIndexStatus: that.sqlCheckIndexStatus,
startDate: that.createDate[0],
endDate: that.createDate[1],
pageNum: that.currentPage,
pageSize: that.pageSize
};
getSqlList(param).then(res => {
that.loading = false;
that.tableData = res.result.list || [];
if (!!res.result.result && !!res.result.result.length) {
res.result.result.forEach(ele=> {
ele.sqlCheckIndexStatus = ele.sqlCheckIndexStatus == 1 ? true : false;
ele.statusFlag = ele.statusFlag == 1 ? true : false;
});
}
that.tableData = res.result.result || [];
that.total = res.result.totalCount || 0;
})
.catch(function(error) {
......
src/views/sql/table-sql.vue
......@@ -4,7 +4,7 @@
* @Author: 无尘
* @Date: 2020-11-09 11:15:55
* @LastEditors: 无尘
* @LastEditTime: 2020-11-11 09:48:08
* @LastEditTime: 2020-11-11 11:29:02
-->
<template>
<div class="common-right">
......@@ -13,7 +13,7 @@
</div>
<el-table class="select-table" ref="multipleTable" v-loading="loading" :data="tableData" tooltip-effect="dark" :style="{ width: '100%', minHeight: tableH }">
<el-table-column label="表名称" show-overflow-tooltip>
<template slot-scope="scope">{{ scope.row.tableName || '--' }}</template>
<template slot-scope="scope">{{ scope.row.sqlCheckTableName || '--' }}</template>
</el-table-column>
<el-table-column prop="" label="创建时间" show-overflow-tooltip>
<template slot-scope="scope">
......@@ -109,12 +109,13 @@ export default {
const that = this;
that.loading = true;
const param = {
table: that.searchInput,
pageNum: that.currentPage,
pageSize: that.pageSize
};
getTableList(param).then(res => {
that.loading = false;
that.tableData = res.result.list || [];
that.tableData = res.result.result || [];
that.total = res.result.totalCount || 0;
})
.catch(function(error) {
......@@ -128,7 +129,7 @@ export default {
*/
toSqlPage(row) {
const that = this;
that.$router.push(`/sql-list?projectId=${row.projectId}`);
that.$router.push(`/sql-list?sqlCheckTableId=${row.sqlCheckTableId}`);
}
},
watch: {}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment