提交 a4e8226d authored 作者: 林国禄's avatar 林国禄

初始化

上级 1bb245fa
import request from '@/utils/request'
// 查询统计点列表
export function listPoint(query) {
return request({
url: '/backstage/point/list',
method: 'get',
params: query
})
}
// 查询统计点详细
export function getPoint(id) {
return request({
url: '/backstage/point/' + id,
method: 'get'
})
}
// 新增统计点
export function addPoint(data) {
return request({
url: '/backstage/point',
method: 'post',
data: data
})
}
// 修改统计点
export function updatePoint(data) {
return request({
url: '/backstage/point',
method: 'put',
data: data
})
}
// 删除统计点
export function delPoint(id) {
return request({
url: '/backstage/point/' + id,
method: 'delete'
})
}
// 导出统计点
export function exportPoint(query) {
return request({
url: '/backstage/point/export',
method: 'get',
params: query
})
}
\ No newline at end of file
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
<!-- <el-form-item label="名称" prop="name">-->
<!-- <el-input-->
<!-- v-model="queryParams.name"-->
<!-- placeholder="请输入名称"-->
<!-- clearable-->
<!-- size="small"-->
<!-- @keyup.enter.native="handleQuery"-->
<!-- />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="账号" prop="account">-->
<!-- <el-input-->
<!-- v-model="queryParams.account"-->
<!-- placeholder="请输入账号"-->
<!-- clearable-->
<!-- size="small"-->
<!-- @keyup.enter.native="handleQuery"-->
<!-- />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="密码" prop="password">-->
<!-- <el-input-->
<!-- v-model="queryParams.password"-->
<!-- placeholder="请输入密码"-->
<!-- clearable-->
<!-- size="small"-->
<!-- @keyup.enter.native="handleQuery"-->
<!-- />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="状态" prop="status">-->
<!-- <el-select v-model="queryParams.status" placeholder="请选择状态" clearable size="small">-->
<!-- <el-option label="请选择字典生成" value="" />-->
<!-- </el-select>-->
<!-- </el-form-item>-->
<!-- <el-form-item label="经度" prop="longitude">-->
<!-- <el-input-->
<!-- v-model="queryParams.longitude"-->
<!-- placeholder="请输入经度"-->
<!-- clearable-->
<!-- size="small"-->
<!-- @keyup.enter.native="handleQuery"-->
<!-- />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="纬度" prop="latitude">-->
<!-- <el-input-->
<!-- v-model="queryParams.latitude"-->
<!-- placeholder="请输入纬度"-->
<!-- clearable-->
<!-- size="small"-->
<!-- @keyup.enter.native="handleQuery"-->
<!-- />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="上级id" prop="superiorId">-->
<!-- <el-input-->
<!-- v-model="queryParams.superiorId"-->
<!-- placeholder="请输入上级id"-->
<!-- clearable-->
<!-- size="small"-->
<!-- @keyup.enter.native="handleQuery"-->
<!-- />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="统计点类型" prop="type">-->
<!-- <el-select v-model="queryParams.type" placeholder="请选择统计点类型" clearable size="small">-->
<!-- <el-option label="请选择字典生成" value="" />-->
<!-- </el-select>-->
<!-- </el-form-item>-->
<el-form-item>
<el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
icon="el-icon-plus"
size="mini"
@click="handleAdd"
v-hasPermi="['backstage:point:add']"
>新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="success"
icon="el-icon-edit"
size="mini"
:disabled="single"
@click="handleUpdate"
v-hasPermi="['backstage:point:edit']"
>修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="danger"
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['backstage:point:remove']"
>删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="warning"
icon="el-icon-download"
size="mini"
@click="handleExport"
v-hasPermi="['backstage:point:export']"
>导出</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="pointList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column type="index" :index="table_index" label="序号" align="center" prop="id"/>
<el-table-column label="名称" align="center" prop="name" />
<el-table-column label="账号" align="center" prop="account" />
<el-table-column label="密码" align="center" prop="password" />
<el-table-column label="状态" align="center" prop="status" />
<el-table-column label="经度" align="center" prop="longitude" />
<el-table-column label="纬度" align="center" prop="latitude" />
<el-table-column label="上级id" align="center" prop="superiorId" />
<el-table-column label="统计点类型" align="center" prop="type" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['backstage:point:edit']"
>修改</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['backstage:point:remove']"
>删除</el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!-- 添加或修改统计点对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="名称" prop="name">
<el-input v-model="form.name" placeholder="请输入名称" />
</el-form-item>
<el-form-item label="账号" prop="account">
<el-input v-model="form.account" placeholder="请输入账号" />
</el-form-item>
<el-form-item label="密码" prop="password">
<el-input placeholder="请输入密码" v-model="form.password" show-password></el-input>
</el-form-item>
<!-- <el-form-item v-if="this.statisticsPointsType == '2'" label="所属省级" prop="password">-->
<!-- <el-select v-model="provinceId" placeholder="请选择">-->
<!-- <el-option-->
<!-- v-for="item in provinceList"-->
<!-- :key="item.id"-->
<!-- :label="item.name"-->
<!-- :value="item.id">-->
<!-- </el-option>-->
<!-- </el-select>-->
<!-- </el-form-item>-->
<el-form-item label="所属层级" prop="password">
<div class="block">
<span class="demonstration">hover 触发子菜单</span>
<el-cascader
v-model="levelValue"
:options="levelOptions"
:props="{ expandTrigger: 'hover' }"
@change="handleChange"></el-cascader>
</div>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm" :disabled="repeatSubmit">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
<!-- 新增统计点类型弹框-->
<el-dialog
title="请选择新增统计点类型"
:visible.sync="addStatisticsTypeStatus"
width="70%"
>
<el-radio-group v-model="statisticsPointsType">
<el-radio v-for="item in statisticsPointsTypeObj" :label="item.label" >{{item.name}}</el-radio>
</el-radio-group>
<span slot="footer" class="dialog-footer">
<el-button @click="addStatisticsTypeStatus = false">取 消</el-button>
<el-button type="primary" @click="handleAddStatisticsPointsType">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import { listPoint, getPoint, delPoint, addPoint, updatePoint, exportPoint } from "@/api/backstage/point";
export default {
name: "Point",
data() {
return {
levelValue: [],
levelOptions: [{
value: 'zhinan',
label: '指南',
children: [{
value: 'shejiyuanze',
label: '设计原则',
children: [{
value: 'yizhi',
label: '一致'
}, {
value: 'fankui',
label: '反馈'
}, {
value: 'xiaolv',
label: '效率'
}, {
value: 'kekong',
label: '可控'
}]
}, {
value: 'daohang',
label: '导航',
children: [{
value: 'cexiangdaohang',
label: '侧向导航'
}, {
value: 'dingbudaohang',
label: '顶部导航'
}]
}]
}, {
value: 'zujian',
label: '组件',
children: [{
value: 'basic',
label: 'Basic',
children: [{
value: 'layout',
label: 'Layout 布局'
}, {
value: 'color',
label: 'Color 色彩'
}, {
value: 'typography',
label: 'Typography 字体'
}, {
value: 'icon',
label: 'Icon 图标'
}, {
value: 'button',
label: 'Button 按钮'
}]
}, {
value: 'notice',
label: 'Notice',
children: [{
value: 'alert',
label: 'Alert 警告'
}, {
value: 'loading',
label: 'Loading 加载'
}, {
value: 'message',
label: 'Message 消息提示'
}, {
value: 'message-box',
label: 'MessageBox 弹框'
}, {
value: 'notification',
label: 'Notification 通知'
}]
}, {
value: 'navigation',
label: 'Navigation',
}, {
value: 'others',
label: 'Others',
}]
}, {
value: 'ziyuan',
label: '资源',
children: [{
value: 'axure',
label: 'Axure Components'
}, {
value: 'sketch',
label: 'Sketch Templates'
}, {
value: 'jiaohu',
label: '组件交互文档'
}]
}],
provinceList: [],//省级列表
cityList: [],//市级列表
countyList: [],//县级列表
townshipList: [],//乡级列表
villageList: [],//村级列表
//所属省级id
provinceId: null,
//统计点类型对象
statisticsPointsTypeObj: [
{label:1,name:"省级(省份/直辖市/自治区)"},
{label:2,name:"地级(城市)"},
{label:3,name:"县级(区县)"},
{label:4,name:"乡级(乡镇/街道)"},
{label:5,name:"村级(村委会/居委会)"},
{label:6,name:"自然村"},
],
//统计点类型
statisticsPointsType: '',
//新增统计点类型弹框状态
addStatisticsTypeStatus: false,
// 不可重复提交
repeatSubmit: false,
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 统计点表格数据
pointList: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
name: null,
account: null,
password: null,
status: null,
longitude: null,
latitude: null,
superiorId: null,
type: null,
},
// 表单参数
form: {},
// 表单校验
rules: {
}
};
},
created() {
this.getList();
},
methods: {
/** 查询统计点列表 */
getList() {
this.loading = true;
listPoint(this.queryParams).then(response => {
this.pointList = response.rows;
this.total = response.total;
this.loading = false;
});
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {
id: null,
name: null,
account: null,
password: null,
status: "0",
longitude: null,
latitude: null,
superiorId: null,
type: null,
createTime: null,
updateTime: null
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.id)
this.single = selection.length!==1
this.multiple = !selection.length
},
/** 新增按钮操作 */
handleAdd() {
this.statisticsPointsType = '';
this.addStatisticsTypeStatus = true;
// this.reset();
// this.open = true;
// this.title = "添加统计点";
},
//选择新增类型确定按钮
handleAddStatisticsPointsType(){
if(this.statisticsPointsType == null || this.statisticsPointsType == ''){
this.$message.error("请选择新增统计点的类型");
return;
}
//获取标题名称
let titleName = this.statisticsPointsTypeObj[this.statisticsPointsType-1].name;
this.addStatisticsTypeStatus = false;
this.reset();
this.open = true;
this.title = "添加"+titleName+"统计点";
//获取所有统计点数据并处理
listPoint().then(res=>{
let list = res.rows;
let provinceList = [];//省级列表
let cityList = [];//市级列表
let countyList = [];//县级列表
let townshipList = [];//乡级列表
let villageList = [];//村级列表
// list.map(item=>{
// if(item.type == "1"){
// provinceList.push(item);
// }else if(item.type == "2"){
// cityList.push(item);
// }else if(item.type == "3"){
// countyList.push(item);
// }else if(item.type == "4"){
// townshipList.push(item);
// }else if(item.type == "5"){
// villageList.push(item);
// }
// });
//
// this.provinceList = provinceList;
// this.cityList = cityList;
// this.countyList = countyList;
// this.townshipList = townshipList;
// this.villageList = villageList;
list.map(item=>{
if(item.type == "1"){
let options = {};//级联对象
options.value = item.id;
options.label = item.name;
options.children = [];
provinceList.push(options)
}else if(item.type == "2"){
let options = {};//级联对象
options.value = item.id;
options.label = item.name;
options.children = [];
cityList.push(options)
}else if(item.type == "3"){
let options = {};//级联对象
options.value = item.id;
options.label = item.name;
options.children = [];
countyList.push(options)
}else if(item.type == "4"){
let options = {};//级联对象
options.value = item.id;
options.label = item.name;
options.children = [];
townshipList.push(options)
}else if(item.type == "5"){
let options = {};//级联对象
options.value = item.id;
options.label = item.name;
options.children = [];
villageList.push(options)
}
});
this.provinceList = provinceList;
this.cityList = cityList;
this.countyList = countyList;
this.townshipList = townshipList;
this.villageList = villageList;
let optionsList = [];
if(this.statisticsPointsType == "2"){
provinceList.map(item=>{
item.children = cityList;
});
}else if(this.statisticsPointsType == "3"){
}else if(this.statisticsPointsType == "4"){
}else if(this.statisticsPointsType == "5"){
}else if(this.statisticsPointsType == "6"){
}
this.levelOptions = optionsList;
console.log(this.provinceList);
console.log(this.levelOptions);
});
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
const id = row.id || this.ids
getPoint(id).then(response => {
this.form = response.data;
this.open = true;
this.title = "修改统计点";
});
},
/** 提交按钮 */
submitForm() {
this.repeatSubmit=true
setTimeout(()=>{
this.repeatSubmit = false //点击一次时隔两秒后才能再次点击
},2000)
this.$refs["form"].validate(valid => {
if (valid) {
this.form.type = this.statisticsPointsType;//统计点类型
if (this.form.id != null) {
updatePoint(this.form).then(response => {
this.msgSuccess("修改成功");
this.open = false;
this.getList();
});
} else {
addPoint(this.form).then(response => {
this.msgSuccess("新增成功");
this.open = false;
this.getList();
});
}
}
});
},
/** 删除按钮操作 */
handleDelete(row) {
const ids = row.id || this.ids;
this.$confirm('是否确认删除统计点编号为"' + ids + '"的数据项?', "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(function() {
return delPoint(ids);
}).then(() => {
this.getList();
this.msgSuccess("删除成功");
})
},
/** 导出按钮操作 */
handleExport() {
const queryParams = this.queryParams;
this.$confirm('是否确认导出所有统计点数据项?', "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(function() {
return exportPoint(queryParams);
}).then(response => {
this.download(response.msg);
})
},
//自增序号
table_index(index) {
return (this.queryParams.pageNum - 1) * this.queryParams.pageSize + index + 1
},
handleChange(value) {
console.log(value);
}
}
};
</script>
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论