Commit b58fae41 by 黄志甲

管理系统部分完成

parent 72b960b2
......@@ -19,7 +19,7 @@ const webpackConfig = merge(baseWebpackConfig, {
module: {
rules: utils.styleLoaders({
sourceMap: config.build.productionSourceMap,
extract: true,
extract: false,
usePostCSS: true
})
},
......@@ -48,7 +48,7 @@ const webpackConfig = merge(baseWebpackConfig, {
filename: utils.assetsPath('css/[name].[contenthash].css'),
// Setting the following option to `false` will not extract CSS from codesplit chunks.
// Their CSS will instead be inserted dynamically with style-loader when the codesplit chunk has been loaded by webpack.
// It's currently set to `true` because we are seeing that sourcemaps are included in the codesplit bundle as well when it's `false`,
// It's currently set to `true` because we are seeing that sourcemaps are included in the codesplit bundle as well when it's `false`,
// increasing file size: https://github.com/vuejs-templates/webpack/issues/1110
allChunks: true,
}),
......
......@@ -9,9 +9,8 @@ module.exports = {
// Paths
assetsSubDirectory: 'static',
assetsPublicPath: './',
assetsPublicPath: '/',
proxyTable: {},
// Various Dev Server settings
host: 'localhost', // can be overwritten by process.env.HOST
port: 8080, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
......@@ -50,7 +49,7 @@ module.exports = {
// Paths
assetsRoot: path.resolve(__dirname, '../dist'),
assetsSubDirectory: 'static',
assetsPublicPath: '/',
assetsPublicPath: './',
/**
* Source Maps
......
......@@ -3902,6 +3902,14 @@
"safer-buffer": "^2.1.0"
}
},
"echarts": {
"version": "4.6.0",
"resolved": "https://registry.npmjs.org/echarts/-/echarts-4.6.0.tgz",
"integrity": "sha512-xKkcr6v9UVOSF+PMuj7Ngt3bnzLwN1sSXWCvpvX+jYb3mePYsZnABq7wGkPac/m0nV653uGHXoHK8DCKCprdNg==",
"requires": {
"zrender": "4.2.0"
}
},
"ee-first": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
......@@ -13836,6 +13844,11 @@
"requires": {
"fd-slicer": "~1.0.1"
}
},
"zrender": {
"version": "4.2.0",
"resolved": "https://registry.npmjs.org/zrender/-/zrender-4.2.0.tgz",
"integrity": "sha512-YJ9hxt5uFincYYU3KK31+Ce+B6PJmYYK0Q9fQ6jOUAoC/VHbe4kCKAPkxKeT7jGTxrK5wYu18R0TLGqj2zbEOA=="
}
}
}
......@@ -14,6 +14,7 @@
},
"dependencies": {
"axios": "^0.19.2",
"echarts": "^4.6.0",
"view-design": "^4.1.3",
"vue": "^2.5.2",
"vue-router": "^3.0.1"
......
......@@ -20,4 +20,130 @@ export default {
.newInput{
width: 150px;
}
/*测试*/
.testBorder{
border: 2px solid #4CD964;
}
/* flex操作 */
.know-flex{ display: flex }
/* 占满 */
.know-full{ flex: 1 }
/* 对齐方式 */
.know-row{ flex-direction: row }
.know-column{ flex-direction: column }
/* 换行 */
.know-wrap{ flex-wrap: wrap }
/* ===========对齐方式=========== */
/* 左对齐 */
.know-flex-start{ justify-content: flex-start }
/* 右对齐 */
.konw-flex-end{ justify-content: flex-end }
/* 居中 */
.konw-center{ justify-content: center }
/* 对齐两端 */
.know-space-between{ justify-content: space-between }
/* 各div间距相等 */
.know-space-around{ justify-content: space-around }
/* 起点对齐方式 */
/*对齐起点*/
.know-align-start{ align-items:flex-start }
/*对齐终点*/
.know-align-end{ align-items: flex-end }
/*中点对齐*/
.know-align-center{ align-items: center }
/* fontSize */
.font-18{ font-size:18px }
.font-20{ font-size:20px }
.font-22{ font-size:22px }
.font-24{ font-size:24px }
.font-26{ font-size:26px }
.font-28{ font-size:28px }
.font-30{ font-size:30px }
.font-32{ font-size:32px }
.font-34{ font-size:34px }
.font-26{ font-size:36px }
.font-38{ font-size:38px }
.font-40{ font-size:40px }
.font-42{ font-size:42px }
.font-44{ font-size:44px }
.font-46{ font-size:46px }
.font-48{ font-size:48px }
.font-50{ font-size:50px }
/* font-weight */
.font-weight-500{font-weight: 500}
.font-weight-600{font-weight: 600}
.font-weight-bold{font-weight: bold}
.font-weight-bold{font-weight: bolder}
/* 背景颜色 */
.bg-FFFFFF{ background-color: #FFFFFF}
.bg-EEEEEE{ background-color: #EEEEEE}
.bg-F5F5F5{ background-color: #F5F5F5}
/* 字体颜色 */
/* 常用字体黑色色阶向下 */
.color-black2 {color: #222222}
.color-black3 {color: #333333}
.color-black4 {color: #444444}
.color-black6 {color: #666666}
.color-black7 {color: #777777}
.color-black8 {color: #888888}
.color-black9 {color: #999999}
/* 常用字体颜色 */
.color-FFFFFF{color: #FFFFFF}
.color-red{color: red;}
/*文字操作 */
/*居中*/
.text-center{text-align: center}
/*右对齐*/
.text-right{text-align: right}
/* 自定义颜色区域 样式名为 xx-base{ } 可修改*/
.bg-base{} /* 背景颜色(可修改)*/
.color-base{} /* 字体颜色(可修改) */
.mouse{cursor:hand}
.row-col {
padding: 0 8px;
}
/* 首行缩进 */
.text-indent{
text-indent: 2em;
}
</style>
......@@ -7,3 +7,13 @@ export const login = params => {
params
});
}
//获取验证码
export const getCoedeImg = params =>{
return sendRequest({
baseURL:'http://auth.project.gxdpf.org.cn/getImage',
method: 'get',
params
});
}
......@@ -9,7 +9,6 @@ import http from './http'
* @param method 请求方式: POST(默认)、GET
* */
export const sendRequest = (obj) => {
return new Promise((resolve, reject) => {
//调用请求方法
http(obj).then(res => {
......
let utils = {
// 权限判断
hasRole (value) {
if (!value) return
let actions = JSON.parse(localStorage.getItem('power')) || ''
if (!actions) return
let success = true
actions.map(v => {
if (v === value) {
success = true
return true
}
})
if (success) {
return true
} else {
return true
}
},
//判断子系统有没有权限
subsystem(val){
if (!value) return
let actions = JSON.parse(localStorage.getItem('power')) || ''
if (!actions) return
let success = true
actions.map(v => {
let newSub = v.splice('/')[1]
})
if (success) {
return true
} else {
return true
}
}
}
export default utils
......@@ -5,11 +5,16 @@ import App from './App'
import router from './router'
import ViewUI from 'view-design';
import 'view-design/dist/styles/iview.css';
import echarts from 'echarts'
import utils from "./commons/utils/index.js"
Vue.prototype.$echarts = echarts
Vue.config.productionTip = false
Vue.use(ViewUI);
Vue.prototype.utils = utils
router.beforeEach((to, from, next) => {
if (to.matched.some(m => m.meta.requireAuth)) {
......@@ -28,8 +33,6 @@ router.beforeEach((to, from, next) => {
})
/* eslint-disable no-new */
new Vue({
el: '#app',
......
......@@ -8,7 +8,8 @@ import userList from "@/view/user/list.vue" //列表
Vue.use(Router)
export default new Router({
mode:'history',
mode:'hash',
//mode: 'history',
routes: [{
path: '/',
redirect: '/login'
......@@ -24,11 +25,76 @@ export default new Router({
meta: {
requireAuth: true
},
children: [{
path: '/user/list',
name: "userList",
component: userList,
}]
children: [
/* 综合门户 */
{
path: '/gateway/handle',
name: "gateway-handle",
component: () => import('@/view/gateway/handle/index.vue') //任务处理
},
{
path: '/gateway/map',
name: "gateway-map",
component: () => import('@/view/gateway/map/index.vue') //任务地图
},
{
path: '/gateway/theDisabled/list',
name: "gateway-theDisabled-list",
component: () => import('@/view/gateway/theDisabled/list.vue') //残疾人数据实时统计
},
{
path: '/gateway/theDisabled/progress',
name: "gateway-theDisabled-progress",
component: () => import('@/view/gateway/theDisabled/progress.vue') //残疾人小康进程实现程度
},
{
path: '/gateway/dbNum/index',
name: "gateway-dbNum",
component: () => import('@/view/gateway/dbNum/index.vue') //残疾人小康进程实现程度
},
/* 党员扶残 */
{
path: '/auxiliaryDisability/information/index',
name: "auxiliaryDisability-information",
component: () => import('@/view/auxiliaryDisability/information/index.vue') //信息查询
},
{
path: '/auxiliaryDisability/tasks/taskNums',
name: "auxiliaryDisability-information",
component: () => import('@/view/auxiliaryDisability/tasks/taskNums.vue') //任务指数管理
},
{
path: '/admin/administrators/subsystem',
name: "administrators-subsystem",
component: () => import('@/view/admin/administrators/subsystem.vue') //子系统管理
},
{
path: '/admin/administrators/adminList',
name: "administrators-adminList",
component: () => import('@/view/admin/administrators/adminList.vue') //用户列表
},
{
path: '/admin/administrators/roleList',
name: "administrators-roleList",
component: () => import('@/view/admin/administrators/roleList.vue') //角色管理
},
{
path: '/admin/administrators/dictionary',
name: "administrators-dictionary",
component: () => import('@/view/admin/administrators/dictionary.vue') //数据字典
},
{
path: '/admin/administrators/config',
name: "administrators-config",
component: () => import('@/view/admin/administrators/config.vue') //日志查询
},
{
path: '/admin/administrators/powerList',
name: "administrators-config",
component: () => import('@/view/admin/administrators/powerList.vue') //权限管理
}
]
}
]
})
const menu = [{
title: "会员管理",
icon: 'ios-people',
children: [{
title: '会员列表',
path: '/user/list',
action: 'member-page'
}
]
},
{
title: "会员管理1",
icon: 'ios-people',
children: [{
title: '会员列表1',
path: '/user/list',
action: 'member-page'
}]
},
const menu = [
// {
// title: "综合门户",
// children: [{
// title: "任务处理",
// icon: 'ios-people',
// children: [{
// title: '任务处理',
// path: '/gateway/handle',
// action: 'member-page'
// }]
// },{
// title: "任务地图",
// icon: 'ios-people',
// children: [{
// title: '任务地图',
// path: '/gateway/map',
// action: 'member-page'
// }]
// },
// {
// title: "残疾人统计",
// icon: 'ios-people',
// children: [{
// title: '残疾人数据实时统计',
// path: '/gateway/theDisabled/list',
// action: 'gateway-theDisabled-list'
// },
// {
// title: '残疾人小康进程实现程度',
// path: '/gateway/theDisabled/progress',
// action: 'member-page'
// }]
// },
// {
// title: "数据库统计",
// icon: 'ios-people',
// children: [{
// title: '数据库信息',
// path: '/gateway/dbNum/index',
// action: 'gateway-dbNum'
// }]
// }]
// },
{
title: "会员管理2",
icon: 'ios-people',
title: "党员扶残",
path:"/auxiliaryDisability",
children: [{
title: '会员列表2',
path: '/user/list',
action: 'member-page'
title: "信息查询",
icon: 'ios-people',
path:'/auxiliaryDisability/information',
children: [{
title: '信息查询',
path: '/auxiliaryDisability/information/index',
action: 'auxiliaryDisability-information-index'
}]
},
{
title: "事前把关",
icon: 'ios-people',
path:'/auxiliaryDisability/tasks',
children: [{
title: '任务指数管理',
path: '/auxiliaryDisability/tasks/taskNums',
action: 'auxiliaryDisability-tasks-taskNums'
},
]
}]
},
{
title: "会员管理3",
icon: 'ios-people',
title: "系统管理",
path:'/admin',
children: [{
title: '会员列表3',
path: '/user/list',
action: 'member-page'
title: "系统管理",
icon: 'ios-people',
path:'/admin/administrators',
children: [{
title: '子系统管理',
path: '/admin/administrators/subsystem',
action: 'admin-administrators-subsystem'
},
{
title: '用户管理',
path: '/admin/administrators/adminList',
action: 'admin-administrators-adminList'
},
{
title: '角色管理',
path: '/admin/administrators/roleList',
action: 'admin-administrators-roleList'
},
{
title: '权限管理',
path: '/admin/administrators/powerList',
action: 'admin-administrators-powerList'
},
{
title: '数据字典',
path: '/admin/administrators/dictionary',
action: 'admin-administrators-dictionary'
},
{
title: '日志管理',
path: '/admin/administrators/config',
action: 'admin-administrators-config'
}]
}]
}
]
......
<template>
<div class="layout">
<Sider breakpoint="md" collapsible :collapsed-width="78" v-model="isCollapsed" :style="{position: 'fixed', height: '100vh', left: 0, overflow: 'auto',backgroundColor:'#20222A' }">
<div class="title">
<h4>后台管理系统</h4>
</div>
<Menu active-name="1-2" theme="dark" width="auto" :open-names="['1']">
<Submenu :name="index" v-for="(item,index) in menu" :key="index">
<template slot="title">
<Icon :type="item.icon"></Icon>
{{item.title}}
</template>
<MenuItem :name="`${index}-${i}`" v-for="(v,i) in item.children" :key="i" :to="v.path" @click.native="onSelect(index,i)">
{{v.title}}
</MenuItem>
</Submenu>
</Menu>
</Sider>
<Layout :style="{marginLeft: '200px'}">
<Header :style="{ background: '#fff',borderBottom:'1px solid rgba(0, 0, 0, .1)',height: '50px',lineHeight:'50px'}">
<Row type="flex" justify="end" align="middle">
<div class="name">name</div>
<Button type="error" size="small" @click="loginOut">退出登录</Button>
</Row>
</Header>
<Content :style="{padding: '0 16px 16px'}">
<Breadcrumb :style="{margin: '8px 0'}">
<BreadcrumbItem>{{menu[menuIndex].title}}</BreadcrumbItem>
<BreadcrumbItem>{{menu[menuIndex].children[menuChildren].title}}</BreadcrumbItem>
</Breadcrumb>
<div class="content">
<router-view />
</div>
</Content>
</Layout>
</div>
</template>
<script>
import menus from "../router/menu.js"
export default {
data() {
return {
menu: menus,
menuIndex: 0,
menuChildren: 0,
type: 0,
isCollapsed:false
}
},
computed: {
menuitemClasses() {
return [
'menu-item',
this.isCollapsed ? 'collapsed-menu' : ''
]
}
},
created() {
// setTimeout(()=>{
// this.$router.push('/login')
// },5000)
},
methods: {
onSelect(index, i) {
this.menuIndex = index
this.menuChildren = i
},
loginOut() {
localStorage.removeItem('token')
this.$router.push('/login')
}
}
}
</script>
<style scoped>
.layout {
border: 1px solid #d7dde4;
background: #e6e6e6;
position: relative;
border-radius: 4px;
overflow: hidden;
}
.layout-header-bar {
background: #fff;
box-shadow: 0 1px 1px rgba(0, 0, 0, .1);
}
.name {
margin-right: 30px;
}
.ivu-menu-dark {
background: #20222A;
}
.ivu-menu-dark.ivu-menu-vertical .ivu-menu-submenu .ivu-menu-item-active,
.ivu-menu-dark.ivu-menu-vertical .ivu-menu-submenu .ivu-menu-item-active:hover {
border-right: none;
color: #fff;
background: #2d8cf0 !important;
}
.title {
height: 50px;
text-align: center;
line-height: 50px;
color: #EEEEEE;
border-bottom: 1px solid rgba(0, 0, 0, .1);
}
.content {
overflow: auto;
height: 750px;
}
.content::-webkit-scrollbar {
width: 4px;
background-color: #d8d8d8;
}
/* 滚动槽 */
.content::-webkit-scrollbar-track {
border-radius: 10px;
}
.content::-webkit-scrollbar-thumb {
background-color: #bfc1c4;
}
.ivu-layout {
background-color: #f5f5f5;
}
</style>
<template>
<Row type="flex" justify="center">
<Col :xs="24" :md="24">
<Card>
<p slot="title">
<span class="font-20">用户管理</span>
</p>
<Card>
<div class="formTopClass">
<Form :model="searchForm" :label-width="40" inline>
<FormItem label="名称" class="ivuFormItem">
<Input v-model="searchForm.name" placeholder="请输入名称" class="newInput"></Input>
</FormItem>
<FormItem label="邮箱" class="ivuFormItem">
<Input v-model="searchForm.email" placeholder="请输入邮箱" class="newInput"></Input>
</FormItem>
<FormItem class="ivuFormItem">
<Button type="primary" @click="searchFun">
<Icon type="md-search" />
查询
</Button>
</FormItem>
<FormItem class="ivuFormItem">
<Button type="primary" @click="add">
<Icon type="md-add" />
增加
</Button>
</FormItem>
</Form>
</div>
</Card>
<Table border :columns="listColumns" :data="list">
<!-- 操作 -->
<template slot-scope="{ row, index }" slot="action">
<Button type="primary" size="small" style="margin-right: 5px" @click="editFun(row)">
<Icon type="md-create" />
编辑
</Button>
<Button type="error" size="small" @click="remove(index)">
<Icon type="md-trash" />
删除
</Button>
</template>
</Table>
<Page :total="pageInfo.total" :page-size="pageInfo.size" @on-change="pageFun" :current="pageInfo.page" show-total
show-elevator style="margin-top: 20px;" />
<!-- 弹框 -->
<Modal v-model="modalInfor.modalType" :title="modalInfor.title?'添加':'修改'" @on-cancel="modalInfor.modalType=false">
<Form ref="modalInfordata" :model="modalInfordata" :label-width="60">
<FormItem label="用户名" prop="name">
<Input v-model="modalInfordata.name" placeholder="请输入用户名"></Input>
</FormItem>
<FormItem label="密码" prop="pwd">
<Input v-model="modalInfordata.pwd" placeholder="请输入密码"></Input>
</FormItem>
<FormItem label="邮箱" prop="email">
<Input v-model="modalInfordata.email" placeholder="请输入密码"></Input>
</FormItem>
<FormItem label="号码" prop="tel">
<Input v-model="modalInfordata.tel" placeholder="请输入号码"></Input>
</FormItem>
<FormItem label="角色" prop="role">
<Select v-model="modalInfordata.role" placeholder="角色">
<Option value="text">文字</Option>
<Option value="video">视频</Option>
<Option value="img">图片</Option>
</Select>
</FormItem>
<FormItem label="状态" prop="state">
<Select v-model="modalInfordata.state" placeholder="状态">
<Option value="text">文字</Option>
<Option value="video">视频</Option>
<Option value="img">图片</Option>
</Select>
</FormItem>
<FormItem label="部门" prop="department">
<Select v-model="modalInfordata.department" placeholder="部门">
<Option value="text">文字</Option>
<Option value="video">视频</Option>
<Option value="img">图片</Option>
</Select>
</FormItem>
</Form>
<div slot="footer">
<Row type="flex" justify="center">
<Button type="primary" @click="onOk">
{{modalInfor.title?'添加':'修改'}}
</Button>
<Button @click="handleReset('modalInfordata')" style="margin-left: 80px;">重置</Button>
</Row>
</div>
</Modal>
</Card>
</Col>
</Row>
</template>
<script>
export default {
data() {
return {
//弹出框信息
modalInfor: {
modalType: false, //弹出框
title: true, //add -> true update ->false
},
//弹出框的值
modalInfordata: {
name: '',
pwd: '',
email: '',
tel: '',
role: '',
},
pageInfo: {
total: 100,
size: 10,
page: 1
},
searchForm: {},
adminList: [],
listColumns: [{
title: '编号',
key: 'id',
type: 'index',
sortable: true
},
{
title: '名称',
key: 'name',
sortable: true
},
{
title: '邮箱',
key: 'email',
sortable: true
},
{
title: '电话',
key: 'tel',
sortable: true
},
{
title: '状态',
key: 'state',
sortable: true
},
{
title: '创建时间',
key: 'email',
sortable: true
},
{
title: '最后更新人',
key: 'email',
sortable: true
},
{
title: '最后更新时间',
key: 'email',
sortable: true
},
{
title: '操作',
slot: 'action'
}
],
list: [{
name: 'laojia',
email: '1510017964@qq.com',
tel: '18775958633'
}]
}
},
methods: {
//添加
add() {
this.modalInfor.modalType = true
this.modalInfor.title = true
this.modalInfordata = {}
},
//编辑
editFun(row) {
this.modalInfor.modalType = true
this.modalInfor.title = false
this.modalInfordata = row //赋值于修改input
},
//操作完成 true 添加,false 修改
onOk() {
if (this.modalInfor.modalType) {
console.log("添加")
} else {
console.log('修改')
}
},
//清除
handleReset(name) {
this.modalInfordata = {}
},
searchFun() {
console.log("搜索")
},
//分页操作
pageFun(e) {
console.log(e)
}
}
}
</script>
<style scoped="scoped">
.formTopClass {
margin: 0;
}
.formTopClass .ivu-form-item {
margin-bottom: 0px !important;
}
</style>
<template>
<Row type="flex" justify="center">
<Col :xs="24" :md="24">
<Card>
<p slot="title">
<span class="font-20">日志管理</span>
</p>
<Card>
<div class="formTopClass">
<Form :model="searchForm" :label-width="80" inline>
<FormItem label="用户名" class="ivuFormItem">
<Input v-model="searchForm.name" placeholder="请输入用户名" class="newInput"></Input>
</FormItem>
<FormItem label="操作类型" class="ivuFormItem">
<Input v-model="searchForm.email" placeholder="请输入操作类型" class="newInput"></Input>
</FormItem>
<FormItem class="ivuFormItem">
<Button type="primary">
<Icon type="md-search" />
查询
</Button>
</FormItem>
</Form>
</div>
</Card>
<Table border :columns="subsystemList" :data="data5"></Table>
<Page :total="pageInfo.total" :page-size="pageInfo.size" :current="pageInfo.page" show-total
show-elevator style="margin-top: 20px;" />
</Card>
</Col>
</Row>
</template>
<script>
export default {
data() {
return {
data5:[],
pageInfo: {
total: 100,
size: 10,
page: 1
},
searchForm:{},
subsystemList: [{
title: '编号',
key: 'date',
type: 'index',
sortable: true
},
{
title: '用户',
key: 'name',
sortable: true
},
{
title: '浏览器',
key: 'name',
sortable: true
},
{
title: '操作类型',
key: 'name',
sortable: true
},
{
title: 'IP',
key: 'name',
sortable: true
},
{
title: '来源',
key: 'name',
sortable: true
},
{
title: '访问地址',
key: 'name',
sortable: true
},
{
title: '创建时间',
key: 'name',
sortable: true
},
]
}
}
}
</script>
const datas = [{
title: 'parent 1',
expand: true,
children: [{
title: 'parent 1-1',
expand: true,
children: [{
title: 'leaf 1-1-1',
type:'15151515151'
},
{
title: 'leaf 1-1-2',
type:'000000000'
}
]
},
{
title: 'parent 1-2',
expand: true,
children: [{
title: 'leaf 1-2-1'
},
{
title: 'leaf 1-2-1'
}
]
}
]
}]
export default datas
<template>
<Row type="flex" justify="center">
<Col :xs="24" :md="24">
<Card>
<p slot="title">
<span class="font-20">数据字典</span>
</p>
<Card>
<div class="formTopClass">
<Form :model="searchForm" :label-width="80" inline>
<FormItem label="类型编码" class="ivuFormItem">
<Input v-model="searchForm.typeCode" placeholder="请输入类型编码" class="newInput"></Input>
</FormItem>
<FormItem label="类型描述" class="ivuFormItem">
<Input v-model="searchForm.email" placeholder="请输入类型描述" class="newInput"></Input>
</FormItem>
<FormItem class="ivuFormItem">
<Button type="primary" @click="searchFun">
<Icon type="md-search" />
查询
</Button>
</FormItem>
<FormItem class="ivuFormItem">
<Button type="primary" @click="add">
<Icon type="md-add" />
增加
</Button>
</FormItem>
<FormItem class="ivuFormItem">
<Button type="primary">
<Icon type="md-refresh-circle" />
刷新
</Button>
</FormItem>
</Form>
</div>
</Card>
<Table border :columns="listColumns" :data="list">
<!-- 操作 -->
<template slot-scope="{ row, index }" slot="action">
<Button type="primary" size="small" style="margin-right: 5px" @click="editFun(row)">
<Icon type="md-create" />
编辑
</Button>
<Button type="error" size="small" @click="remove(index)">
<Icon type="md-trash" />
删除
</Button>
</template>
</Table>
<Page :total="pageInfo.total" :page-size="pageInfo.size" @on-change="pageFun" :current="pageInfo.page" show-total
show-elevator style="margin-top: 20px;" />
<!-- 弹框 -->
<Modal v-model="modalInfor.modalType" :title="modalInfor.title?'添加':'修改'" @on-cancel="modalInfor.modalType=false">
<Form ref="modalInfordata" :model="modalInfordata" :label-width="80">
<FormItem label="代码" prop="name">
<Input v-model="modalInfordata.name" placeholder="请输入用户名"></Input>
</FormItem>
<FormItem label="代码描述" prop="pwd">
<Input v-model="modalInfordata.pwd" placeholder="请输入密码"></Input>
</FormItem>
<FormItem label="类型编码" prop="email">
<Input v-model="modalInfordata.email" placeholder="请输入密码"></Input>
</FormItem>
<FormItem label="类型描述" prop="tel">
<Input v-model="modalInfordata.tel" placeholder="请输入号码"></Input>
</FormItem>
<FormItem label="排序号" prop="role">
<Input v-model="modalInfordata.tel" placeholder="请输入号码"></Input>
</FormItem>
<FormItem label="状态" prop="state">
<Select v-model="modalInfordata.state" placeholder="状态">
<Option value="text">启用</Option>
<Option value="video">未启用</Option>
</Select>
</FormItem>
</Form>
<div slot="footer">
<Row type="flex" justify="center">
<Button type="primary" @click="onOk">
{{modalInfor.title?'添加':'修改'}}
</Button>
<Button @click="handleReset('modalInfordata')" style="margin-left: 80px;">重置</Button>
</Row>
</div>
</Modal>
</Card>
</Col>
</Row>
</template>
<script>
export default {
data() {
return {
//弹出框信息
modalInfor: {
modalType: false, //弹出框
title: true, //add -> true update ->false
},
//弹出框的值
modalInfordata: {
name: '',
pwd: '',
email: '',
tel: '',
role: '',
},
pageInfo: {
total: 100,
size: 10,
page: 1
},
searchForm: {},
adminList: [],
listColumns: [{
title: '编号',
key: 'id',
type: 'index',
sortable: true
},
{
title: '代码',
key: 'code',
sortable: true
},
{
title: '代码描述',
key: 'codeDescribe',
sortable: true
},
{
title: '类型代码',
key: 'typeCode',
sortable: true
},
{
title: '排序',
key: 'sort',
sortable: true
},
{
title: '状态',
key: 'state',
sortable: true
},
{
title: '创建时间',
key: 'email',
sortable: true
},
{
title: '最后更新人',
key: 'email',
sortable: true
},
{
title: '最后更新时间',
key: 'email',
sortable: true
},
{
title: '操作',
slot: 'action',
minWidth:60
}
],
list: [{
name: 'laojia',
email: '1510017964@qq.com',
tel: '18775958633'
}]
}
},
methods: {
//添加
add() {
this.modalInfor.modalType = true
this.modalInfor.title = true
this.modalInfordata = {}
},
//编辑
editFun(row) {
this.modalInfor.modalType = true
this.modalInfor.title = false
this.modalInfordata = row //赋值于修改input
},
//操作完成 true 添加,false 修改
onOk() {
if (this.modalInfor.modalType) {
console.log("添加")
} else {
console.log('修改')
}
},
//清除
handleReset(name) {
this.modalInfordata = {}
},
searchFun() {
console.log("搜索")
},
//分页操作
pageFun(e) {
console.log(e)
}
}
}
</script>
<style scoped="scoped">
.formTopClass {
margin: 0;
}
.formTopClass .ivu-form-item {
margin-bottom: 0px !important;
}
</style>
<template>
<Row type="flex" justify="center">
<Col :xs="24" :md="24">
<Card>
<p slot="title">
<span class="font-20">权限管理</span>
</p>
<Card>
<div class="formTopClass">
<Form :model="searchForm" :label-width="80" inline>
<FormItem label="名称" class="ivuFormItem">
<Input v-model="searchForm.typeCode" placeholder="请输入名称" class="newInput"></Input>
</FormItem>
<FormItem label="URL" class="ivuFormItem">
<Input v-model="searchForm.email" placeholder="请输入URL" class="newInput"></Input>
</FormItem>
<FormItem class="ivuFormItem">
<Button type="primary" @click="searchFun">
<Icon type="md-search" />
查询
</Button>
</FormItem>
<FormItem class="ivuFormItem">
<Button type="primary" @click="add">
<Icon type="md-add" />
增加
</Button>
</FormItem>
<FormItem class="ivuFormItem">
<Button type="primary">
<Icon type="md-refresh-circle" />
刷新
</Button>
</FormItem>
</Form>
</div>
</Card>
<Table border :columns="listColumns" :data="list">
<!-- 操作 -->
<template slot-scope="{ row, index }" slot="action">
<Button type="primary" size="small" style="margin-right: 5px" @click="editFun(row)">
<Icon type="md-create" />
编辑
</Button>
<Button type="error" size="small" @click="remove(index)">
<Icon type="md-trash" />
删除
</Button>
</template>
</Table>
<Page :total="pageInfo.total" :page-size="pageInfo.size" @on-change="pageFun" :current="pageInfo.page" show-total
show-elevator style="margin-top: 20px;" />
<!-- 弹框 -->
<Modal v-model="modalInfor.modalType" :title="modalInfor.title?'添加':'修改'" @on-cancel="modalInfor.modalType=false">
<Form ref="modalInfordata" :model="modalInfordata" :label-width="100">
<FormItem label="资源父级名称" prop="name">
<Input v-model="modalInfordata.name" placeholder="请输入资源父级名称"></Input>
</FormItem>
<FormItem label="资源名称" prop="pwd">
<Input v-model="modalInfordata.pwd" placeholder="请输入资源名称"></Input>
</FormItem>
<FormItem label="资源URL" prop="email">
<Input v-model="modalInfordata.email" placeholder="请输入资源URL"></Input>
</FormItem>
<FormItem label="资源描述" prop="tel">
<Input v-model="modalInfordata.tel" placeholder="请输入资源描述"></Input>
</FormItem>
<FormItem label="资源类型" prop="state">
<Select v-model="modalInfordata.state" placeholder="资源类型">
<Option value="text">启用</Option>
<Option value="video">未启用</Option>
</Select>
</FormItem>
<FormItem label="排序号" prop="tel">
<Input v-model="modalInfordata.tel" placeholder="请输入排序号"></Input>
</FormItem>
<FormItem label="所属子系统" prop="state">
<Select v-model="modalInfordata.state" placeholder="所属子系统">
<Option value="text">启用</Option>
<Option value="video">未启用</Option>
</Select>
</FormItem>
</Form>
<div slot="footer">
<Row type="flex" justify="center">
<Button type="primary" @click="onOk">
{{modalInfor.title?'添加':'修改'}}
</Button>
<Button @click="handleReset('modalInfordata')" style="margin-left: 80px;">重置</Button>
</Row>
</div>
</Modal>
</Card>
</Col>
</Row>
</template>
<script>
export default {
data() {
return {
//弹出框信息
modalInfor: {
modalType: false, //弹出框
title: true, //add -> true update ->false
},
//弹出框的值
modalInfordata: {
name: '',
pwd: '',
email: '',
tel: '',
role: '',
},
pageInfo: {
total: 100,
size: 10,
page: 1
},
searchForm: {},
adminList: [],
listColumns: [{
title: '编号',
key: 'id',
type: 'index',
sortable: true
},
{
title: '系统ID',
key: 'code',
sortable: true
},
{
title: '名称',
key: 'codeDescribe',
sortable: true
},
{
title: 'URL',
key: 'typeCode',
sortable: true
},
{
title: '描述',
key: 'sort',
sortable: true
},
{
title: '排序',
key: 'sort',
sortable: true
},
{
title: '类型',
key: 'type',
sortable: true
},
{
title: '状态',
key: 'state',
sortable: true
},
{
title: '最后更新人',
key: 'email',
sortable: true
},
{
title: '最后更新时间',
key: 'email',
sortable: true
},
{
title: '操作',
slot: 'action',
minWidth:60
}
],
list: [{
name: 'laojia',
email: '1510017964@qq.com',
tel: '18775958633'
}]
}
},
methods: {
//添加
add() {
this.modalInfor.modalType = true
this.modalInfor.title = true
this.modalInfordata = {}
},
//编辑
editFun(row) {
this.modalInfor.modalType = true
this.modalInfor.title = false
this.modalInfordata = row //赋值于修改input
},
//操作完成 true 添加,false 修改
onOk() {
if (this.modalInfor.modalType) {
console.log("添加")
} else {
console.log('修改')
}
},
//清除
handleReset(name) {
this.modalInfordata = {}
},
searchFun() {
console.log("搜索")
},
//分页操作
pageFun(e) {
console.log(e)
}
}
}
</script>
<style scoped="scoped">
.formTopClass {
margin: 0;
}
.formTopClass .ivu-form-item {
margin-bottom: 0px !important;
}
</style>
<template>
<Row type="flex" justify="center">
<Col :xs="24" :md="24">
<Card>
<p slot="title">
<span class="font-20">角色管理</span>
</p>
<Card>
<div class="formTopClass">
<Form :model="searchForm" :label-width="40" inline>
<FormItem label="名称" class="ivuFormItem">
<Input v-model="searchForm.name" placeholder="请输入名称" class="newInput"></Input>
</FormItem>
<FormItem label="邮箱" class="ivuFormItem">
<Input v-model="searchForm.email" placeholder="请输入邮箱" class="newInput"></Input>
</FormItem>
<FormItem class="ivuFormItem">
<Button type="primary" @click="searchFun">
<Icon type="md-search" />
查询
</Button>
</FormItem>
<FormItem class="ivuFormItem">
<Button type="primary" @click="add">
<Icon type="md-add" />
增加
</Button>
</FormItem>
</Form>
</div>
</Card>
<Table border :columns="listColumns" :data="adminList"></Table>
<Page :total="pageInfo.total" :page-size="pageInfo.size" @on-change="pageFun" :current="pageInfo.page" show-total
show-elevator style="margin-top: 20px;" />
</Card>
</Col>
<Modal v-model="modalInfor.modalType" :title="modalInfor.title?'添加':'修改'" @on-cancel="modalInfor.modalType=false">
<Form ref="modalInfordata" :model="modalInfordata" :label-width="80">
<FormItem label="名称" prop="name">
<Input v-model="modalInfordata.name" placeholder="请输入用户名"></Input>
</FormItem>
<FormItem label="描述" prop="pwd">
<Input v-model="modalInfordata.pwd" placeholder="请输入密码"></Input>
</FormItem>
<FormItem label="排序" prop="pwd">
<Input v-model="modalInfordata.pwd" placeholder="请输入排序"></Input>
</FormItem>
<FormItem label="状态" prop="email">
<Select v-model="modalInfordata.role" placeholder="请选择状态">
<Option value="text">启用</Option>
<Option value="video">未启用</Option>
</Select>
</FormItem>
<FormItem label="权限配置" prop="pwd">
<Row>
<Col :xs="24" :md="12">
<Tree :data="datas" show-checkbox @on-select-change="selectChange" @on-check-change="checkChange"></Tree>
</Col>
<Col :xs="24" :md="12">
权限
</Col>
</Row>
</FormItem>
</Form>
<div slot="footer">
<Row type="flex" justify="center">
<Button type="primary" @click="onOk">
{{modalInfor.title?'添加':'修改'}}
</Button>
<Button @click="handleReset('modalInfordata')" style="margin-left: 80px;">重置</Button>
</Row>
</div>
</Modal>
</Row>
</template>
<script>
import menu from '@/router/menu.js'
export default {
data() {
return {
datas: menu,
//弹出框信息
modalInfor: {
modalType: false, //弹出框
title: true, //add -> true update ->false
},
//弹出框的值
modalInfordata: {
name: '',
pwd: '',
email: '',
tel: '',
role: '',
},
pageInfo: {
total: 100,
size: 10,
page: 1
},
searchForm: {},
adminList: [],
listColumns: [{
title: '编号',
key: 'id',
type: 'index',
sortable: true
},
{
title: '名称',
key: 'name',
sortable: true
},
{
title: '描述',
key: 'email',
sortable: true
},
{
title: '排序',
key: 'email',
sortable: true
},
{
title: '状态',
key: 'email',
sortable: true
},
{
title: '创建时间',
key: 'email',
sortable: true
},
{
title: '最后更新人',
key: 'email',
sortable: true
},
{
title: '最后更新时间',
key: 'email',
sortable: true
},
{
title: '操作',
}
]
}
},
created() {
},
methods: {
//添加
add() {
this.modalInfor.modalType = true
this.modalInfor.title = true
this.modalInfordata = {}
},
//编辑
editFun(row) {
this.modalInfor.modalType = true
this.modalInfor.title = false
this.modalInfordata = row //赋值于修改input
},
handleReset(name) {
this.modalInfordata = {}
},
//操作完成 true 添加,false 修改
onOk() {
if (this.modalInfor.modalType) {
console.log("添加")
} else {
console.log('修改')
}
},
searchFun() {
console.log("搜索")
},
//分页操作
pageFun(e) {
console.log(e)
},
selectChange(e) {
console.log(e)
},
checkChange(e) {
console.log(e)
}
}
}
</script>
<style scoped="scoped">
.formTopClass {
margin: 0;
}
.formTopClass .ivu-form-item {
margin-bottom: 0px !important;
}
</style>
<template>
<Row type="flex" justify="center">
<Col :xs="24" :md="24">
<Card>
<p slot="title">
<span class="font-20">子系统管理</span>
</p>
<Table border :columns="subsystemList" :data="data5"></Table>
</Card>
</Col>
</Row>
</template>
<script>
export default {
data() {
return {
data5:[],
subsystemList: [{
title: '编号',
key: 'date',
type: 'index',
sortable: true
},
{
title: '系统名称',
key: 'name',
sortable: true
},
{
title: '创建时间',
key: 'name',
sortable: true
},
{
title: '修改时间',
key: 'name',
sortable: true
},
]
}
}
}
</script>
<template>
<Row type="flex" justify="center">
<Col :xs="24" :md="20">
<Card>
<p slot="title">
<span class="font-weight-bold">党员扶贫项目监管监督</span>
</p>
<Row type="flex" justify="space-between" align="middle">
<Col>通知公告</Col>
<Col>
<Button type="primary">导出表格</Button>
</Col>
</Row>
<div style="margin: 20px 0 20px;">
<Table border :columns="notice"></Table>
<Row type="flex" justify="end" style="margin: 20px 0 20px;">
<Page :total="pageInfo.total" :page-size="pageInfo.size" :current="pageInfo.page"
show-total show-elevator show-sizer style="background-color: #FFFFFF;" />
</Row>
</div>
<Card>
<p slot="title">
<span class="font-weight-bold">搜索条件</span>
</p>
<Form :model="lookup" :label-width="80" inline>
<FormItem label="行政区域">
<Select v-model="lookup.select" class="minwidth">
<Option value="beijing">New York</Option>
<Option value="shanghai">London</Option>
<Option value="shenzhen">Sydney</Option>
</Select>
</FormItem>
<FormItem>
<Button type="primary">查询</Button>
</FormItem>
</Form>
</Card>
<Card style="margin: 20px 0 20px;">
<p slot="title">
<span class="font-weight-bold">警告通知</span>
</p>
<Row>
<Col :xs="24" :md="6">
<div class="text-center">
<p>数据异常</p>
<p class="font-30 font-weight-bold">0</p>
</div>
</Col>
<Col :xs="24" :md="6">
<div class="text-center">
<p>资金互斥</p>
<p class="font-30 font-weight-bold">0</p>
</div>
</Col>
<Col :xs="24" :md="6">
<div class="text-center">
<p>任务超时</p>
<p class="font-30 font-weight-bold">0</p>
</div>
</Col>
<Col :xs="24" :md="6">
<div class="text-center">
<p>未操作天数</p>
<p class="font-30 font-weight-bold">0</p>
</div>
</Col>
</Row>
</Card>
</Card>
</Col>
</Row>
</template>
<script>
export default {
data() {
return {
pageInfo: {}, //分页信息
lookup:{}, //查询条件
notice: [{
title: "时间",
key: "time"
}, {
title: "标题",
key: "titile"
},
{
title: "简介",
key: "introduce"
},
{
title: "查看",
key: "look"
}
]
}
},
created() {
},
methods: {
}
}
</script>
<style scoped="scoped">
.minwidth{
width: 200px;
}
</style>
<template>
<Row>
<Col :xs="24" :md="20">
<Card>
<p slot="title">
<span class="font-weight-bold">搜索条件</span>
</p>
</Card>
</Col>
</Row>
</template>
<script>
</script>
<style>
</style>
<template>
<!-- <Row type="flex" justify="center">
<Col :xs="24" :md="20">
<p slot="title">
搜索条件
</p>
<p slot="extra">
<Button type="primary">新增项目</Button>
</p>
</Col>
</Row> -->
<Row type="flex" justify="center" class="card-top">
<Col :xs="24" :md="18">
<Card>
<Row type="flex" justify="space-between" align="middle" slot="title">
<Col>
<span class="font-weight-bold">搜索条件</span>
</Col>
<Col>
<Button type="primary">新增项目</Button>
</Col>
</Row>
<Form :model="lookup" :label-width="80" inline>
<FormItem label="行政区域">
<Select v-model="lookup.select" class="minwidth">
<Option value="beijing">New York</Option>
<Option value="shanghai">London</Option>
<Option value="shenzhen">Sydney</Option>
</Select>
</FormItem>
<FormItem label="年份">
<Select v-model="lookup.time" class="minwidth">
<Option value="beijing">New York</Option>
</Select>
</FormItem>
<FormItem label="每页">
<Select v-model="lookup.size" class="minwidth">
<Option value="5">5</Option>
<Option value="10">10</Option>
<Option value="20">20</Option>
</Select>
</FormItem>
<FormItem>
<Button type="primary">查询</Button>
</FormItem>
</Form>
</Card>
<Card class="card-top">
<p class="font-20">资金指标与下级区域之和不相等有:</p>
<p class="text-indent">江南区、西乡塘区、良庆区、邕宁区、武鸣区、隆安县、马山县、上林县、宾阳县、横县</p>
<p class="font-20">任务数与下级区域之和不相等有:</p>
<p class="text-indent">江南区、西乡塘区、良庆区、邕宁区、武鸣区、隆安县、马山县、上林县、宾阳县、横县</p>
</Card>
<Card class="card-top">
<Row type="flex" justify="space-between" align="middle" slot="title">
<Col>
<span class="font-weight-bold">项目任务指标</span>
</Col>
<Col>
<Button type="primary">导出表格</Button>
</Col>
</Row>
<Table border :columns="notice"></Table>
<Row type="flex" justify="end" style="margin: 20px 0 20px;">
<Page :total="pageInfo.total" :page-size="pageInfo.size" :current="pageInfo.page" show-total show-elevator
show-sizer style="background-color: #FFFFFF;" />
</Row>
</Card>
<Card class="card-top">
<Row type="flex" justify="space-between" align="middle" slot="title">
<Col>
<span class="font-weight-bold">任务指标信息</span>
</Col>
<Col>
<Button type="primary">刷新新增</Button>
</Col>
</Row>
<Row type="flex" justify="center" style="margin: 20px 0 20px;">
<Col :xs="24" :md="10">
<Form :model="lookup" :label-width="80">
<FormItem label="年份">
<Select v-model="lookup.time" class="minwidth">
<Option value="beijing">New York</Option>
</Select>
</FormItem>
<FormItem label="行政区域">
<Select v-model="lookup.select" class="minwidth">
<Option value="beijing">New York</Option>
<Option value="shanghai">London</Option>
<Option value="shenzhen">Sydney</Option>
</Select>
</FormItem>
<FormItem label="任务数">
<InputNumber :min="0" v-model="lookup.num" class="minwidth"></InputNumber>
</FormItem>
<FormItem label="资金指标">
<InputNumber :min="0" v-model="lookup.num" class="minwidth"></InputNumber>
</FormItem>
<FormItem label="自治区资金">
<InputNumber :min="0" v-model="lookup.num" class="minwidth"></InputNumber>
</FormItem>
<FormItem label="自治区资金">
<InputNumber :min="0" v-model="lookup.num" class="minwidth"></InputNumber>
</FormItem>
<FormItem label="市资金">
<InputNumber :min="0" v-model="lookup.num" class="minwidth"></InputNumber>
</FormItem>
<FormItem label="县资金">
<InputNumber :min="0" v-model="lookup.num" class="minwidth"></InputNumber>
</FormItem>
<FormItem label="社会基金">
<InputNumber :min="0" v-model="lookup.num" class="minwidth"></InputNumber>
</FormItem>
<FormItem label="完成时间">
<DatePicker type="date" placeholder="Select date" class="minwidth"></DatePicker>
</FormItem>
<FormItem label="备注">
<Input v-model="lookup.num" :rows="4" maxlength="500" show-word-limit type="textarea" placeholder="" class="minwidth" />
</FormItem>
</Form>
</Col>
<Col :xs="24" :md="10">
<Row type="flex" justify="center">
<Col span="12">
<div class="text-right">
公示名单
</div>
</Col>
<Col span="12">
<div class="upload know-flex know-align-center konw-center know-column ">
<p class="font-20">上传公示名单附件</p>
<Icon type="ios-cloud-upload" class="font-34" />
</div>
</Col>
</Row>
<Row type="flex" justify="center">
<Col span="12">
<div class="text-right">
计划方案
</div>
</Col>
<Col span="12">
<div class="upload know-flex know-align-center konw-center know-column" @click="uploadFun()">
<p class="font-20">上传计划方案附件</p>
<Icon type="ios-cloud-upload" class="font-34" />
<input type="file" ref="file1" style="display: none;" @change="url" id="fa" />
</div>
</Col>
</Row>
<Row type="flex" justify="center">
<Col span="12">
<div class="text-right">
财务凭证
</div>
</Col>
<Col span="12">
<div class="upload know-flex know-align-center konw-center know-column ">
<p class="font-20">上传财务凭证附件</p>
<Icon type="ios-cloud-upload" class="font-34" />
</div>
</Col>
</Row>
<Row type="flex" justify="center">
<Col span="12">
<div class="text-right">
工作通知
</div>
</Col>
<Col span="12">
<div class="upload know-flex know-align-center konw-center know-column ">
<p class="font-20">上传工作通知附件</p>
<Icon type="ios-cloud-upload" class="font-34" />
</div>
</Col>
</Row>
</Col>
<Col :xs="24" :md="24">
<div class="text-center" >
<Button type="warning" size="large" style="width: 200px;">保存</Button>
</div>
</Col>
</Row>
</Card>
</Col>
</Row>
</template>
<script>
export default {
data() {
return {
lookup: {},
pageInfo: {}, //分页信息
notice: [{
title: "行政区域 ",
key: "addres"
}, {
title: "任务数 ",
key: "taskNum"
},
{
title: "资金",
key: "introduce"
},
{
title: "年份",
key: "look"
},
{
title: "备注 ",
key: "look"
},
{
title: "选择 ",
key: "look"
},
]
}
},
methods:{
uploadFun(){
this.$refs.file1.click()
},
url(event){
console.log(event.target.files[0])
}
}
}
</script>
<style scoped="scoped">
.minwidth {
width: 200px;
}
.font-20 {
line-height: 2;
}
.card-top {
margin-top: 20px;
}
.text-right {
margin-top: 20px;
padding-right: 20px;
}
.upload {
min-width: 280px;
height: 150px;
border: 1px dashed #666666;
border-radius: 5px;
margin-top: 20px;
cursor:pointer;
}
.upload:hover {
border: 1px dashed red;
}
</style>
<template>
<Row type="flex" justify="center">
<Col :xs="24" :md="20">
<Card>
<div class="cardMargin">
<p>广西残疾人大数据</p>
<p class="font-weight-bold color-black3">包括:广西残疾人办证数据、动态更新数据、建档立卡数据、业务服务数据、区直单位服务残疾人数据</p>
</div>
<Card class="card-div">
<p slot="title" >
<span class="font-weight-bold">残疾人基础信息数据库</span>
</p>
<Row>
<Col :xs="24" :md="4">
<div class="text-center">
<img src="@/assets/money.png" class="db-img" />
<p>全区持证残疾人</p>
<h3>180080(条)</h3>
</div>
</Col>
</Row>
</Card>
<Card class="card-div">
<p slot="title" >
<span class="font-weight-bold">历年动态更新数据库</span>
</p>
<Row>
<Col :xs="24" :md="4">
<div class="text-center">
<img src="@/assets/money.png" class="db-img" />
<p>残疾人动态更新数据库2018</p>
<h3>180080(条)</h3>
</div>
</Col>
<Col :xs="24" :md="4">
<div class="text-center">
<img src="@/assets/money.png" class="db-img" />
<p>残疾人动态更新数据库2017</p>
<h3>180080(条)</h3>
</div>
</Col>
</Row>
</Card>
<Card class="card-div">
<p slot="title" >
<span class="font-weight-bold">建档立卡贫困残疾人数据库</span>
</p>
<Row>
<Col :xs="24" :md="4">
<div class="text-center">
<img src="@/assets/money.png" class="db-img" />
<p>建档立卡贫困残疾人数据库</p>
<h3>180080(条)</h3>
</div>
</Col>
</Row>
</Card>
<Card class="card-div">
<p slot="title" >
<span class="font-weight-bold">残疾人两项补贴数据库</span>
</p>
<Row>
<Col :xs="24" :md="4">
<div class="text-center">
<img src="@/assets/money.png" class="db-img" />
<p>残疾人两项补贴数据库</p>
<h3>180080(条)</h3>
</div>
</Col>
</Row>
</Card>
</Card>
</Col>
</Row>
</template>
<script>
</script>
<style >
.cardMargin{
margin: 20px 0 20px;
}
.cardMargin>p{
padding: 10px 0 10px;
}
.card-div{
margin:20px 0 0;
}
.db-img{
width:80px;
height:80px;
}
img{
width: auto;
height: auto;
max-width: 100%;
max-height: 100%;
}
</style>
export const option = {
tooltip: {
trigger: 'item',
formatter: function(vent) {
return `状态统计<br/>${vent.data.name}:${vent.data.value}(${vent.data.value}%)`
}
},
legend: {
orient: 'vertical',
top: 'center',
right: 10,
data: ['申请', '公示', '拨款', '完成']
},
grid: {
left: 'center',
top: '20',
right: '20',
bottom: '40'
},
series: [{
name: '访问来源',
type: 'pie',
radius: ['50%', '70%'],
avoidLabelOverlap: false,
label: {
normal: {
show: false,
position: 'center'
},
emphasis: {
show: true,
textStyle: {
fontSize: '30',
fontWeight: 'bold'
}
}
},
labelLine: {
normal: {
show: false
}
},
data: [{
value: 0,
name: '申请'
},
{
value: 0,
name: '公示'
},
{
value: 0,
name: '拨款'
},
{
value: 0,
name: '完成'
}
]
}]
};
export const map = {
tooltip: {
trigger: 'axis'
},
xAxis: {
type: 'category',
data: ['2018-8-8', '2018-8-8', '2018-8-8', '2018-8-8', '2018-8-8', '2018-8-8', '2018-8-8']
},
yAxis: {
type: 'value'
},
series: [{
data: [120, 200, 150, 80, 70, 110, 130],
type: 'bar'
}]
}
<template>
<Row>
<Form ref="formCustom" :model="data" :label-width="80">
<Row>
<Col span="4">
<FormItem label="项目">
<Select v-model="data.project" placeholder="请选择查看项目" class="fromItem">
<Option value="project1">项目1</Option>
<Option value="project2">项目2</Option>
</Select>
</FormItem>
</Col>
</Row>
<Row>
<Col span="4">
<FormItem label="年份">
<Select v-model="data.time" placeholder="请选择查看项目" class="fromItem">
<Option value="2019">2019</Option>
<Option value="2020">2020</Option>
<Option value="2021">2021</Option>
</Select>
</FormItem>
</Col>
<Col span="4" :xs="24" :md="4">
<FormItem label="地区" class="fromItem">
<Select v-model="data.addres" placeholder="请选择地址" class="fromItem">
<Option value="2019">2019</Option>
<Option value="2020">2020</Option>
<Option value="2021">2021</Option>
</Select>
</FormItem>
</Col>
<Col span="4">
<FormItem>
<Button type="primary">查询</Button>
</FormItem>
</Col>
</Row>
</Form>
<Row>
<Col :xs="24" :md="6" class="row-col">
<Card>
<div>
<h4>项目状态统计</h4>
<p class="pColor">本年度任务数</p>
</div>
<div>
<div class="display: flex; flex: 1;">
<div id="myChart" ref="myChart" style="width:100%;height:200px;"></div>
</div>
</div>
</Card>
</Col>
<Col :xs="24" :md="4" class="row-col">
<Card>
<div class="know-flex know-wrap konw-center know-align-center know-column mouse">
<h3 class="font-30 color-red">0</h3>
<a>申请</a>
</div>
</Card>
</Col>
<Col :xs="24" :md="4" class="row-col">
<Card>
<div class="know-flex know-wrap konw-center know-align-center know-column mouse">
<h3 class="font-30 color-red">0</h3>
<a>公示</a>
</div>
</Card>
</Col>
<Col :xs="24" :md="4" class="row-col">
<Card>
<div class="know-flex know-wrap konw-center know-align-center know-column mouse">
<h3 class="font-30 color-red">0</h3>
<a>拨款</a>
</div>
</Card>
</Col>
<Col :xs="24" :md="4" class="row-col">
<Card>
<div class="know-flex know-wrap konw-center know-align-center know-column mouse">
<h3 class="font-30 color-red">0</h3>
<a>完成</a>
</div>
</Card>
</Col>
</Row>
<Row style="margin-top: 20px;">
<Col span="24">
<Card>
<h4>每月完成任务情况</h4>
<div id="time" style="height: 300px;"></div>
</Card>
</Col>
</Row>
</Row>
</template>
<script>
import {option , map } from "./echarts.js" //饼图配置 柱形图配置
export default {
data() {
return {
data: {
project: 'project1',
time: "2019",
option: option,
map:map
}
}
},
created() {
this.option = option
},
mounted() {
setTimeout(() => {
this.drawLine()
this.time()
}, 500)
},
methods: {
drawLine() {
var echarts = require('echarts');
var myChart = echarts.init(document.getElementById('myChart'));
myChart.setOption(option);
window.addEventListener('resize', function() {
myChart.resize()
})
},
time() {
var echarts = require('echarts');
var myChart = echarts.init(document.getElementById('time'));
myChart.setOption(map)
window.addEventListener('resize', function() {
myChart.resize()
})
}
}
}
</script>
<style scoped="scoped">
.fromItem {
min-width: 200px;
}
.pColor {
color: #999999;
}
.row-col {
padding: 0 8px;
}
</style>
<template>
<Row>
<Col :xs="24" :md="13" class="row-col">
<Card>
<p slot="title">任务完成情况</p>
<div></div>
</Card>
</Col>
<Col :xs="24" :md="11" class="row-col">
<Card>
<Card>
<p slot="title">搜索条件</p>
<div>
<Form :model="formItem" :label-width="50" inline>
<FormItem label="项目">
<Select v-model="formItem.select" class="fromItem">
<Option value="beijing">New York</Option>
</Select>
</FormItem>
</Form>
<Form :model="formItem" :label-width="50" inline>
<FormItem label="年份">
<Select v-model="formItem.select" class="fromItem">
<Option value="beijing">New York</Option>
</Select>
</FormItem>
<FormItem label="地区">
<Select v-model="formItem.select" class="fromItem">
<Option value="beijing">New York</Option>
</Select>
</FormItem>
<FormItem>
<Button type="primary">查询</Button>
</FormItem>
</Form>
</div>
</Card>
<div style="margin-top:30px;">
<Table border :columns="columns1" :data="data1"></Table>
</div>
</Card>
</Col>
</Row>
</template>
<script>
import mapList from "./map.json"
export default {
data() {
return {
formItem: {
value: ''
},
data1:[],
columns1: [{
title: '地区',
key: 'name',
align: 'center',
},
{
title: '任务数',
key: 'age',
align: 'center',
},
{
title: '资金指标 ',
key: 'address',
align: 'center',
},
{
title: '使用资金数',
key: 'address',
align: 'center',
},
{
title: '完成率(%)',
key: 'address',
align: 'center',
},
{
title: '统计情况',
key: 'address',
align: 'center',
}
],
}
},
methods: {
// https://geo.datav.aliyun.com/areas/bound/450000_full.json
}
}
</script>
<style scoped>
.fromItem {
min-width: 200px;
}
</style>
This source diff could not be displayed because it is too large. You can view the blob instead.
<template>
<Row type="flex" justify="center">
<Col :xs="24" :md="16">
<Card>
<h2 slot="title">广西全区持证残疾人统计数据(每1个小时更新一次)</h2>
<Table border :columns="listColumns" :data="list">
<header>数据统计</header>
</Table>
</Card>
</Col>
</Row>
</template>
<script>
export default {
data() {
return {
listColumns: [{
title: '残疾类型',
key: 'type',
align: 'center'
}, {
title: '总人数',
key: 'num',
sortable: true,
align: 'center'
}, {
title: '6-16岁学龄儿童人数',
key: 'nums',
sortable: true,
align: 'center'
}],
list: [{
type: 'John Brown',
num: 17,
nums: 3088
},
{
type: 'John Brown',
num: 16,
nums: 3088
},
{
type: 'John Brown',
num: 15,
nums: 3088
},
{
type: 'John Brown',
num: 14,
nums: 3088
},
{
type: 'John Brown',
num: 13,
nums: 3088
},
{
type: 'John Brown',
num: 12,
nums: 3088
},
]
}
},
methods: {
}
}
</script>
<style scoped="scoped">
.card-div {
padding: 0 300px;
}
</style>
<template>
<Row type="flex" justify="center">
<Col :xs="24" :md="20">
<div class="text-center">
<h1>广西残疾人小康进程实现程度数据</h1>
</div>
<Table border :columns="listColumns" :data="list">
<header>数据统计</header>
</Table>
</Col>
</Row>
</template>
<script>
export default {
data() {
return {
listColumns: [{
title: '序号',
key: 'index',
align: 'center'
}, {
title: '主要指标 ',
key: 'num',
sortable: true,
align: 'center'
}, {
title: '目标值 ',
key: 'nums',
sortable: true,
align: 'center',
width:100,
minWidth:100
},
{
title: '完成数',
key: 'nums',
sortable: true,
align: 'center',
width:100,
minWidth:100
},
{
title: '任务数 ',
key: 'nums',
sortable: true,
align: 'center',
width:100,
minWidth:100
},
{
title: '完成率',
key: 'nums',
sortable: true,
width:100,
minWidth:100
},
{
title: '完成数(含来源、时间、范围)',
key: 'nums',
align: 'center',
width:280
},
{
title: '任务数(含来源、时间、范围)',
key: 'nums',
align: 'center',
width:280
}],
}
},
methods: {
}
}
</script>
<style>
.text-center{
margin: 30px 0 50px ;
}
</style>
......@@ -4,57 +4,87 @@
<h1>后台管理系统</h1>
<Form :model="formItem" style="margin-top:10px;" :rules="ruleValidate" ref="formItem">
<FormItem prop="number">
<Input v-model="formItem.number" placeholder="请输入账号" size="large"></Input>
<Input v-model="formItem.number" placeholder="请输入账号" size="large">
<Icon type="md-person" slot="prepend"/>
</Input>
</FormItem>
<FormItem prop="password">
<Input v-model="formItem.password" type="password" password placeholder="请输入密码" size="large"></Input>
<Input v-model="formItem.password" type="password" password placeholder="请输入密码" size="large">
<Icon type="md-lock" slot="prepend" />
</Input>
</FormItem>
<FormItem prop="code">
<Row>
<Col span="12">
<Input v-model="formItem.code" type="text" placeholder="请输入验证码" size="large">
<Icon type="md-unlock" slot="prepend"/>
</Input>
</Col>
<Col span="12">
<div @click="imgSet" style="height:38px;">
<img :src="url" />
</div>
</Col>
</Row>
</FormItem>
<FormItem>
<Button type="primary" long size="large" @click="login('formItem')">登录</Button>
<div class="marginTop">
<Button type="primary" long size="large" @click="login('formItem')">登录</Button>
</div>
</FormItem>
</Form>
</Card>
</Row>
</template>
<script>
import { login } from "@/commons/api/login.js"
<script>
import { login,getCoedeImg } from "@/commons/api/login.js"
export default {
data() {
return {
test: "我是登录页",
url:"http://auth.project.gxdpf.org.cn/getImage",
formItem: {
user:'',
password:''
password:'',
code:''
} ,//form表单
//验证数据
ruleValidate:{
number:[{ required: true, message: '请输入账号', trigger: 'blur' }],
password:[{ required: true, message: '请输入密码', trigger: 'blur' }]
password:[{ required: true, message: '请输入密码', trigger: 'blur' }],
code:[{ required: true, message: '请输入验证码', trigger: 'blur' }]
}
}
},
created() {
this.imgSet()
},
methods: {
login(name){
// login(this.formItem).then(res=>{
// localStorage.setItem('token','15154848df4s8f4s84sd84s')
// this.$router.push({path:'/user/list'})
// }).catch(err=>{
// })
//获取图片
imgSet(){
this.url = `http://192.168.3.116:9999/getImage?time=${new Date().getTime()}`
},
getCoedeImgFun(){
getCoedeImg().then(res=>{
console.log(res)
})
},
login(name){
this.$refs[name].validate((valid) => {
if (valid) {
this.$Message.success('Success!');
localStorage.setItem('token','15154848df4s8f4s84sd84s')
this.$router.push({path:'/user/list'})
this.$router.push({path:'/admin/administrators/subsystem'})
// let arr = ['admin-administrators-subsystem','admin-administrators-adminList','admin-administrators-dictionary',]
// let nArr = JSON.stringify(arr)
// localStorage.setItem('power',nArr)
} else {
this.$Message.error('请输入账号和密码');
}
})
}
}
}
......@@ -65,9 +95,11 @@
padding: 25px 50px 30px 50px;
width: 500px;
}
.marginTop{
margin-top:20px;
}
.bgRow{
background-color: #20222A;
}
</style>
......@@ -36,11 +36,17 @@
</Card>
<!-- 列表 -->
<Table border :columns="columns" :data="list" class="tab"></Table>
<Table border height="619" :columns="columns" :data="list" class="tab"></Table>
<!-- 分页插件 -->
<Row class="pageClass">
<Page :total="pageInfo.total" :page-size="pageInfo.size" @on-change="pageFun" :current="pageInfo.page" @on-page-size-change="sizeNumFun"
show-total show-elevator show-sizer style="background-color: #FFFFFF;" />
<Page
:total="pageInfo.total"
:page-size="pageInfo.size"
@on-change="pageFun"
:current="pageInfo.page" @on-page-size-change="sizeNumFun"
show-total show-elevator
show-sizer
style="background-color: #FFFFFF;" />
</Row>
......@@ -152,9 +158,10 @@
background-color: #FFFFFF;
padding: 16px 16px;
width: 100%;
position: fixed;
position: absolute;
bottom: 0;
background-color: #FFFFFF;
z-index: 999;
}
.ivuFormItem{
margin-bottom: 0;
......
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