Commit e88d106d authored by yangkaiyi's avatar yangkaiyi

改页面报错、预留有害生物管理页面

parent 84859b65
......@@ -10,7 +10,7 @@
<el-row :gutter="20">
<el-col :span="4">
<el-input
placeholder="请输入搜索的重要有害植物名称"
placeholder="请输入重要有害植物名称"
v-model="filterDeviceName"
>
</el-input>
......
......@@ -51,7 +51,7 @@
<svg-icon icon-class="device" class-name="card-panel-icon" />
</div>
<div class="card-panel-description">
<div class="card-panel-text">在线/重要有害植物总数</div>
<div class="card-panel-text">在线/植物总数</div>
<count-to
class="card-panel-num"
:startVal="0"
......
......@@ -3,146 +3,279 @@
<el-row class="toolbar">
<el-col :span="24">
<el-form :inline="true" :model="filters">
<el-select v-model="filters.column" placeholder="请选择">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<el-select v-model="filters.type" placeholder="请选择">
<el-option
v-for="item in selectTypeOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<el-form-item>
<el-input :type="filters.type==0?'text':'textarea'" v-model="filters.keyword" :placeholder="filters.type==0?'关键字':'多值用英文逗,号分开'"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" v-on:click="init">查询</el-button>
</el-form-item>
<el-form-item>
<el-button type="primary" :disabled="!hasPermission('system:device:upload')" @click="inDeviceVisible=true">导入</el-button>
</el-form-item>
<el-form-item>
<el-button type="primary" v-on:click="showTransferDeviceDialog" :disabled="!hasPermission('system:device:upload')||selectDevices.length==0">转移</el-button>
</el-form-item>
<el-form-item>
<el-button type="primary" v-on:click="downLoad" :disabled="selectDevices.length==0">导出</el-button>
</el-form-item>
</el-form>
<el-select v-model="filters.column" placeholder="请选择">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
<el-select v-model="filters.type" placeholder="请选择">
<el-option
v-for="item in selectTypeOptions"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
<el-form-item>
<el-input
:type="filters.type == 0 ? 'text' : 'textarea'"
v-model="filters.keyword"
:placeholder="
filters.type == 0 ? '关键字' : '多值用英文逗,号分开'
"
></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" v-on:click="init">查询</el-button>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="handlerAdd">添加</el-button>
</el-form-item>
<el-form-item>
<el-button
type="primary"
:disabled="!hasPermission('system:device:upload')"
@click="inDeviceVisible = true"
>导入</el-button
>
</el-form-item>
<el-form-item>
<el-button
type="primary"
v-on:click="showTransferDeviceDialog"
:disabled="
!hasPermission('system:device:upload') ||
selectDevices.length == 0
"
>转移</el-button
>
</el-form-item>
<el-form-item>
<el-button
type="primary"
v-on:click="downLoad"
:disabled="selectDevices.length == 0"
>导出</el-button
>
</el-form-item>
</el-form>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-table :data="data.list" @selection-change="selectionRowsChange" element-loading-text="Loading" fit highlight-current-row>
<el-table-column type="selection" width="55"></el-table-column>
<el-table-column label="重要有害植物名称" prop="name">
<el-table
:data="data.list"
@selection-change="selectionRowsChange"
element-loading-text="Loading"
fit
highlight-current-row
>
<el-table-column type="selection" width="55"></el-table-column>
<!-- prop都改字段名 -->
<el-table-column label="重要有害植物名称" prop="name" width="200">
</el-table-column>
<el-table-column label="IMEI" width="160" prop="imei">
<el-table-column label="报关号222" width="160" prop="报关号">
</el-table-column>
<el-table-column label="SIM" width="160" prop="sim">
<el-table-column label="来源国" width="100" prop="来源国">
</el-table-column>
<el-table-column label="类型" prop="typeName">
<el-table-column label="携带有害生物" prop="typeName">
</el-table-column>
<el-table-column width="160" label="添加时间">
<el-table-column width="160" label="添加时间">
<template slot-scope="scope">
{{scope.row.time/1000|moment("YYYY-MM-DD HH:mm:ss")}}
{{ (scope.row.time / 1000) | moment("YYYY-MM-DD HH:mm:ss") }}
</template>
</el-table-column>
<el-table-column width="160" label="最后更新时间">
<el-table-column width="160" label="最后更新时间">
<template slot-scope="scope">
{{scope.row.lastUpdate/1000|moment("YYYY-MM-DD HH:mm:ss")}}
{{
(scope.row.lastUpdate / 1000) | moment("YYYY-MM-DD HH:mm:ss")
}}
</template>
</el-table-column>
<el-table-column label="状态">
<el-table-column label="操作" align="center">
<template slot-scope="scope">
<el-tag size="small" :type="scope.row.status===1?'success':scope.row.status===0?'danger':'info'">{{scope.row.status===1?'在线':scope.row.status===0?'离线':'未激活'}}</el-tag>
<!-- 带权限判断demo -->
<!-- <el-button
size="small"
type="primary"
@click="handleEdit(scope.row)"
v-if="hasPermission('system:user:update')"
>编辑</el-button
> -->
<el-button
size="small"
type="primary"
@click="handleEdit(scope.row)"
>编辑</el-button
>
<el-button
size="small"
type="danger"
@click="handleDelete(scope.row)"
>删除</el-button
>
</template>
</el-table-column>
<!-- <el-table-column label="当日/总里程(km)" width="130">
<template slot-scope="scope">
{{scope.row.todayTrip+"/"+scope.row.trip}}
</template>
</el-table-column> -->
<el-table-column label="所属账号" prop="account">
<template slot-scope="scope">
<el-button type="primary" size="mini">{{scope.row.account}}</el-button>
</template>
</el-table-column>
</el-table>
</el-col>
</el-row>
<el-row class="toolbar">
<el-col :span="24">
<el-pagination
layout="total, sizes, prev, pager, next"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:page-sizes="this.$store.state.common.pageSizes"
:page-size="this.$store.state.common.pageSize"
:total="data.total"
style="float:right;">
layout="total, sizes, prev, pager, next"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:page-sizes="this.$store.state.common.pageSizes"
:page-size="this.$store.state.common.pageSize"
:total="data.total"
style="float: right"
>
</el-pagination>
</el-col>
</el-col>
</el-row>
<InDevice :visible="inDeviceVisible" @visible="closeDialog"></InDevice>
<TransferDevice :visible="transferDeviceVisible" :devices="selectDevices" @visible="closeDialog"></TransferDevice>
</div>
<TransferDevice
:visible="transferDeviceVisible"
:devices="selectDevices"
@visible="closeDialog"
></TransferDevice>
<!-- 编辑 -->
<el-dialog
:title="`${isEdit ? '编辑' : '添加'}重要有害植物`"
:visible.sync="editDialogVisible"
width="40%"
>
<el-form
:model="editForm"
ref="editValidateForm"
label-width="100px"
class="demo-ruleForm"
>
<!-- TODO:改弹窗内容 -->
<el-form-item label="名称" prop="account">
<el-input
v-model.number="editForm.account"
auto-complete="off"
:disabled="true"
></el-input>
</el-form-item>
<el-form-item
label="邮箱"
prop="email"
:rules="[
{
type: 'email',
message: '请输入正确的邮箱地址',
trigger: ['blur', 'change'],
},
]"
>
<el-input v-model="editForm.email" auto-complete="off"></el-input>
</el-form-item>
<el-form-item
label="电话"
prop="phone"
:rules="[
{
min: 11,
max: 11,
message: '请输入正确的手机号码',
trigger: 'blur',
},
]"
>
<el-input v-model="editForm.phone" auto-complete="off"></el-input>
</el-form-item>
<el-form-item label="角色" prop="parentId">
<el-checkbox-group v-model="editForm.roleIds">
<el-checkbox
v-for="(role, index) in roles"
:key="index"
:label="role.id"
:disabled="role.roleKey === 'root'"
>{{ role.name }}</el-checkbox
>
</el-checkbox-group>
</el-form-item>
<el-form-item label="禁用" prop="disabled">
<el-switch
v-model="editForm.disabled"
active-color="#ff4949"
inactive-color="#13ce66"
active-text="是"
inactive-text="否"
>
</el-switch>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="editDialogVisible = false">取 消</el-button>
<el-button type="primary" @click="editSubmit">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import util from '@/utils/util';
import InDevice from './components/InDevice'
import TransferDevice from './components/TransferDevice'
import { getAllDevices} from '@/api/api'
import util from "@/utils/util";
import InDevice from "./components/InDevice";
import TransferDevice from "./components/TransferDevice";
import { getAllDevices } from "@/api/api";
export default {
data() {
return {
page: 1,
data:{},
data: {},
filters: {
column:'imei',
keyword:'',
type:0
},
options: [{
value: 'name',
label: '重要有害植物名称'
}, {
value: 'imei',
label: 'IMEI号'
}, {
value: 'sim',
label: 'SIM号码'
}, {
value: 'account',
label: '所属账号'
}],
selectTypeOptions:[{
value: 0,
label: '模糊搜索'
}, {
value: 1,
label: '精确查询'
}],
inDeviceVisible:false,
transferDeviceVisible:false,
selectDevices:[]
}
column: "报关号",
keyword: "",
type: 0,
},
// value改字段名
options: [
{
value: "name",
label: "重要有害植物名称",
},
{
value: "报关号",
label: "报关号",
},
{
value: "来源国",
label: "来源国",
},
{
value: "account",
label: "所属账号",
},
],
selectTypeOptions: [
{
value: 0,
label: "模糊搜索",
},
{
value: 1,
label: "精确查询",
},
],
inDeviceVisible: false,
transferDeviceVisible: false,
selectDevices: [],
editDialogVisible: false,
editForm: {
roleIds: [],
},
isEdit: false,
};
},
created() {
this.init();
......@@ -151,110 +284,133 @@ export default {
init() {
let para = {
page: this.page,
pageSize:this.$store.state.common.pageSize,
column:this.filters.column,
keyword:this.filters.keyword,
type:this.filters.type
pageSize: this.$store.state.common.pageSize,
column: this.filters.column,
keyword: this.filters.keyword,
type: this.filters.type,
};
getAllDevices(para).then(data => {
this.data = data
})
getAllDevices(para).then((data) => {
this.data = data;
});
},
handleDelete(row){
this.$confirm('此操作将永久删除该用户, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
deleteUser(row.id).then(data => {
this.$message({
type: 'success',
message: '删除成功!'
});
this.init()
})
});
handlerAdd() {
this.isEdit = false;
this.editForm = {};
this.editDialogVisible = true;
},
handleEdit(row) {
this.isEdit = true;
this.editForm = row;
this.editDialogVisible = true;
},
handleDelete(row) {
this.$confirm("是否确定删除该有害植物?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
}).then(() => {
// TODO:删除接口
// deleteUser(row.id).then((data) => {
// this.$message({
// type: "success",
// message: "删除成功!",
// });
// this.init();
// });
});
},
handleSizeChange(val) {
this.$store.dispatch('updatePageSize',val);
this.$store.dispatch("updatePageSize", val);
this.init();
},
handleCurrentChange(val) {
this.page = val;
this.init();
},
selectionRowsChange(val){
this.selectDevices = val;
},
showTransferDeviceDialog(){
if(this.selectDevices.length==0){
this.$message({
type: 'warning',
message: '请选择需要转移的重要有害植物'
});
return;
}
this.transferDeviceVisible=true;
},
closeDialog(data){
for (var key in data) {
this[key] = data[key];
}
if(data.refresh){
this.init();
}
},
downLoad(){
if(this.selectDevices.length==0){
this.$message({
type: 'warning',
message: '请选择需要导出的重要有害植物'
});
return;
}
import('@/vendor/Export2Excel').then(excel => {
const tHeader = ['IMEI','名称','SIM','备注','重要有害植物类型','分组','添加时间']
const filterVal = ['imei','name','sim','remarks','typeId','groupId','time']
const list = this.selectDevices
const data = this.formatJson(filterVal, list)
excel.export_json_to_excel({
header: tHeader,
data,
filename: '重要有害植物',
autoWidth:true,
bookType: 'xlsx'
})
},
handleCurrentChange(val) {
this.page = val;
this.init();
},
selectionRowsChange(val) {
this.selectDevices = val;
},
showTransferDeviceDialog() {
if (this.selectDevices.length == 0) {
this.$message({
type: "warning",
message: "请选择需要转移的重要有害植物",
});
return;
}
this.transferDeviceVisible = true;
},
closeDialog(data) {
for (var key in data) {
this[key] = data[key];
}
if (data.refresh) {
this.init();
}
},
downLoad() {
if (this.selectDevices.length == 0) {
this.$message({
type: "warning",
message: "请选择需要导出的重要有害植物",
});
return;
}
import("@/vendor/Export2Excel").then((excel) => {
const tHeader = [
"报关号",
"重要有害植物名称",
"来源国",
"备注",
"重要有害植物类型",
"分组",
"添加时间",
];
// TODO:字段名
const filterVal = [
"报关号",
"name",
"来源国",
"remarks",
"typeId",
"groupId",
"time",
];
const list = this.selectDevices;
const data = this.formatJson(filterVal, list);
excel.export_json_to_excel({
header: tHeader,
data,
filename: "重要有害植物",
autoWidth: true,
bookType: "xlsx",
});
});
},
formatJson(filterVal, jsonData) {
return jsonData.map((v) =>
filterVal.map((j) => {
if (j === "time") {
return util.dateFormat(v[j], "YYYY-MM-DD HH:mm:ss");
} else {
return v[j];
}
})
},
formatJson(filterVal, jsonData) {
return jsonData.map(v => filterVal.map(j => {
if (j==='time') {
return util.dateFormat(v[j],'YYYY-MM-DD HH:mm:ss')
}else{
return v[j]
}
}))
}
);
},
},
components: {
InDevice,
TransferDevice
}
}
TransferDevice,
},
};
</script>
<style>
<style lang="scss">
.el-row {
margin-bottom: 20px;
&:last-child {
margin-bottom: 0;
}
}
</style>
......@@ -5,38 +5,48 @@
<el-form :inline="true" :model="filters">
<el-select v-model="filters.status" placeholder="状态">
<el-option
v-for="(item,index) in optionStatus"
v-for="item in optionStatus"
:key="item.value"
:label="item.label"
:value="item.value">
:value="item.value"
>
</el-option>
</el-select>
<el-select v-model="filters.column" placeholder="请选择">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<el-form-item>
<el-input v-model="filters.keyword" placeholder="关键字"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" v-on:click="init">查询</el-button>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="addDialogVisible=true" v-if="hasPermission('system:user:add')">创建用户</el-button>
</el-form-item>
</el-form>
<el-select v-model="filters.column" placeholder="请选择">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
<el-form-item>
<el-input v-model="filters.keyword" placeholder="关键字"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" v-on:click="init">查询</el-button>
</el-form-item>
<el-form-item>
<el-button
type="primary"
@click="addDialogVisible = true"
v-if="hasPermission('system:user:add')"
>创建用户</el-button
>
</el-form-item>
</el-form>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-table :data="data.list" element-loading-text="Loading" @sort-change="sortChange" fit highlight-current-row>
<el-table
:data="data.list"
element-loading-text="Loading"
@sort-change="sortChange"
fit
highlight-current-row
>
<el-table-column label="帐号" prop="account" width="120">
</el-table-column>
<el-table-column label="邮箱" prop="email" width="220">
......@@ -45,180 +55,280 @@
</el-table-column>
<el-table-column label="角色" width="160">
<template slot-scope="scope">
<el-tag size="mini" v-for="(roleKey,index) in scope.row.roleKeys.split(',')" :key="index">{{getRole(roleKey)}}</el-tag>
<el-tag
size="mini"
v-for="(roleKey, index) in scope.row.roleKeys.split(',')"
:key="index"
>{{ getRole(roleKey) }}</el-tag
>
</template>
</el-table-column>
<el-table-column label="注册时间" width="160">
<template slot-scope="scope">
{{scope.row.time/1000|moment("YYYY-MM-DD HH:mm:ss")}}
{{ (scope.row.time / 1000) | moment("YYYY-MM-DD HH:mm:ss") }}
</template>
</el-table-column>
<el-table-column label="重要有害植物" prop="deviceCount" width="80" sortable="custom">
<el-table-column
label="重要有害植物数"
prop="deviceCount"
width="100"
sortable="custom"
>
<!-- <template slot-scope="scope">
<el-switch disabled v-model="scope.row.disabled" active-color="#ff4949" inactive-color="#13ce66"> </el-switch>
</template> -->
</el-table-column>
<el-table-column label="状态" width="60">
<template slot-scope="scope">
<el-tag size="mini" :type="scope.row.status===1?'success':'info'">{{scope.row.status===1?'在线':'离线'}}</el-tag>
<el-tag
size="mini"
:type="scope.row.status === 1 ? 'success' : 'info'"
>{{ scope.row.status === 1 ? "在线" : "离线" }}</el-tag
>
</template>
</el-table-column>
<el-table-column label="操作" align="center">
<template slot-scope="scope">
<el-button size="small" type="success" @click="goTrack(scope.row)">监控</el-button>
<el-button size="small" type="primary" @click="handleEdit(scope.row)" v-if="hasPermission('system:user:update')">编辑</el-button>
<el-button size="small" type="danger" @click="handleDelete(scope.row)" v-if="hasPermission('system:user:delete')">删除</el-button>
<el-button size="small" type="success" @click="goTrack(scope.row)"
>监控</el-button
>
<el-button
size="small"
type="primary"
@click="handleEdit(scope.row)"
v-if="hasPermission('system:user:update')"
>编辑</el-button
>
<el-button
size="small"
type="danger"
@click="handleDelete(scope.row)"
v-if="hasPermission('system:user:delete')"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
</el-col>
</el-row>
<el-row class="toolbar">
<el-col :span="24">
<el-pagination
layout="total, sizes, prev, pager, next"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:page-sizes="this.$store.state.common.pageSizes"
:page-size="this.$store.state.common.pageSize"
:total="data.total"
style="float:right;">
layout="total, sizes, prev, pager, next"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:page-sizes="this.$store.state.common.pageSizes"
:page-size="this.$store.state.common.pageSize"
:total="data.total"
style="float: right"
>
</el-pagination>
</el-col>
</el-col>
</el-row>
<el-dialog
title="创建用户"
:visible.sync="addDialogVisible"
width="40%"
>
<el-form :model="addForm" ref="addValidateForm" label-width="100px" class="demo-ruleForm">
<el-form-item label="帐号" prop="account" :rules="[{ required: true, message: '帐号不能为空'}]" >
<el-input v-model="addForm.account" auto-complete="off"></el-input>
</el-form-item>
<el-form-item label="邮箱" prop="email" :rules="[{ type: 'email', message: '请输入正确的邮箱地址', trigger: ['blur', 'change']}]">
<el-input v-model="addForm.email" auto-complete="off"></el-input>
</el-form-item>
<el-form-item label="电话" prop="phone" :rules="[{ min: 11, max: 11, message: '请输入正确的手机号码', trigger: 'blur'}]">
<el-input v-model="addForm.phone" auto-complete="off"></el-input>
</el-form-item>
<el-form-item
label="密码"
prop="password"
:rules="[{ required: true, message: '密码不能为空'}]"
<el-dialog title="创建用户" :visible.sync="addDialogVisible" width="40%">
<el-form
:model="addForm"
ref="addValidateForm"
label-width="100px"
class="demo-ruleForm"
>
<el-input v-model="addForm.password" auto-complete="off"></el-input>
</el-form-item>
<el-form-item label="角色" prop="roleIds" :rules="[{ required: true, message: '请选择角色'}]">
<el-checkbox-group v-model="addForm.roleIds">
<el-checkbox v-for="(role,index) in roles" :key="index" :label="role.id" :disabled="role.roleKey==='root'">{{role.name}}</el-checkbox>
</el-checkbox-group>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="addDialogVisible = false">取 消</el-button>
<el-button type="primary" @click="addSubmit">确 定</el-button>
</span>
</el-dialog>
<el-form-item
label="帐号"
prop="account"
:rules="[{ required: true, message: '帐号不能为空' }]"
>
<el-input v-model="addForm.account" auto-complete="off"></el-input>
</el-form-item>
<el-form-item
label="邮箱"
prop="email"
:rules="[
{
type: 'email',
message: '请输入正确的邮箱地址',
trigger: ['blur', 'change'],
},
]"
>
<el-input v-model="addForm.email" auto-complete="off"></el-input>
</el-form-item>
<el-form-item
label="电话"
prop="phone"
:rules="[
{
min: 11,
max: 11,
message: '请输入正确的手机号码',
trigger: 'blur',
},
]"
>
<el-input v-model="addForm.phone" auto-complete="off"></el-input>
</el-form-item>
<el-form-item
label="密码"
prop="password"
:rules="[{ required: true, message: '密码不能为空' }]"
>
<el-input v-model="addForm.password" auto-complete="off"></el-input>
</el-form-item>
<el-form-item
label="角色"
prop="roleIds"
:rules="[{ required: true, message: '请选择角色' }]"
>
<el-checkbox-group v-model="addForm.roleIds">
<el-checkbox
v-for="(role, index) in roles"
:key="index"
:label="role.id"
:disabled="role.roleKey === 'root'"
>{{ role.name }}</el-checkbox
>
</el-checkbox-group>
</el-form-item>
</el-form>
<el-dialog
title="修改用户"
:visible.sync="editDialogVisible"
width="40%"
>
<el-form :model="editForm" ref="editValidateForm" label-width="100px" class="demo-ruleForm">
<el-form-item label="帐号" prop="account">
<el-input v-model.number="editForm.account" auto-complete="off" :disabled="true"></el-input>
</el-form-item>
<el-form-item label="邮箱" prop="email" :rules="[{ type: 'email', message: '请输入正确的邮箱地址', trigger: ['blur', 'change']}]">
<el-input v-model="editForm.email" auto-complete="off"></el-input>
</el-form-item>
<el-form-item label="电话" prop="phone" :rules="[{ min: 11, max: 11, message: '请输入正确的手机号码', trigger: 'blur'}]">
<el-input v-model="editForm.phone" auto-complete="off"></el-input>
</el-form-item>
<el-form-item label="角色" prop="parentId">
<el-checkbox-group v-model="editForm.roleIds">
<el-checkbox v-for="(role,index) in roles" :key="index" :label="role.id" :disabled="role.roleKey==='root'">{{role.name}}</el-checkbox>
<span slot="footer" class="dialog-footer">
<el-button @click="addDialogVisible = false">取 消</el-button>
<el-button type="primary" @click="addSubmit">确 定</el-button>
</span>
</el-dialog>
</el-checkbox-group>
</el-form-item>
<el-form-item label="禁用" prop="disabled">
<el-switch
v-model="editForm.disabled"
active-color="#ff4949"
inactive-color="#13ce66"
active-text="是"
inactive-text="否"
<el-dialog title="修改用户" :visible.sync="editDialogVisible" width="40%">
<el-form
:model="editForm"
ref="editValidateForm"
label-width="100px"
class="demo-ruleForm"
>
</el-switch>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="editDialogVisible = false">取 消</el-button>
<el-button type="primary" @click="editSubmit">确 定</el-button>
</span>
</el-dialog>
<el-form-item label="帐号" prop="account">
<el-input
v-model.number="editForm.account"
auto-complete="off"
:disabled="true"
></el-input>
</el-form-item>
<el-form-item
label="邮箱"
prop="email"
:rules="[
{
type: 'email',
message: '请输入正确的邮箱地址',
trigger: ['blur', 'change'],
},
]"
>
<el-input v-model="editForm.email" auto-complete="off"></el-input>
</el-form-item>
<el-form-item
label="电话"
prop="phone"
:rules="[
{
min: 11,
max: 11,
message: '请输入正确的手机号码',
trigger: 'blur',
},
]"
>
<el-input v-model="editForm.phone" auto-complete="off"></el-input>
</el-form-item>
<el-form-item label="角色" prop="parentId">
<el-checkbox-group v-model="editForm.roleIds">
<el-checkbox
v-for="(role, index) in roles"
:key="index"
:label="role.id"
:disabled="role.roleKey === 'root'"
>{{ role.name }}</el-checkbox
>
</el-checkbox-group>
</el-form-item>
<el-form-item label="禁用" prop="disabled">
<el-switch
v-model="editForm.disabled"
active-color="#ff4949"
inactive-color="#13ce66"
active-text="是"
inactive-text="否"
>
</el-switch>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="editDialogVisible = false">取 消</el-button>
<el-button type="primary" @click="editSubmit">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import { getUserList,deleteUser,getRoles,updateUser,userAdd,generateToken } from '@/api/api'
import {
getUserList,
deleteUser,
getRoles,
updateUser,
userAdd,
generateToken,
} from "@/api/api";
export default {
data() {
return {
page: 1,
data:{},
optionStatus:[
{
value: -1,
label: '全部'
},
{
value: 1,
label: '在线'
},{
data: {},
optionStatus: [
{
value: -1,
label: "全部",
},
{
value: 1,
label: "在线",
},
{
value: 0,
label: '离线'
}
label: "离线",
},
],
filters: {
column:'',
keyword:'',
status:-1,
prop:'id',
order:'desc',
column: "",
keyword: "",
status: -1,
prop: "id",
order: "desc",
},
options: [
{
value: "account",
label: "账号",
},
options: [{
value: 'account',
label: '账号'
}, {
value: 'email',
label: '邮箱'
}, {
value: 'phone',
label: '电话'
}],
editDialogVisible:false,
addDialogVisible:false,
editForm:{
roleIds:[]
{
value: "email",
label: "邮箱",
},
{
value: "phone",
label: "电话",
},
],
editDialogVisible: false,
addDialogVisible: false,
editForm: {
roleIds: [],
},
addForm:{
roleIds:[]
addForm: {
roleIds: [],
},
roles:[]
}
roles: [],
};
},
created() {
this.init();
......@@ -229,106 +339,102 @@ export default {
init() {
let para = {
page: this.page,
pageSize:this.$store.state.common.pageSize,
column:this.filters.column,
keyword:this.filters.keyword,
status:this.filters.status,
prop:this.filters.prop,
order:this.filters.order,
pageSize: this.$store.state.common.pageSize,
column: this.filters.column,
keyword: this.filters.keyword,
status: this.filters.status,
prop: this.filters.prop,
order: this.filters.order,
};
getUserList(para).then(data => {
this.data = data
})
getUserList(para).then((data) => {
this.data = data;
});
},
handleDelete(row){
deleteUser(row.id).then(data => {
this.init()
})
handleDelete(row) {
deleteUser(row.id).then((data) => {
this.init();
});
},
handleEdit(row){
this.editForm=row;
if(row.roleIds instanceof Array){
}else{
let arrs = row.roleIds.split(',');
handleEdit(row) {
this.editForm = row;
if (row.roleIds instanceof Array) {
} else {
let arrs = row.roleIds.split(",");
let roles = [];
for(var i=0;i<arrs.length;i++){
roles.push(parseInt(arrs[i]))
for (var i = 0; i < arrs.length; i++) {
roles.push(parseInt(arrs[i]));
}
this.editForm.roleIds=roles;
this.editForm.roleIds = roles;
}
this.editDialogVisible=true;
this.editDialogVisible = true;
},
editSubmit(){
this.$refs.editValidateForm.validate((valid) => {
if (valid) {
this.editDialogVisible=false;
updateUser(this.editForm).then(data => {
this.init()
})
}
});
editSubmit() {
this.$refs.editValidateForm.validate((valid) => {
if (valid) {
this.editDialogVisible = false;
updateUser(this.editForm).then((data) => {
this.init();
});
}
});
},
getRoles(){
getRoles().then(data => {
this.roles = data
})
getRoles() {
getRoles().then((data) => {
this.roles = data;
});
},
addSubmit(){
this.$refs.addValidateForm.validate((valid) => {
if (valid) {
userAdd(this.addForm).then(data => {
this.addDialogVisible=false;
this.init();
})
}else{
return false;
}
});
addSubmit() {
this.$refs.addValidateForm.validate((valid) => {
if (valid) {
userAdd(this.addForm).then((data) => {
this.addDialogVisible = false;
this.init();
});
} else {
return false;
}
});
},
handleSizeChange(val) {
this.$store.dispatch('updatePageSize',val);
this.$store.dispatch("updatePageSize", val);
this.init();
},
handleCurrentChange(val) {
this.page = val;
this.init();
},
goTrack(row){
generateToken(row.id).then(data => {
let monitorUser = {account:row.account,token:data}
localStorage.monitorUser = JSON.stringify(monitorUser);
window.open('#/map');
})
},
sortChange(column, prop, order){
if(column.order=='ascending'){
this.filters.order = 'asc'
}else if(column.order=='descending'){
this.filters.order = 'desc'
}
this.filters.prop = column.prop;
},
handleCurrentChange(val) {
this.page = val;
this.init();
},
getRole(roleKey){
for(var i=0;i<this.$store.state.common.roles.length;i++){
if(roleKey == this.$store.state.common.roles[i].roleKey){
return this.$store.state.common.roles[i].name
}
}
}
}
}
goTrack(row) {
generateToken(row.id).then((data) => {
let monitorUser = { account: row.account, token: data };
localStorage.monitorUser = JSON.stringify(monitorUser);
window.open("#/map");
});
},
sortChange(column, prop, order) {
if (column.order == "ascending") {
this.filters.order = "asc";
} else if (column.order == "descending") {
this.filters.order = "desc";
}
this.filters.prop = column.prop;
this.init();
},
getRole(roleKey) {
for (var i = 0; i < this.$store.state.common.roles.length; i++) {
if (roleKey == this.$store.state.common.roles[i].roleKey) {
return this.$store.state.common.roles[i].name;
}
}
},
},
};
</script>
<style>
<style lang="scss">
.el-row {
margin-bottom: 20px;
&:last-child {
margin-bottom: 0;
}
}
</style>
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