mirror of
https://github.com/PanJiaChen/vue-element-admin.git
synced 2025-08-10 20:39:48 +08:00
新增隐患排查治理和系统同全局样式修改
This commit is contained in:
dengfuchuan
parent
194d718c19
commit
c37041c1c7
@ -18,7 +18,8 @@ export function getInfo(token) {
|
||||
|
||||
export function logout() {
|
||||
return request({
|
||||
url: '/vue-element-admin/user/logout',
|
||||
method: 'post'
|
||||
})
|
||||
url: '/commonAction.do',
|
||||
method: 'post',
|
||||
data: 'funid=login&pagetype=login&eventcode=logout&user_id=administrator&dataType=json'
|
||||
}).then(response => response.data)
|
||||
}
|
||||
|
||||
@ -33,12 +33,12 @@ export default {
|
||||
methods: {
|
||||
getBreadcrumb() {
|
||||
// only show routes with meta.title
|
||||
let matched = this.$route.matched.filter(item => item.meta && item.meta.title)
|
||||
const first = matched[0]
|
||||
const matched = this.$route.matched.filter(item => item.meta && item.meta.title)
|
||||
// const first = matched[0]
|
||||
|
||||
if (!this.isDashboard(first)) {
|
||||
matched = [{ path: '/', meta: { title: '安全生产' }}].concat(matched)
|
||||
}
|
||||
// if (!this.isDashboard(first)) {
|
||||
// matched = [{ path: '/', meta: { title: '安全生产' }}].concat(matched)
|
||||
// }
|
||||
|
||||
this.levelList = matched.filter(item => item.meta && item.meta.title && item.meta.breadcrumb !== false)
|
||||
},
|
||||
|
||||
@ -17,8 +17,8 @@ export default {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
data: []
|
||||
|
||||
data: [],
|
||||
loading: false
|
||||
}
|
||||
},
|
||||
created() {
|
||||
@ -26,9 +26,11 @@ export default {
|
||||
},
|
||||
methods: {
|
||||
getButtons() {
|
||||
this.loading = true
|
||||
api.getButtons(this.funid).then(data => {
|
||||
if (data.success) {
|
||||
this.data = data.data.buttons
|
||||
this.loading = false
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
|
||||
@ -125,10 +125,10 @@ export default {
|
||||
}
|
||||
|
||||
.handle-button {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
width: 38px;
|
||||
height: 38px;
|
||||
position: absolute;
|
||||
left: -48px;
|
||||
left: -38px;
|
||||
text-align: center;
|
||||
font-size: 24px;
|
||||
border-radius: 6px 0 0 6px !important;
|
||||
@ -136,10 +136,10 @@ export default {
|
||||
pointer-events: auto;
|
||||
cursor: pointer;
|
||||
color: #fff;
|
||||
line-height: 48px;
|
||||
line-height: 38px;
|
||||
i {
|
||||
font-size: 24px;
|
||||
line-height: 48px;
|
||||
line-height: 38px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -58,6 +58,12 @@
|
||||
import api from './api'
|
||||
export default {
|
||||
name: 'SelDept',
|
||||
props: {
|
||||
selective: {
|
||||
type: String,
|
||||
default: null
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
@ -116,7 +122,8 @@ export default {
|
||||
},
|
||||
treeList: [],
|
||||
whereSql: false,
|
||||
whereValue: ''
|
||||
whereValue: '',
|
||||
Dpets: ''
|
||||
}
|
||||
},
|
||||
created() {
|
||||
@ -318,8 +325,12 @@ export default {
|
||||
this.pager.pageNo = page
|
||||
this.getList()
|
||||
},
|
||||
handleSelectionChange(val) {
|
||||
this.$emit('updateDepts', val)
|
||||
handleSelectionChange(row) {
|
||||
if (this.selective) {
|
||||
this.$emit('updateDepts', row)
|
||||
} else {
|
||||
this.Dpets = row
|
||||
}
|
||||
},
|
||||
closeDialog() {
|
||||
this.dialogFormVisible = false
|
||||
|
||||
@ -24,20 +24,8 @@
|
||||
<i class="el-icon-caret-bottom" />
|
||||
</div>
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<router-link to="/profile/index">
|
||||
<el-dropdown-item>Profile</el-dropdown-item>
|
||||
</router-link>
|
||||
<router-link to="/">
|
||||
<el-dropdown-item>Dashboard</el-dropdown-item>
|
||||
</router-link>
|
||||
<a target="_blank" href="https://github.com/PanJiaChen/vue-element-admin/">
|
||||
<el-dropdown-item>Github</el-dropdown-item>
|
||||
</a>
|
||||
<a target="_blank" href="https://panjiachen.github.io/vue-element-admin-site/#/">
|
||||
<el-dropdown-item>Docs</el-dropdown-item>
|
||||
</a>
|
||||
<el-dropdown-item divided @click.native="logout">
|
||||
<span style="display:block;">Log Out</span>
|
||||
<el-dropdown-item @click.native="logout">
|
||||
<span style="display:block;">退出登录</span>
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
@ -53,6 +41,7 @@ import ErrorLog from '@/components/ErrorLog'
|
||||
import Screenfull from '@/components/Screenfull'
|
||||
// import SizeSelect from '@/components/SizeSelect'
|
||||
import Search from '@/components/HeaderSearch'
|
||||
import { logout } from '@/api/user'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
@ -75,8 +64,15 @@ export default {
|
||||
this.$store.dispatch('app/toggleSideBar')
|
||||
},
|
||||
async logout() {
|
||||
await this.$store.dispatch('user/logout')
|
||||
this.$router.push(`/login?redirect=${this.$route.fullPath}`)
|
||||
logout().then(data => {
|
||||
if (data.success) {
|
||||
this.$store.dispatch('user/logout')
|
||||
this.$router.push(`/login?redirect=${this.$route.fullPath}`)
|
||||
this.$message.success('已退出登录！')
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,25 +1,25 @@
|
||||
<template>
|
||||
<div class="drawer-container">
|
||||
<div>
|
||||
<h3 class="drawer-title">Page style setting</h3>
|
||||
<h3 class="drawer-title">页面风格设置</h3>
|
||||
|
||||
<div class="drawer-item">
|
||||
<span>Theme Color</span>
|
||||
<span>主题颜色</span>
|
||||
<theme-picker style="float: right;height: 26px;margin: -3px 8px 0 0;" @change="themeChange" />
|
||||
</div>
|
||||
|
||||
<div class="drawer-item">
|
||||
<span>Open Tags-View</span>
|
||||
<span>打开页面标签</span>
|
||||
<el-switch v-model="tagsView" class="drawer-switch" />
|
||||
</div>
|
||||
|
||||
<div class="drawer-item">
|
||||
<!-- <div class="drawer-item">
|
||||
<span>Fixed Header</span>
|
||||
<el-switch v-model="fixedHeader" class="drawer-switch" />
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
<div class="drawer-item">
|
||||
<span>Sidebar Logo</span>
|
||||
<span>侧边栏的 LOGO</span>
|
||||
<el-switch v-model="sidebarLogo" class="drawer-switch" />
|
||||
</div>
|
||||
|
||||
|
||||
@ -7,10 +7,6 @@ Vue.use(Router)
|
||||
import Layout from '@/layout'
|
||||
|
||||
/* Router Modules */
|
||||
import componentsRouter from './modules/components'
|
||||
import chartsRouter from './modules/charts'
|
||||
import tableRouter from './modules/table'
|
||||
import nestedRouter from './modules/nested'
|
||||
|
||||
/**
|
||||
* Note: sub-menu only appear when route children.length >= 1
|
||||
@ -136,17 +132,59 @@ export const constantRoutes = [
|
||||
name: '隐患排查',
|
||||
meta: { title: '隐患排查', icon: 'form', noCache: true }
|
||||
},
|
||||
{
|
||||
path: 'hidden_check/create',
|
||||
component: () => import('@/views/hidden_check/components/create/index'),
|
||||
name: 'create',
|
||||
hidden: true,
|
||||
meta: { title: '隐患排查新增', icon: 'list', noCache: true }
|
||||
},
|
||||
{
|
||||
path: 'hidden_check/audit/:id',
|
||||
component: () => import('@/views/hidden_check/components/edit_form/index'),
|
||||
name: 'audit',
|
||||
hidden: true,
|
||||
meta: { title: '隐患排查编辑', icon: 'list', noCache: true }
|
||||
},
|
||||
{
|
||||
path: 'hidden_reform',
|
||||
component: () => import('@/views/hidden_reform/index'),
|
||||
name: '隐患整改',
|
||||
meta: { title: '隐患整改', icon: 'el-icon-s-management', noCache: true }
|
||||
},
|
||||
{
|
||||
path: 'hidden_reform/create',
|
||||
component: () => import('@/views/hidden_reform/components/create/index'),
|
||||
name: 'create',
|
||||
hidden: true,
|
||||
meta: { title: '隐患整改新增', icon: 'list', noCache: true }
|
||||
},
|
||||
{
|
||||
path: 'hidden_reform/audit/:id',
|
||||
component: () => import('@/views/hidden_reform/components/edit_form/index'),
|
||||
name: 'audit',
|
||||
hidden: true,
|
||||
meta: { title: '隐患整改编辑', icon: 'list', noCache: true }
|
||||
},
|
||||
{
|
||||
path: 'hidden_review',
|
||||
component: () => import('@/views/hidden_review/index'),
|
||||
name: '隐患验收',
|
||||
meta: { title: '隐患验收', icon: 'el-icon-s-opportunity', noCache: true }
|
||||
},
|
||||
{
|
||||
path: 'hidden_review/create',
|
||||
component: () => import('@/views/hidden_review/components/create/index'),
|
||||
name: 'create',
|
||||
hidden: true,
|
||||
meta: { title: '隐患验收新增', icon: 'list', noCache: true }
|
||||
},
|
||||
{
|
||||
path: 'hidden_review/audit/:id',
|
||||
component: () => import('@/views/hidden_review/components/edit_form/index'),
|
||||
name: 'audit',
|
||||
hidden: true,
|
||||
meta: { title: '隐患验收编辑', icon: 'list', noCache: true }
|
||||
}
|
||||
]
|
||||
},
|
||||
@ -172,7 +210,7 @@ export const constantRoutes = [
|
||||
path: 'index',
|
||||
component: () => import('@/views/sys_user/index'),
|
||||
name: '用户管理',
|
||||
meta: { title: '用户管理', icon: 'guide', noCache: true }
|
||||
meta: { title: '用户管理', icon: 'el-icon-user-solid', noCache: true }
|
||||
}
|
||||
]
|
||||
}
|
||||
@ -183,260 +221,6 @@ export const constantRoutes = [
|
||||
* the routes that need to be dynamically loaded based on user roles
|
||||
*/
|
||||
export const asyncRoutes = [
|
||||
{
|
||||
path: '/permission',
|
||||
component: Layout,
|
||||
redirect: '/permission/page',
|
||||
alwaysShow: true, // will always show the root menu
|
||||
name: 'Permission',
|
||||
meta: {
|
||||
title: 'Permission',
|
||||
icon: 'lock',
|
||||
roles: ['admin', 'editor'] // you can set roles in root nav
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'page',
|
||||
component: () => import('@/views/permission/page'),
|
||||
name: 'PagePermission',
|
||||
meta: {
|
||||
title: 'Page Permission',
|
||||
roles: ['admin'] // or you can only set roles in sub nav
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'directive',
|
||||
component: () => import('@/views/permission/directive'),
|
||||
name: 'DirectivePermission',
|
||||
meta: {
|
||||
title: 'Directive Permission'
|
||||
// if do not set roles, means: this page does not require permission
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'role',
|
||||
component: () => import('@/views/permission/role'),
|
||||
name: 'RolePermission',
|
||||
meta: {
|
||||
title: 'Role Permission',
|
||||
roles: ['admin']
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
{
|
||||
path: '/icon',
|
||||
component: Layout,
|
||||
children: [
|
||||
{
|
||||
path: 'index',
|
||||
component: () => import('@/views/icons/index'),
|
||||
name: 'Icons',
|
||||
meta: { title: 'Icons', icon: 'icon', noCache: true }
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
/** when your routing map is too long, you can split it into small modules **/
|
||||
componentsRouter,
|
||||
chartsRouter,
|
||||
nestedRouter,
|
||||
tableRouter,
|
||||
|
||||
{
|
||||
path: '/example',
|
||||
component: Layout,
|
||||
redirect: '/example/list',
|
||||
name: 'Example',
|
||||
meta: {
|
||||
title: 'Example',
|
||||
icon: 'el-icon-s-help'
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'create',
|
||||
component: () => import('@/views/example/create'),
|
||||
name: 'CreateArticle',
|
||||
meta: { title: 'Create Article', icon: 'edit' }
|
||||
},
|
||||
{
|
||||
path: 'edit/:id(\\d+)',
|
||||
component: () => import('@/views/example/edit'),
|
||||
name: 'EditArticle',
|
||||
meta: { title: 'Edit Article', noCache: true, activeMenu: '/example/list' },
|
||||
hidden: true
|
||||
},
|
||||
{
|
||||
path: 'list',
|
||||
component: () => import('@/views/example/list'),
|
||||
name: 'ArticleList',
|
||||
meta: { title: 'Article List', icon: 'v' }
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
{
|
||||
path: '/tab',
|
||||
component: Layout,
|
||||
children: [
|
||||
{
|
||||
path: 'index',
|
||||
component: () => import('@/views/tab/index'),
|
||||
name: 'Tab',
|
||||
meta: { title: 'Tab', icon: 'tab' }
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
{
|
||||
path: '/error',
|
||||
component: Layout,
|
||||
redirect: 'noRedirect',
|
||||
name: 'ErrorPages',
|
||||
meta: {
|
||||
title: 'Error Pages',
|
||||
icon: '404'
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: '401',
|
||||
component: () => import('@/views/error-page/401'),
|
||||
name: 'Page401',
|
||||
meta: { title: '401', noCache: true }
|
||||
},
|
||||
{
|
||||
path: '404',
|
||||
component: () => import('@/views/error-page/404'),
|
||||
name: 'Page404',
|
||||
meta: { title: '404', noCache: true }
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
{
|
||||
path: '/error-log',
|
||||
component: Layout,
|
||||
children: [
|
||||
{
|
||||
path: 'log',
|
||||
component: () => import('@/views/error-log/index'),
|
||||
name: 'ErrorLog',
|
||||
meta: { title: 'Error Log', icon: 'bug' }
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
{
|
||||
path: '/excel',
|
||||
component: Layout,
|
||||
redirect: '/excel/export-excel',
|
||||
name: 'Excel',
|
||||
meta: {
|
||||
title: 'Excel',
|
||||
icon: 'excel'
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'export-excel',
|
||||
component: () => import('@/views/excel/export-excel'),
|
||||
name: 'ExportExcel',
|
||||
meta: { title: 'Export Excel' }
|
||||
},
|
||||
{
|
||||
path: 'export-selected-excel',
|
||||
component: () => import('@/views/excel/select-excel'),
|
||||
name: 'SelectExcel',
|
||||
meta: { title: 'Export Selected' }
|
||||
},
|
||||
{
|
||||
path: 'export-merge-header',
|
||||
component: () => import('@/views/excel/merge-header'),
|
||||
name: 'MergeHeader',
|
||||
meta: { title: 'Merge Header' }
|
||||
},
|
||||
{
|
||||
path: 'upload-excel',
|
||||
component: () => import('@/views/excel/upload-excel'),
|
||||
name: 'UploadExcel',
|
||||
meta: { title: 'Upload Excel' }
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
{
|
||||
path: '/zip',
|
||||
component: Layout,
|
||||
redirect: '/zip/download',
|
||||
alwaysShow: true,
|
||||
name: 'Zip',
|
||||
meta: { title: 'Zip', icon: 'zip' },
|
||||
children: [
|
||||
{
|
||||
path: 'download',
|
||||
component: () => import('@/views/zip/index'),
|
||||
name: 'ExportZip',
|
||||
meta: { title: 'Export Zip' }
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
{
|
||||
path: '/pdf',
|
||||
component: Layout,
|
||||
redirect: '/pdf/index',
|
||||
children: [
|
||||
{
|
||||
path: 'index',
|
||||
component: () => import('@/views/pdf/index'),
|
||||
name: 'PDF',
|
||||
meta: { title: 'PDF', icon: 'pdf' }
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: '/pdf/download',
|
||||
component: () => import('@/views/pdf/download'),
|
||||
hidden: true
|
||||
},
|
||||
|
||||
{
|
||||
path: '/theme',
|
||||
component: Layout,
|
||||
children: [
|
||||
{
|
||||
path: 'index',
|
||||
component: () => import('@/views/theme/index'),
|
||||
name: 'Theme',
|
||||
meta: { title: 'Theme', icon: 'theme' }
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
{
|
||||
path: '/clipboard',
|
||||
component: Layout,
|
||||
children: [
|
||||
{
|
||||
path: 'index',
|
||||
component: () => import('@/views/clipboard/index'),
|
||||
name: 'ClipboardDemo',
|
||||
meta: { title: 'Clipboard', icon: 'clipboard' }
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
{
|
||||
path: 'external-link',
|
||||
component: Layout,
|
||||
children: [
|
||||
{
|
||||
path: 'https://github.com/PanJiaChen/vue-element-admin',
|
||||
meta: { title: 'External Link', icon: 'link' }
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
// 404 page must be placed at the end !!!
|
||||
{ path: '*', redirect: '/404', hidden: true }
|
||||
]
|
||||
|
||||
@ -69,7 +69,7 @@
|
||||
// dropdown
|
||||
.el-dropdown-menu {
|
||||
a {
|
||||
display: block
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
@ -82,3 +82,56 @@
|
||||
.el-range-separator {
|
||||
box-sizing: content-box;
|
||||
}
|
||||
// table 样式
|
||||
.el-table__row {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.el-table__header {
|
||||
font-size: 12px;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.el-table th,
|
||||
.el-table td {
|
||||
color: #000;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
// 解决表头和表体对不齐
|
||||
.el-table th.gutter {
|
||||
display: table-cell !important;
|
||||
}
|
||||
|
||||
// .el-checkbox__input.is-checked .el-checkbox__inner {
|
||||
// background-color: #42b983;
|
||||
// border-color: #42b983;
|
||||
// }
|
||||
// .el-checkbox__input.is-checked .el-checkbox__inner {
|
||||
// background-color: #42b983;
|
||||
// border-color: #42b983;
|
||||
// }
|
||||
// .el-checkbox__input.is-indeterminate .el-checkbox__inner {
|
||||
// background-color: #42b983;
|
||||
// border-color: #42b983;
|
||||
// }
|
||||
|
||||
// .el-checkbox__input.is-focus .el-checkbox__inner {
|
||||
// border-color: #42b983;
|
||||
// }
|
||||
|
||||
// button样式
|
||||
.el-button--primary {
|
||||
text-align: center;
|
||||
line-height: 25px;
|
||||
padding: 0px 10px;
|
||||
}
|
||||
//设置图标按钮宽度
|
||||
.el-button--text {
|
||||
width: 20px;
|
||||
}
|
||||
// 自定义button
|
||||
.button {
|
||||
color: #000;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
@ -1,16 +1,17 @@
|
||||
@import './variables.scss';
|
||||
@import './mixin.scss';
|
||||
@import './transition.scss';
|
||||
@import './element-ui.scss';
|
||||
@import './sidebar.scss';
|
||||
@import './btn.scss';
|
||||
@import "./variables.scss";
|
||||
@import "./mixin.scss";
|
||||
@import "./transition.scss";
|
||||
@import "./element-ui.scss";
|
||||
@import "./sidebar.scss";
|
||||
@import "./btn.scss";
|
||||
|
||||
body {
|
||||
height: 100%;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
text-rendering: optimizeLegibility;
|
||||
font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
|
||||
font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB,
|
||||
Microsoft YaHei, Arial, sans-serif;
|
||||
}
|
||||
|
||||
label {
|
||||
@ -104,7 +105,8 @@ aside {
|
||||
display: block;
|
||||
line-height: 32px;
|
||||
font-size: 16px;
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen,
|
||||
Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
|
||||
color: #2c3e50;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
@ -134,7 +136,7 @@ aside {
|
||||
}
|
||||
|
||||
.text-center {
|
||||
text-align: center
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.sub-navbar {
|
||||
@ -145,7 +147,13 @@ aside {
|
||||
text-align: right;
|
||||
padding-right: 20px;
|
||||
transition: 600ms ease position;
|
||||
background: linear-gradient(90deg, rgba(32, 182, 249, 1) 0%, rgba(32, 182, 249, 1) 0%, rgba(33, 120, 241, 1) 100%, rgba(33, 120, 241, 1) 100%);
|
||||
background: linear-gradient(
|
||||
90deg,
|
||||
rgba(32, 182, 249, 1) 0%,
|
||||
rgba(32, 182, 249, 1) 0%,
|
||||
rgba(33, 120, 241, 1) 100%,
|
||||
rgba(33, 120, 241, 1) 100%
|
||||
);
|
||||
|
||||
.subtitle {
|
||||
font-size: 20px;
|
||||
|
||||
@ -51,6 +51,49 @@ export function parseTime(time, cFormat) {
|
||||
return time_str
|
||||
}
|
||||
|
||||
export function parseDay(time, cFormat) {
|
||||
if (arguments.length === 0 || !time) {
|
||||
return null
|
||||
}
|
||||
const format = cFormat || '{y}-{m}-{d}'
|
||||
let date
|
||||
if (typeof time === 'object') {
|
||||
date = time
|
||||
} else {
|
||||
if ((typeof time === 'string')) {
|
||||
if ((/^[0-9]+$/.test(time))) {
|
||||
// support "1548221490638"
|
||||
time = parseInt(time)
|
||||
} else {
|
||||
// support safari
|
||||
// https://stackoverflow.com/questions/4310953/invalid-date-in-safari
|
||||
time = time.replace(new RegExp(/-/gm), '/')
|
||||
}
|
||||
}
|
||||
|
||||
if ((typeof time === 'number') && (time.toString().length === 10)) {
|
||||
time = time * 1000
|
||||
}
|
||||
date = new Date(time)
|
||||
}
|
||||
const formatObj = {
|
||||
y: date.getFullYear(),
|
||||
m: date.getMonth() + 2,
|
||||
d: date.getDate(),
|
||||
h: date.getHours(),
|
||||
i: date.getMinutes(),
|
||||
s: date.getSeconds(),
|
||||
a: date.getDay()
|
||||
}
|
||||
const time_str = format.replace(/{([ymdhisa])+}/g, (result, key) => {
|
||||
const value = formatObj[key]
|
||||
// Note: getDay() returns 0 on Sunday
|
||||
if (key === 'a') { return ['日', '一', '二', '三', '四', '五', '六'][value ] }
|
||||
return value.toString().padStart(2, '0')
|
||||
})
|
||||
return time_str
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {number} time
|
||||
* @param {string} option
|
||||
|
||||
@ -1,23 +0,0 @@
|
||||
<template>
|
||||
<div class="chart-container">
|
||||
<chart height="100%" width="100%" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Chart from '@/components/Charts/Keyboard'
|
||||
|
||||
export default {
|
||||
name: 'KeyboardChart',
|
||||
components: { Chart }
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.chart-container{
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: calc(100vh - 84px);
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,23 +0,0 @@
|
||||
<template>
|
||||
<div class="chart-container">
|
||||
<chart height="100%" width="100%" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Chart from '@/components/Charts/LineMarker'
|
||||
|
||||
export default {
|
||||
name: 'LineChart',
|
||||
components: { Chart }
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.chart-container{
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: calc(100vh - 84px);
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,23 +0,0 @@
|
||||
<template>
|
||||
<div class="chart-container">
|
||||
<chart height="100%" width="100%" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Chart from '@/components/Charts/MixChart'
|
||||
|
||||
export default {
|
||||
name: 'MixChart',
|
||||
components: { Chart }
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.chart-container{
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: calc(100vh - 84px);
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,49 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-tabs v-model="activeName">
|
||||
<el-tab-pane label="use clipboard directly" name="directly">
|
||||
<el-input v-model="inputData" placeholder="Please input" style="width:400px;max-width:100%;" />
|
||||
<el-button type="primary" icon="el-icon-document" @click="handleCopy(inputData,$event)">
|
||||
copy
|
||||
</el-button>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="use clipboard by v-directive" name="v-directive">
|
||||
<el-input v-model="inputData" placeholder="Please input" style="width:400px;max-width:100%;" />
|
||||
<el-button v-clipboard:copy="inputData" v-clipboard:success="clipboardSuccess" type="primary" icon="el-icon-document">
|
||||
copy
|
||||
</el-button>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import clip from '@/utils/clipboard' // use clipboard directly
|
||||
import clipboard from '@/directive/clipboard/index.js' // use clipboard by v-directive
|
||||
|
||||
export default {
|
||||
name: 'ClipboardDemo',
|
||||
directives: {
|
||||
clipboard
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
activeName: 'directly',
|
||||
inputData: 'https://github.com/PanJiaChen/vue-element-admin'
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleCopy(text, event) {
|
||||
clip(text, event)
|
||||
},
|
||||
clipboardSuccess() {
|
||||
this.$message({
|
||||
message: 'Copy successfully',
|
||||
type: 'success',
|
||||
duration: 1500
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -1,61 +0,0 @@
|
||||
<template>
|
||||
<div class="components-container">
|
||||
<aside>This is based on
|
||||
<a class="link-type" href="//github.com/dai-siki/vue-image-crop-upload"> vue-image-crop-upload</a>.
|
||||
Since I was using only the vue@1 version, and it is not compatible with mockjs at the moment, I modified it myself, and if you are going to use it, it is better to use official version.
|
||||
</aside>
|
||||
|
||||
<pan-thumb :image="image" />
|
||||
|
||||
<el-button type="primary" icon="el-icon-upload" style="position: absolute;bottom: 15px;margin-left: 40px;" @click="imagecropperShow=true">
|
||||
Change Avatar
|
||||
</el-button>
|
||||
|
||||
<image-cropper
|
||||
v-show="imagecropperShow"
|
||||
:key="imagecropperKey"
|
||||
:width="300"
|
||||
:height="300"
|
||||
url="https://httpbin.org/post"
|
||||
lang-type="en"
|
||||
@close="close"
|
||||
@crop-upload-success="cropSuccess"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ImageCropper from '@/components/ImageCropper'
|
||||
import PanThumb from '@/components/PanThumb'
|
||||
|
||||
export default {
|
||||
name: 'AvatarUploadDemo',
|
||||
components: { ImageCropper, PanThumb },
|
||||
data() {
|
||||
return {
|
||||
imagecropperShow: false,
|
||||
imagecropperKey: 0,
|
||||
image: 'https://wpimg.wallstcn.com/577965b9-bb9e-4e02-9f0c-095b41417191'
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
cropSuccess(resData) {
|
||||
this.imagecropperShow = false
|
||||
this.imagecropperKey = this.imagecropperKey + 1
|
||||
this.image = resData.files.avatar
|
||||
},
|
||||
close() {
|
||||
this.imagecropperShow = false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.avatar{
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,154 +0,0 @@
|
||||
<template>
|
||||
<div class="components-container">
|
||||
<aside>
|
||||
When the page is scrolled to the specified position, the Back to Top button appears in the lower right corner
|
||||
</aside>
|
||||
<aside>
|
||||
You can customize the style of the button, show / hide, height of appearance, height of the return. If you need a text prompt, you can use element-ui el-tooltip elements externally
|
||||
</aside>
|
||||
<div class="placeholder-container">
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
</div>
|
||||
<!-- you can add element-ui's tooltip -->
|
||||
<el-tooltip placement="top" content="tooltip">
|
||||
<back-to-top :custom-style="myBackToTopStyle" :visibility-height="300" :back-position="50" transition-name="fade" />
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import BackToTop from '@/components/BackToTop'
|
||||
|
||||
export default {
|
||||
name: 'BackToTopDemo',
|
||||
components: { BackToTop },
|
||||
data() {
|
||||
return {
|
||||
// customizable button style, show/hide critical point, return position
|
||||
myBackToTopStyle: {
|
||||
right: '50px',
|
||||
bottom: '50px',
|
||||
width: '40px',
|
||||
height: '40px',
|
||||
'border-radius': '4px',
|
||||
'line-height': '45px', // 请保持与高度一致以垂直居中 Please keep consistent with height to center vertically
|
||||
background: '#e7eaf1'// 按钮的背景颜色 The background color of the button
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.placeholder-container div {
|
||||
margin: 10px;
|
||||
}
|
||||
</style>
|
||||
@ -1,218 +0,0 @@
|
||||
<template>
|
||||
<div class="components-container">
|
||||
<aside>
|
||||
<a href="https://github.com/PanJiaChen/vue-countTo" target="_blank">countTo-component</a>
|
||||
</aside>
|
||||
<count-to
|
||||
ref="example"
|
||||
:start-val="_startVal"
|
||||
:end-val="_endVal"
|
||||
:duration="_duration"
|
||||
:decimals="_decimals"
|
||||
:separator="_separator"
|
||||
:prefix="_prefix"
|
||||
:suffix="_suffix"
|
||||
:autoplay="false"
|
||||
class="example"
|
||||
/>
|
||||
<div style="margin-left: 25%;margin-top: 40px;">
|
||||
<label class="label" for="startValInput">startVal:
|
||||
<input v-model.number="setStartVal" type="number" name="startValInput">
|
||||
</label>
|
||||
<label class="label" for="endValInput">endVal:
|
||||
<input v-model.number="setEndVal" type="number" name="endVaInput">
|
||||
</label>
|
||||
<label class="label" for="durationInput">duration:
|
||||
<input v-model.number="setDuration" type="number" name="durationInput">
|
||||
</label>
|
||||
<div class="startBtn example-btn" @click="start">
|
||||
Start
|
||||
</div>
|
||||
<div class="pause-resume-btn example-btn" @click="pauseResume">
|
||||
pause/resume
|
||||
</div>
|
||||
<br>
|
||||
<label class="label" for="decimalsInput">decimals:
|
||||
<input v-model.number="setDecimals" type="number" name="decimalsInput">
|
||||
</label>
|
||||
<label class="label" for="separatorInput">separator:
|
||||
<input v-model="setSeparator" name="separatorInput">
|
||||
</label>
|
||||
<label class="label" for="prefixInput">prefix:
|
||||
<input v-model="setPrefix" name="prefixInput">
|
||||
</label>
|
||||
<label class="label" for="suffixInput">suffix:
|
||||
<input v-model="setSuffix" name="suffixInput">
|
||||
</label>
|
||||
</div>
|
||||
<aside><count-to :start-val='{{ _startVal }}' :end-val='{{ _endVal }}' :duration='{{ _duration }}'
|
||||
:decimals='{{ _decimals }}' :separator='{{ _separator }}' :prefix='{{ _prefix }}' :suffix='{{ _suffix }}'
|
||||
:autoplay=false></aside>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import countTo from 'vue-count-to'
|
||||
|
||||
export default {
|
||||
name: 'CountToDemo',
|
||||
components: { countTo },
|
||||
data() {
|
||||
return {
|
||||
setStartVal: 0,
|
||||
setEndVal: 2017,
|
||||
setDuration: 4000,
|
||||
setDecimals: 0,
|
||||
setSeparator: ',',
|
||||
setSuffix: ' rmb',
|
||||
setPrefix: '¥ '
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
_startVal() {
|
||||
if (this.setStartVal) {
|
||||
return this.setStartVal
|
||||
} else {
|
||||
return 0
|
||||
}
|
||||
},
|
||||
_endVal() {
|
||||
if (this.setEndVal) {
|
||||
return this.setEndVal
|
||||
} else {
|
||||
return 0
|
||||
}
|
||||
},
|
||||
_duration() {
|
||||
if (this.setDuration) {
|
||||
return this.setDuration
|
||||
} else {
|
||||
return 100
|
||||
}
|
||||
},
|
||||
_decimals() {
|
||||
if (this.setDecimals) {
|
||||
if (this.setDecimals < 0 || this.setDecimals > 20) {
|
||||
alert('digits argument must be between 0 and 20')
|
||||
return 0
|
||||
}
|
||||
return this.setDecimals
|
||||
} else {
|
||||
return 0
|
||||
}
|
||||
},
|
||||
_separator() {
|
||||
return this.setSeparator
|
||||
},
|
||||
_suffix() {
|
||||
return this.setSuffix
|
||||
},
|
||||
_prefix() {
|
||||
return this.setPrefix
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
start() {
|
||||
this.$refs.example.start()
|
||||
},
|
||||
pauseResume() {
|
||||
this.$refs.example.pauseResume()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.example-btn {
|
||||
display: inline-block;
|
||||
margin-bottom: 0;
|
||||
font-weight: 500;
|
||||
text-align: center;
|
||||
-ms-touch-action: manipulation;
|
||||
touch-action: manipulation;
|
||||
cursor: pointer;
|
||||
background-image: none;
|
||||
border: 1px solid transparent;
|
||||
white-space: nowrap;
|
||||
line-height: 1.5;
|
||||
padding: 4px 15px;
|
||||
font-size: 12px;
|
||||
border-radius: 4px;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
-webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1);
|
||||
transition: all .3s cubic-bezier(.645, .045, .355, 1);
|
||||
position: relative;
|
||||
color: rgba(0, 0, 0, .65);
|
||||
background-color: #fff;
|
||||
border-color: #d9d9d9;
|
||||
}
|
||||
|
||||
.example-btn:hover {
|
||||
color: #4AB7BD;
|
||||
background-color: #fff;
|
||||
border-color: #4AB7BD;
|
||||
}
|
||||
.example {
|
||||
font-size: 50px;
|
||||
color: #F6416C;
|
||||
display: block;
|
||||
margin: 10px 0;
|
||||
text-align: center;
|
||||
font-size: 80px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.label {
|
||||
color: #2f4f4f;
|
||||
font-size: 16px;
|
||||
display: inline-block;
|
||||
margin: 15px 30px 15px 0;
|
||||
}
|
||||
|
||||
input {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
padding: 4px 7px;
|
||||
width: 70px;
|
||||
height: 28px;
|
||||
cursor: text;
|
||||
font-size: 12px;
|
||||
line-height: 1.5;
|
||||
color: rgba(0, 0, 0, .65);
|
||||
background-color: #fff;
|
||||
background-image: none;
|
||||
border: 1px solid #d9d9d9;
|
||||
border-radius: 4px;
|
||||
-webkit-transition: all .3s;
|
||||
transition: all .3s;
|
||||
}
|
||||
|
||||
.startBtn {
|
||||
margin-left: 20px;
|
||||
font-size: 20px;
|
||||
color: #30B08F;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.startBtn:hover {
|
||||
background-color: #30B08F;
|
||||
color: #fff;
|
||||
border-color: #30B08F;
|
||||
}
|
||||
|
||||
.pause-resume-btn {
|
||||
font-size: 20px;
|
||||
color: #E65D6E;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.pause-resume-btn:hover {
|
||||
background-color: #E65D6E;
|
||||
color: #fff;
|
||||
border-color: #E65D6E;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,39 +0,0 @@
|
||||
<template>
|
||||
<div class="components-container">
|
||||
<aside>drag-list base on
|
||||
<a href="https://github.com/SortableJS/Vue.Draggable" target="_blank">Vue.Draggable</a>
|
||||
</aside>
|
||||
<div class="editor-container">
|
||||
<dnd-list :list1="list1" :list2="list2" list1-title="List" list2-title="Article pool" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import DndList from '@/components/DndList'
|
||||
import { fetchList } from '@/api/article'
|
||||
|
||||
export default {
|
||||
name: 'DndListDemo',
|
||||
components: { DndList },
|
||||
data() {
|
||||
return {
|
||||
list1: [],
|
||||
list2: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getData()
|
||||
},
|
||||
methods: {
|
||||
getData() {
|
||||
this.listLoading = true
|
||||
fetchList().then(response => {
|
||||
this.list1 = response.data.items.splice(0, 5)
|
||||
this.list2 = response.data.items
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -1,61 +0,0 @@
|
||||
<template>
|
||||
<div class="components-container">
|
||||
<el-button type="primary" @click="dialogTableVisible = true">
|
||||
open a Drag Dialog
|
||||
</el-button>
|
||||
<el-dialog v-el-drag-dialog :visible.sync="dialogTableVisible" title="Shipping address" @dragDialog="handleDrag">
|
||||
<el-select ref="select" v-model="value" placeholder="请选择">
|
||||
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
|
||||
</el-select>
|
||||
<el-table :data="gridData">
|
||||
<el-table-column property="date" label="Date" width="150" />
|
||||
<el-table-column property="name" label="Name" width="200" />
|
||||
<el-table-column property="address" label="Address" />
|
||||
</el-table>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import elDragDialog from '@/directive/el-drag-dialog' // base on element-ui
|
||||
|
||||
export default {
|
||||
name: 'DragDialogDemo',
|
||||
directives: { elDragDialog },
|
||||
data() {
|
||||
return {
|
||||
dialogTableVisible: false,
|
||||
options: [
|
||||
{ value: '选项1', label: '黄金糕' },
|
||||
{ value: '选项2', label: '双皮奶' },
|
||||
{ value: '选项3', label: '蚵仔煎' },
|
||||
{ value: '选项4', label: '龙须面' }
|
||||
],
|
||||
value: '',
|
||||
gridData: [{
|
||||
date: '2016-05-02',
|
||||
name: 'John Smith',
|
||||
address: 'No.1518, Jinshajiang Road, Putuo District'
|
||||
}, {
|
||||
date: '2016-05-04',
|
||||
name: 'John Smith',
|
||||
address: 'No.1518, Jinshajiang Road, Putuo District'
|
||||
}, {
|
||||
date: '2016-05-01',
|
||||
name: 'John Smith',
|
||||
address: 'No.1518, Jinshajiang Road, Putuo District'
|
||||
}, {
|
||||
date: '2016-05-03',
|
||||
name: 'John Smith',
|
||||
address: 'No.1518, Jinshajiang Road, Putuo District'
|
||||
}]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// v-el-drag-dialog onDrag callback function
|
||||
handleDrag() {
|
||||
this.$refs.select.blur()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -1,66 +0,0 @@
|
||||
<template>
|
||||
<div class="components-container board">
|
||||
<Kanban :key="1" :list="list1" :group="group" class="kanban todo" header-text="Todo" />
|
||||
<Kanban :key="2" :list="list2" :group="group" class="kanban working" header-text="Working" />
|
||||
<Kanban :key="3" :list="list3" :group="group" class="kanban done" header-text="Done" />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import Kanban from '@/components/Kanban'
|
||||
|
||||
export default {
|
||||
name: 'DragKanbanDemo',
|
||||
components: {
|
||||
Kanban
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
group: 'mission',
|
||||
list1: [
|
||||
{ name: 'Mission', id: 1 },
|
||||
{ name: 'Mission', id: 2 },
|
||||
{ name: 'Mission', id: 3 },
|
||||
{ name: 'Mission', id: 4 }
|
||||
],
|
||||
list2: [
|
||||
{ name: 'Mission', id: 5 },
|
||||
{ name: 'Mission', id: 6 },
|
||||
{ name: 'Mission', id: 7 }
|
||||
],
|
||||
list3: [
|
||||
{ name: 'Mission', id: 8 },
|
||||
{ name: 'Mission', id: 9 },
|
||||
{ name: 'Mission', id: 10 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.board {
|
||||
width: 1000px;
|
||||
margin-left: 20px;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
flex-direction: row;
|
||||
align-items: flex-start;
|
||||
}
|
||||
.kanban {
|
||||
&.todo {
|
||||
.board-column-header {
|
||||
background: #4A9FF9;
|
||||
}
|
||||
}
|
||||
&.working {
|
||||
.board-column-header {
|
||||
background: #f9944a;
|
||||
}
|
||||
}
|
||||
&.done {
|
||||
.board-column-header {
|
||||
background: #2ac06d;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,43 +0,0 @@
|
||||
<template>
|
||||
<div class="components-container">
|
||||
<el-drag-select v-model="value" style="width:500px;" multiple placeholder="请选择">
|
||||
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
|
||||
</el-drag-select>
|
||||
|
||||
<div style="margin-top:30px;">
|
||||
<el-tag v-for="item of value" :key="item" style="margin-right:15px;">
|
||||
{{ item }}
|
||||
</el-tag>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ElDragSelect from '@/components/DragSelect' // base on element-ui
|
||||
|
||||
export default {
|
||||
name: 'DragSelectDemo',
|
||||
components: { ElDragSelect },
|
||||
data() {
|
||||
return {
|
||||
value: ['Apple', 'Banana', 'Orange'],
|
||||
options: [{
|
||||
value: 'Apple',
|
||||
label: 'Apple'
|
||||
}, {
|
||||
value: 'Banana',
|
||||
label: 'Banana'
|
||||
}, {
|
||||
value: 'Orange',
|
||||
label: 'Orange'
|
||||
}, {
|
||||
value: 'Pear',
|
||||
label: 'Pear'
|
||||
}, {
|
||||
value: 'Strawberry',
|
||||
label: 'Strawberry'
|
||||
}]
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -1,31 +0,0 @@
|
||||
<template>
|
||||
<div class="components-container">
|
||||
<aside>
|
||||
Based on <a class="link-type" href="https://github.com/rowanwins/vue-dropzone"> dropzone </a>.
|
||||
Because my business has special needs, and has to upload images to qiniu, so instead of a third party, I chose encapsulate it by myself. It is very simple, you can see the detail code in @/components/Dropzone.
|
||||
</aside>
|
||||
<div class="editor-container">
|
||||
<dropzone id="myVueDropzone" url="https://httpbin.org/post" @dropzone-removedFile="dropzoneR" @dropzone-success="dropzoneS" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Dropzone from '@/components/Dropzone'
|
||||
|
||||
export default {
|
||||
name: 'DropzoneDemo',
|
||||
components: { Dropzone },
|
||||
methods: {
|
||||
dropzoneS(file) {
|
||||
console.log(file)
|
||||
this.$message({ message: 'Upload success', type: 'success' })
|
||||
},
|
||||
dropzoneR(file) {
|
||||
console.log(file)
|
||||
this.$message({ message: 'Delete success', type: 'success' })
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -1,36 +0,0 @@
|
||||
<template>
|
||||
<div class="components-container">
|
||||
<aside>Json-Editor is base on <a href="https://github.com/codemirror/CodeMirror" target="_blank">CodeMirrorr</a>. Lint
|
||||
base on <a
|
||||
href="https://github.com/codemirror/CodeMirror/blob/master/addon/lint/json-lint.js"
|
||||
target="_blank"
|
||||
>json-lint</a>.</aside>
|
||||
<div class="editor-container">
|
||||
<json-editor ref="jsonEditor" v-model="value" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import JsonEditor from '@/components/JsonEditor'
|
||||
|
||||
const jsonData = '[{"items":[{"market_type":"forexdata","symbol":"XAUUSD"},{"market_type":"forexdata","symbol":"UKOIL"},{"market_type":"forexdata","symbol":"CORN"}],"name":""},{"items":[{"market_type":"forexdata","symbol":"XAUUSD"},{"market_type":"forexdata","symbol":"XAGUSD"},{"market_type":"forexdata","symbol":"AUTD"},{"market_type":"forexdata","symbol":"AGTD"}],"name":"贵金属"},{"items":[{"market_type":"forexdata","symbol":"CORN"},{"market_type":"forexdata","symbol":"WHEAT"},{"market_type":"forexdata","symbol":"SOYBEAN"},{"market_type":"forexdata","symbol":"SUGAR"}],"name":"农产品"},{"items":[{"market_type":"forexdata","symbol":"UKOIL"},{"market_type":"forexdata","symbol":"USOIL"},{"market_type":"forexdata","symbol":"NGAS"}],"name":"能源化工"}]'
|
||||
|
||||
export default {
|
||||
name: 'JsonEditorDemo',
|
||||
components: { JsonEditor },
|
||||
data() {
|
||||
return {
|
||||
value: JSON.parse(jsonData)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.editor-container{
|
||||
position: relative;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,101 +0,0 @@
|
||||
<template>
|
||||
<div class="components-container">
|
||||
<aside>Markdown is based on
|
||||
<a href="https://github.com/nhnent/tui.editor" target="_blank">tui.editor</a> ，simply wrapped with Vue.
|
||||
<a
|
||||
target="_blank"
|
||||
href="https://panjiachen.github.io/vue-element-admin-site/feature/component/markdown-editor.html"
|
||||
>
|
||||
Documentation </a>
|
||||
</aside>
|
||||
|
||||
<div class="editor-container">
|
||||
<el-tag class="tag-title">
|
||||
Basic:
|
||||
</el-tag>
|
||||
<markdown-editor v-model="content1" height="300px" />
|
||||
</div>
|
||||
|
||||
<div class="editor-container">
|
||||
<el-tag class="tag-title">
|
||||
Markdown Mode:
|
||||
</el-tag>
|
||||
<markdown-editor ref="markdownEditor" v-model="content2" :options="{hideModeSwitch:true,previewStyle:'tab'}" height="200px" />
|
||||
</div>
|
||||
|
||||
<div class="editor-container">
|
||||
<el-tag class="tag-title">
|
||||
Customize Toolbar:
|
||||
</el-tag>
|
||||
<markdown-editor v-model="content3" :options="{ toolbarItems: ['heading','bold','italic']}" />
|
||||
</div>
|
||||
|
||||
<div class="editor-container">
|
||||
<el-tag class="tag-title">
|
||||
I18n:
|
||||
</el-tag>
|
||||
<el-alert
|
||||
:closable="false"
|
||||
title="You can change the language of the admin system to see the effect"
|
||||
type="success"
|
||||
/>
|
||||
<markdown-editor ref="markdownEditor" v-model="content4" :language="language" height="300px" />
|
||||
</div>
|
||||
|
||||
<el-button style="margin-top:80px;" type="primary" icon="el-icon-document" @click="getHtml">
|
||||
Get HTML
|
||||
</el-button>
|
||||
<div v-html="html" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import MarkdownEditor from '@/components/MarkdownEditor'
|
||||
|
||||
const content = `
|
||||
**This is test**
|
||||
|
||||
* vue
|
||||
* element
|
||||
* webpack
|
||||
|
||||
`
|
||||
export default {
|
||||
name: 'MarkdownDemo',
|
||||
components: { MarkdownEditor },
|
||||
data() {
|
||||
return {
|
||||
content1: content,
|
||||
content2: content,
|
||||
content3: content,
|
||||
content4: content,
|
||||
html: '',
|
||||
languageTypeList: {
|
||||
'en': 'en_US',
|
||||
'zh': 'zh_CN',
|
||||
'es': 'es_ES'
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
language() {
|
||||
return this.languageTypeList['en']
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getHtml() {
|
||||
this.html = this.$refs.markdownEditor.getHtml()
|
||||
console.log(this.html)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.editor-container{
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
.tag-title{
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
</style>
|
||||
@ -1,169 +0,0 @@
|
||||
<template>
|
||||
<div class="mixin-components-container">
|
||||
<el-row>
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>Buttons</span>
|
||||
</div>
|
||||
<div style="margin-bottom:50px;">
|
||||
<el-col :span="4" class="text-center">
|
||||
<router-link class="pan-btn blue-btn" to="/documentation/index">
|
||||
Documentation
|
||||
</router-link>
|
||||
</el-col>
|
||||
<el-col :span="4" class="text-center">
|
||||
<router-link class="pan-btn light-blue-btn" to="/icon/index">
|
||||
Icons
|
||||
</router-link>
|
||||
</el-col>
|
||||
<el-col :span="4" class="text-center">
|
||||
<router-link class="pan-btn pink-btn" to="/excel/export-excel">
|
||||
Excel
|
||||
</router-link>
|
||||
</el-col>
|
||||
<el-col :span="4" class="text-center">
|
||||
<router-link class="pan-btn green-btn" to="/table/complex-table">
|
||||
Table
|
||||
</router-link>
|
||||
</el-col>
|
||||
<el-col :span="4" class="text-center">
|
||||
<router-link class="pan-btn tiffany-btn" to="/example/create">
|
||||
Form
|
||||
</router-link>
|
||||
</el-col>
|
||||
<el-col :span="4" class="text-center">
|
||||
<router-link class="pan-btn yellow-btn" to="/theme/index">
|
||||
Theme
|
||||
</router-link>
|
||||
</el-col>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-row>
|
||||
|
||||
<el-row :gutter="20" style="margin-top:50px;">
|
||||
<el-col :span="6">
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>Material Design 的input</span>
|
||||
</div>
|
||||
<div style="height:100px;">
|
||||
<el-form :model="demo" :rules="demoRules">
|
||||
<el-form-item prop="title">
|
||||
<md-input v-model="demo.title" icon="el-icon-search" name="title" placeholder="输入标题">
|
||||
标题
|
||||
</md-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="6">
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>图片hover效果</span>
|
||||
</div>
|
||||
<div class="component-item">
|
||||
<pan-thumb width="100px" height="100px" image="https://wpimg.wallstcn.com/577965b9-bb9e-4e02-9f0c-095b41417191">
|
||||
vue-element-admin
|
||||
</pan-thumb>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="6">
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>水波纹 waves v-directive</span>
|
||||
</div>
|
||||
<div class="component-item">
|
||||
<el-button v-waves type="primary">
|
||||
水波纹效果
|
||||
</el-button>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="6">
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>hover text</span>
|
||||
</div>
|
||||
<div class="component-item">
|
||||
<mallki class-name="mallki-text" text="vue-element-admin" />
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row :gutter="20" style="margin-top:50px;">
|
||||
<el-col :span="8">
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>Share</span>
|
||||
</div>
|
||||
<div class="component-item" style="height:420px;">
|
||||
<dropdown-menu :items="articleList" style="margin:0 auto;" title="系列文章" />
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import PanThumb from '@/components/PanThumb'
|
||||
import MdInput from '@/components/MDinput'
|
||||
import Mallki from '@/components/TextHoverEffect/Mallki'
|
||||
import DropdownMenu from '@/components/Share/DropdownMenu'
|
||||
import waves from '@/directive/waves/index.js' // 水波纹指令
|
||||
|
||||
export default {
|
||||
name: 'ComponentMixinDemo',
|
||||
components: {
|
||||
PanThumb,
|
||||
MdInput,
|
||||
Mallki,
|
||||
DropdownMenu
|
||||
},
|
||||
directives: {
|
||||
waves
|
||||
},
|
||||
data() {
|
||||
const validate = (rule, value, callback) => {
|
||||
if (value.length !== 6) {
|
||||
callback(new Error('请输入六个字符'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
return {
|
||||
demo: {
|
||||
title: ''
|
||||
},
|
||||
demoRules: {
|
||||
title: [{ required: true, trigger: 'change', validator: validate }]
|
||||
},
|
||||
articleList: [
|
||||
{ title: '基础篇', href: 'https://juejin.im/post/59097cd7a22b9d0065fb61d2' },
|
||||
{ title: '登录权限篇', href: 'https://juejin.im/post/591aa14f570c35006961acac' },
|
||||
{ title: '实战篇', href: 'https://juejin.im/post/593121aa0ce4630057f70d35' },
|
||||
{ title: 'vue-admin-template 篇', href: 'https://juejin.im/post/595b4d776fb9a06bbe7dba56' },
|
||||
{ title: 'v4.0 篇', href: 'https://juejin.im/post/5c92ff94f265da6128275a85' },
|
||||
{ title: '优雅的使用 icon', href: 'https://juejin.im/post/59bb864b5188257e7a427c09' }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.mixin-components-container {
|
||||
background-color: #f0f2f5;
|
||||
padding: 30px;
|
||||
min-height: calc(100vh - 84px);
|
||||
}
|
||||
.component-item{
|
||||
min-height: 100px;
|
||||
}
|
||||
</style>
|
||||
@ -1,67 +0,0 @@
|
||||
<template>
|
||||
<div class="components-container">
|
||||
<aside><strong>SplitPane</strong> If you've used
|
||||
<a href="https://codepen.io/" target="_blank"> codepen</a>,
|
||||
<a href="https://jsfiddle.net/" target="_blank"> jsfiddle </a>will not be unfamiliar.
|
||||
<a href="https://github.com/PanJiaChen/vue-split-pane" target="_blank"> Github repository</a>
|
||||
</aside>
|
||||
<split-pane split="vertical" @resize="resize">
|
||||
<template slot="paneL">
|
||||
<div class="left-container" />
|
||||
</template>
|
||||
<template slot="paneR">
|
||||
<split-pane split="horizontal">
|
||||
<template slot="paneL">
|
||||
<div class="top-container" />
|
||||
</template>
|
||||
<template slot="paneR">
|
||||
<div class="bottom-container" />
|
||||
</template>
|
||||
</split-pane>
|
||||
</template>
|
||||
</split-pane>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import splitPane from 'vue-splitpane'
|
||||
|
||||
export default {
|
||||
name: 'SplitpaneDemo',
|
||||
components: { splitPane },
|
||||
methods: {
|
||||
resize() {
|
||||
console.log('resize')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.components-container {
|
||||
position: relative;
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
.left-container {
|
||||
background-color: #F38181;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.right-container {
|
||||
background-color: #FCE38A;
|
||||
height: 200px;
|
||||
}
|
||||
|
||||
.top-container {
|
||||
background-color: #FCE38A;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.bottom-container {
|
||||
width: 100%;
|
||||
background-color: #95E1D3;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
@ -1,135 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<sticky :z-index="10" class-name="sub-navbar">
|
||||
<el-dropdown trigger="click">
|
||||
<el-button plain>
|
||||
Platform<i class="el-icon-caret-bottom el-icon--right" />
|
||||
</el-button>
|
||||
<el-dropdown-menu slot="dropdown" class="no-border">
|
||||
<el-checkbox-group v-model="platforms" style="padding: 5px 15px;">
|
||||
<el-checkbox v-for="item in platformsOptions" :key="item.key" :label="item.key">
|
||||
{{ item.name }}
|
||||
</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
|
||||
<el-dropdown trigger="click">
|
||||
<el-button plain>
|
||||
Link<i class="el-icon-caret-bottom el-icon--right" />
|
||||
</el-button>
|
||||
<el-dropdown-menu slot="dropdown" class="no-padding no-border" style="width:300px">
|
||||
<el-input v-model="url" placeholder="Please enter the content">
|
||||
<template slot="prepend">
|
||||
Url
|
||||
</template>
|
||||
</el-input>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
|
||||
<div class="time-container">
|
||||
<el-date-picker v-model="time" type="datetime" format="yyyy-MM-dd HH:mm:ss" placeholder="Release time" />
|
||||
</div>
|
||||
|
||||
<el-button style="margin-left: 10px;" type="success">
|
||||
publish
|
||||
</el-button>
|
||||
</sticky>
|
||||
|
||||
<div class="components-container">
|
||||
<aside>
|
||||
Sticky header, When the page is scrolled to the preset position will be sticky on the top.
|
||||
</aside>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<sticky :sticky-top="200">
|
||||
<el-button type="primary"> placeholder</el-button>
|
||||
</sticky>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
<div>placeholder</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Sticky from '@/components/Sticky'
|
||||
|
||||
export default {
|
||||
name: 'StickyDemo',
|
||||
components: { Sticky },
|
||||
data() {
|
||||
return {
|
||||
time: '',
|
||||
url: '',
|
||||
platforms: ['a-platform'],
|
||||
platformsOptions: [
|
||||
{ key: 'a-platform', name: 'platformA' },
|
||||
{ key: 'b-platform', name: 'platformB' },
|
||||
{ key: 'c-platform', name: 'platformC' }
|
||||
],
|
||||
pickerOptions: {
|
||||
disabledDate(time) {
|
||||
return time.getTime() > Date.now()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.components-container div {
|
||||
margin: 10px;
|
||||
}
|
||||
|
||||
.time-container {
|
||||
display: inline-block;
|
||||
}
|
||||
</style>
|
||||
@ -1,36 +0,0 @@
|
||||
<template>
|
||||
<div class="components-container">
|
||||
<aside>
|
||||
Rich text is a core feature of the management backend, but at the same time it is a place with lots of pits. In the process of selecting rich texts, I also took a lot of detours. The common rich texts on the market have been basically used, and I finally chose Tinymce. See the more detailed rich text comparison and introduction.
|
||||
<a target="_blank" class="link-type" href="https://panjiachen.github.io/vue-element-admin-site/feature/component/rich-editor.html">Documentation</a>
|
||||
</aside>
|
||||
<div>
|
||||
<tinymce v-model="content" :height="300" />
|
||||
</div>
|
||||
<div class="editor-content" v-html="content" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Tinymce from '@/components/Tinymce'
|
||||
|
||||
export default {
|
||||
name: 'TinymceDemo',
|
||||
components: { Tinymce },
|
||||
data() {
|
||||
return {
|
||||
content:
|
||||
`<h1 style="text-align: center;">Welcome to the TinyMCE demo!</h1><p style="text-align: center; font-size: 15px;"><img title="TinyMCE Logo" src="//www.tinymce.com/images/glyph-tinymce@2x.png" alt="TinyMCE Logo" width="110" height="97" /><ul>
|
||||
<li>Our <a href="//www.tinymce.com/docs/">documentation</a> is a great resource for learning how to configure TinyMCE.</li><li>Have a specific question? Visit the <a href="https://community.tinymce.com/forum/">Community Forum</a>.</li><li>We also offer enterprise grade support as part of <a href="https://tinymce.com/pricing">TinyMCE premium subscriptions</a>.</li>
|
||||
</ul>`
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.editor-content{
|
||||
margin-top: 20px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,6 +1,5 @@
|
||||
<template>
|
||||
<div class="dashboard-editor-container">
|
||||
<github-corner class="github-corner" />
|
||||
|
||||
<panel-group @handleSetLineChartData="handleSetLineChartData" />
|
||||
|
||||
@ -41,7 +40,6 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import GithubCorner from '@/components/GithubCorner'
|
||||
import PanelGroup from './components/PanelGroup'
|
||||
import LineChart from './components/LineChart'
|
||||
import RaddarChart from './components/RaddarChart'
|
||||
@ -72,7 +70,6 @@ const lineChartData = {
|
||||
export default {
|
||||
name: 'DashboardAdmin',
|
||||
components: {
|
||||
GithubCorner,
|
||||
PanelGroup,
|
||||
LineChart,
|
||||
RaddarChart,
|
||||
|
||||
@ -1,15 +1,7 @@
|
||||
<template>
|
||||
<div class="dashboard-editor-container">
|
||||
<div class=" clearfix">
|
||||
<pan-thumb :image="avatar" style="float: left">
|
||||
Your roles:
|
||||
<span v-for="item in roles" :key="item" class="pan-info-roles">{{ item }}</span>
|
||||
</pan-thumb>
|
||||
<github-corner style="position: absolute; top: 0px; border: 0; right: 0;" />
|
||||
<div class="info-container">
|
||||
<span class="display_name">{{ name }}</span>
|
||||
<span style="font-size:20px;padding-top:20px;display:inline-block;">Editor's Dashboard</span>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<img :src="emptyGif" class="emptyGif">
|
||||
@ -19,12 +11,9 @@
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex'
|
||||
import PanThumb from '@/components/PanThumb'
|
||||
import GithubCorner from '@/components/GithubCorner'
|
||||
|
||||
export default {
|
||||
name: 'DashboardEditor',
|
||||
components: { PanThumb, GithubCorner },
|
||||
data() {
|
||||
return {
|
||||
emptyGif: 'https://wpimg.wallstcn.com/0e03b7da-db9e-4819-ba10-9016ddfdaed3'
|
||||
|
||||
@ -24,7 +24,7 @@ export default {
|
||||
},
|
||||
created() {
|
||||
if (!this.roles.includes('admin')) {
|
||||
this.currentRole = 'editorDashboard'
|
||||
this.currentRole = 'adminDashboard'
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,289 +0,0 @@
|
||||
<template>
|
||||
<div class="createPost-container">
|
||||
<el-form ref="postForm" :model="postForm" :rules="rules" class="form-container">
|
||||
|
||||
<sticky :z-index="10" :class-name="'sub-navbar '+postForm.status">
|
||||
<CommentDropdown v-model="postForm.comment_disabled" />
|
||||
<PlatformDropdown v-model="postForm.platforms" />
|
||||
<SourceUrlDropdown v-model="postForm.source_uri" />
|
||||
<el-button v-loading="loading" style="margin-left: 10px;" type="success" @click="submitForm">
|
||||
Publish
|
||||
</el-button>
|
||||
<el-button v-loading="loading" type="warning" @click="draftForm">
|
||||
Draft
|
||||
</el-button>
|
||||
</sticky>
|
||||
|
||||
<div class="createPost-main-container">
|
||||
<el-row>
|
||||
<Warning />
|
||||
|
||||
<el-col :span="24">
|
||||
<el-form-item style="margin-bottom: 40px;" prop="title">
|
||||
<MDinput v-model="postForm.title" :maxlength="100" name="name" required>
|
||||
Title
|
||||
</MDinput>
|
||||
</el-form-item>
|
||||
|
||||
<div class="postInfo-container">
|
||||
<el-row>
|
||||
<el-col :span="8">
|
||||
<el-form-item label-width="60px" label="Author:" class="postInfo-container-item">
|
||||
<el-select v-model="postForm.author" :remote-method="getRemoteUserList" filterable default-first-option remote placeholder="Search user">
|
||||
<el-option v-for="(item,index) in userListOptions" :key="item+index" :label="item" :value="item" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="10">
|
||||
<el-form-item label-width="120px" label="Publish Time:" class="postInfo-container-item">
|
||||
<el-date-picker v-model="displayTime" type="datetime" format="yyyy-MM-dd HH:mm:ss" placeholder="Select date and time" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="6">
|
||||
<el-form-item label-width="90px" label="Importance:" class="postInfo-container-item">
|
||||
<el-rate
|
||||
v-model="postForm.importance"
|
||||
:max="3"
|
||||
:colors="['#99A9BF', '#F7BA2A', '#FF9900']"
|
||||
:low-threshold="1"
|
||||
:high-threshold="3"
|
||||
style="display:inline-block"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-form-item style="margin-bottom: 40px;" label-width="70px" label="Summary:">
|
||||
<el-input v-model="postForm.content_short" :rows="1" type="textarea" class="article-textarea" autosize placeholder="Please enter the content" />
|
||||
<span v-show="contentShortLength" class="word-counter">{{ contentShortLength }}words</span>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item prop="content" style="margin-bottom: 30px;">
|
||||
<Tinymce ref="editor" v-model="postForm.content" :height="400" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item prop="image_uri" style="margin-bottom: 30px;">
|
||||
<Upload v-model="postForm.image_uri" />
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Tinymce from '@/components/Tinymce'
|
||||
import Upload from '@/components/Upload/SingleImage3'
|
||||
import MDinput from '@/components/MDinput'
|
||||
import Sticky from '@/components/Sticky' // 粘性header组件
|
||||
import { validURL } from '@/utils/validate'
|
||||
import { fetchArticle } from '@/api/article'
|
||||
import { searchUser } from '@/api/remote-search'
|
||||
import Warning from './Warning'
|
||||
import { CommentDropdown, PlatformDropdown, SourceUrlDropdown } from './Dropdown'
|
||||
|
||||
const defaultForm = {
|
||||
status: 'draft',
|
||||
title: '', // 文章题目
|
||||
content: '', // 文章内容
|
||||
content_short: '', // 文章摘要
|
||||
source_uri: '', // 文章外链
|
||||
image_uri: '', // 文章图片
|
||||
display_time: undefined, // 前台展示时间
|
||||
id: undefined,
|
||||
platforms: ['a-platform'],
|
||||
comment_disabled: false,
|
||||
importance: 0
|
||||
}
|
||||
|
||||
export default {
|
||||
name: 'ArticleDetail',
|
||||
components: { Tinymce, MDinput, Upload, Sticky, Warning, CommentDropdown, PlatformDropdown, SourceUrlDropdown },
|
||||
props: {
|
||||
isEdit: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
const validateRequire = (rule, value, callback) => {
|
||||
if (value === '') {
|
||||
this.$message({
|
||||
message: rule.field + '为必传项',
|
||||
type: 'error'
|
||||
})
|
||||
callback(new Error(rule.field + '为必传项'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
const validateSourceUri = (rule, value, callback) => {
|
||||
if (value) {
|
||||
if (validURL(value)) {
|
||||
callback()
|
||||
} else {
|
||||
this.$message({
|
||||
message: '外链url填写不正确',
|
||||
type: 'error'
|
||||
})
|
||||
callback(new Error('外链url填写不正确'))
|
||||
}
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
return {
|
||||
postForm: Object.assign({}, defaultForm),
|
||||
loading: false,
|
||||
userListOptions: [],
|
||||
rules: {
|
||||
image_uri: [{ validator: validateRequire }],
|
||||
title: [{ validator: validateRequire }],
|
||||
content: [{ validator: validateRequire }],
|
||||
source_uri: [{ validator: validateSourceUri, trigger: 'blur' }]
|
||||
},
|
||||
tempRoute: {}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
contentShortLength() {
|
||||
return this.postForm.content_short.length
|
||||
},
|
||||
displayTime: {
|
||||
// set and get is useful when the data
|
||||
// returned by the back end api is different from the front end
|
||||
// back end return => "2013-06-25 06:59:25"
|
||||
// front end need timestamp => 1372114765000
|
||||
get() {
|
||||
return (+new Date(this.postForm.display_time))
|
||||
},
|
||||
set(val) {
|
||||
this.postForm.display_time = new Date(val)
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
if (this.isEdit) {
|
||||
const id = this.$route.params && this.$route.params.id
|
||||
this.fetchData(id)
|
||||
}
|
||||
|
||||
// Why need to make a copy of this.$route here?
|
||||
// Because if you enter this page and quickly switch tag, may be in the execution of the setTagsViewTitle function, this.$route is no longer pointing to the current page
|
||||
// https://github.com/PanJiaChen/vue-element-admin/issues/1221
|
||||
this.tempRoute = Object.assign({}, this.$route)
|
||||
},
|
||||
methods: {
|
||||
fetchData(id) {
|
||||
fetchArticle(id).then(response => {
|
||||
this.postForm = response.data
|
||||
|
||||
// just for test
|
||||
this.postForm.title += ` Article Id:${this.postForm.id}`
|
||||
this.postForm.content_short += ` Article Id:${this.postForm.id}`
|
||||
|
||||
// set tagsview title
|
||||
this.setTagsViewTitle()
|
||||
|
||||
// set page title
|
||||
this.setPageTitle()
|
||||
}).catch(err => {
|
||||
console.log(err)
|
||||
})
|
||||
},
|
||||
setTagsViewTitle() {
|
||||
const title = 'Edit Article'
|
||||
const route = Object.assign({}, this.tempRoute, { title: `${title}-${this.postForm.id}` })
|
||||
this.$store.dispatch('tagsView/updateVisitedView', route)
|
||||
},
|
||||
setPageTitle() {
|
||||
const title = 'Edit Article'
|
||||
document.title = `${title} - ${this.postForm.id}`
|
||||
},
|
||||
submitForm() {
|
||||
console.log(this.postForm)
|
||||
this.$refs.postForm.validate(valid => {
|
||||
if (valid) {
|
||||
this.loading = true
|
||||
this.$notify({
|
||||
title: '成功',
|
||||
message: '发布文章成功',
|
||||
type: 'success',
|
||||
duration: 2000
|
||||
})
|
||||
this.postForm.status = 'published'
|
||||
this.loading = false
|
||||
} else {
|
||||
console.log('error submit!!')
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
draftForm() {
|
||||
if (this.postForm.content.length === 0 || this.postForm.title.length === 0) {
|
||||
this.$message({
|
||||
message: '请填写必要的标题和内容',
|
||||
type: 'warning'
|
||||
})
|
||||
return
|
||||
}
|
||||
this.$message({
|
||||
message: '保存成功',
|
||||
type: 'success',
|
||||
showClose: true,
|
||||
duration: 1000
|
||||
})
|
||||
this.postForm.status = 'draft'
|
||||
},
|
||||
getRemoteUserList(query) {
|
||||
searchUser(query).then(response => {
|
||||
if (!response.data.items) return
|
||||
this.userListOptions = response.data.items.map(v => v.name)
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "~@/styles/mixin.scss";
|
||||
|
||||
.createPost-container {
|
||||
position: relative;
|
||||
|
||||
.createPost-main-container {
|
||||
padding: 40px 45px 20px 50px;
|
||||
|
||||
.postInfo-container {
|
||||
position: relative;
|
||||
@include clearfix;
|
||||
margin-bottom: 10px;
|
||||
|
||||
.postInfo-container-item {
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.word-counter {
|
||||
width: 40px;
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.article-textarea ::v-deep {
|
||||
textarea {
|
||||
padding-right: 40px;
|
||||
resize: none;
|
||||
border: none;
|
||||
border-radius: 0px;
|
||||
border-bottom: 1px solid #bfcbd9;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,41 +0,0 @@
|
||||
<template>
|
||||
<el-dropdown :show-timeout="100" trigger="click">
|
||||
<el-button plain>
|
||||
{{ !comment_disabled?'Comment: opened':'Comment: closed' }}
|
||||
<i class="el-icon-caret-bottom el-icon--right" />
|
||||
</el-button>
|
||||
<el-dropdown-menu slot="dropdown" class="no-padding">
|
||||
<el-dropdown-item>
|
||||
<el-radio-group v-model="comment_disabled" style="padding: 10px;">
|
||||
<el-radio :label="true">
|
||||
Close comment
|
||||
</el-radio>
|
||||
<el-radio :label="false">
|
||||
Open comment
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
value: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
comment_disabled: {
|
||||
get() {
|
||||
return this.value
|
||||
},
|
||||
set(val) {
|
||||
this.$emit('input', val)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -1,46 +0,0 @@
|
||||
<template>
|
||||
<el-dropdown :hide-on-click="false" :show-timeout="100" trigger="click">
|
||||
<el-button plain>
|
||||
Platfroms({{ platforms.length }})
|
||||
<i class="el-icon-caret-bottom el-icon--right" />
|
||||
</el-button>
|
||||
<el-dropdown-menu slot="dropdown" class="no-border">
|
||||
<el-checkbox-group v-model="platforms" style="padding: 5px 15px;">
|
||||
<el-checkbox v-for="item in platformsOptions" :key="item.key" :label="item.key">
|
||||
{{ item.name }}
|
||||
</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
value: {
|
||||
required: true,
|
||||
default: () => [],
|
||||
type: Array
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
platformsOptions: [
|
||||
{ key: 'a-platform', name: 'a-platform' },
|
||||
{ key: 'b-platform', name: 'b-platform' },
|
||||
{ key: 'c-platform', name: 'c-platform' }
|
||||
]
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
platforms: {
|
||||
get() {
|
||||
return this.value
|
||||
},
|
||||
set(val) {
|
||||
this.$emit('input', val)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -1,38 +0,0 @@
|
||||
<template>
|
||||
<el-dropdown :show-timeout="100" trigger="click">
|
||||
<el-button plain>
|
||||
Link
|
||||
<i class="el-icon-caret-bottom el-icon--right" />
|
||||
</el-button>
|
||||
<el-dropdown-menu slot="dropdown" class="no-padding no-border" style="width:400px">
|
||||
<el-form-item label-width="0px" style="margin-bottom: 0px" prop="source_uri">
|
||||
<el-input v-model="source_uri" placeholder="Please enter the content">
|
||||
<template slot="prepend">
|
||||
URL
|
||||
</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
value: {
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
source_uri: {
|
||||
get() {
|
||||
return this.value
|
||||
},
|
||||
set(val) {
|
||||
this.$emit('input', val)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -1,3 +0,0 @@
|
||||
export { default as CommentDropdown } from './Comment'
|
||||
export { default as PlatformDropdown } from './Platform'
|
||||
export { default as SourceUrlDropdown } from './SourceUrl'
|
||||
@ -1,13 +0,0 @@
|
||||
<template>
|
||||
<aside>
|
||||
Creating and editing pages cannot be cached by keep-alive because keep-alive include does not currently support
|
||||
caching based on routes, so it is currently cached based on component name. If you want to achieve a similar caching
|
||||
effect, you can use a browser caching scheme such as localStorage. Or do not use keep-alive include to cache all
|
||||
pages directly. See details
|
||||
<a
|
||||
href="https://panjiachen.github.io/vue-element-admin-site/guide/essentials/tags-view.html"
|
||||
target="_blank"
|
||||
>Document</a>
|
||||
</aside>
|
||||
</template>
|
||||
|
||||
@ -1,13 +0,0 @@
|
||||
<template>
|
||||
<article-detail :is-edit="false" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ArticleDetail from './components/ArticleDetail'
|
||||
|
||||
export default {
|
||||
name: 'CreateArticle',
|
||||
components: { ArticleDetail }
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -1,13 +0,0 @@
|
||||
<template>
|
||||
<article-detail :is-edit="true" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ArticleDetail from './components/ArticleDetail'
|
||||
|
||||
export default {
|
||||
name: 'EditForm',
|
||||
components: { ArticleDetail }
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -1,112 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-table v-loading="listLoading" :data="list" border fit highlight-current-row style="width: 100%">
|
||||
<el-table-column align="center" label="ID" width="80">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.id }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column width="180px" align="center" label="Date">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.timestamp | parseTime('{y}-{m}-{d} {h}:{i}') }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column width="120px" align="center" label="Author">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.author }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column width="100px" label="Importance">
|
||||
<template slot-scope="scope">
|
||||
<svg-icon v-for="n in +scope.row.importance" :key="n" icon-class="star" class="meta-item__icon" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column class-name="status-col" label="Status" width="110">
|
||||
<template slot-scope="{row}">
|
||||
<el-tag :type="row.status | statusFilter">
|
||||
{{ row.status }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column min-width="300px" label="Title">
|
||||
<template slot-scope="{row}">
|
||||
<router-link :to="'/example/edit/'+row.id" class="link-type">
|
||||
<span>{{ row.title }}</span>
|
||||
</router-link>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="Actions" width="120">
|
||||
<template slot-scope="scope">
|
||||
<router-link :to="'/example/edit/'+scope.row.id">
|
||||
<el-button type="primary" size="small" icon="el-icon-edit">
|
||||
Edit
|
||||
</el-button>
|
||||
</router-link>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination v-show="total>0" :total="total" :page.sync="listQuery.page" :limit.sync="listQuery.limit" @pagination="getList" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { fetchList } from '@/api/article'
|
||||
import Pagination from '@/components/Pagination' // Secondary package based on el-pagination
|
||||
|
||||
export default {
|
||||
name: 'ArticleList',
|
||||
components: { Pagination },
|
||||
filters: {
|
||||
statusFilter(status) {
|
||||
const statusMap = {
|
||||
published: 'success',
|
||||
draft: 'info',
|
||||
deleted: 'danger'
|
||||
}
|
||||
return statusMap[status]
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
list: null,
|
||||
total: 0,
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 20
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
this.listLoading = true
|
||||
fetchList(this.listQuery).then(response => {
|
||||
this.list = response.data.items
|
||||
this.total = response.data.total
|
||||
this.listLoading = false
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.edit-input {
|
||||
padding-right: 100px;
|
||||
}
|
||||
.cancel-btn {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 10px;
|
||||
}
|
||||
</style>
|
||||
@ -1,34 +0,0 @@
|
||||
<template>
|
||||
<div style="display:inline-block;">
|
||||
<label class="radio-label">Cell Auto-Width: </label>
|
||||
<el-radio-group v-model="autoWidth">
|
||||
<el-radio :label="true" border>
|
||||
True
|
||||
</el-radio>
|
||||
<el-radio :label="false" border>
|
||||
False
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
value: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
autoWidth: {
|
||||
get() {
|
||||
return this.value
|
||||
},
|
||||
set(val) {
|
||||
this.$emit('input', val)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -1,39 +0,0 @@
|
||||
<template>
|
||||
<div style="display:inline-block;">
|
||||
<label class="radio-label">Book Type: </label>
|
||||
<el-select v-model="bookType" style="width:120px;">
|
||||
<el-option
|
||||
v-for="item in options"
|
||||
:key="item"
|
||||
:label="item"
|
||||
:value="item"
|
||||
/>
|
||||
</el-select>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
value: {
|
||||
type: String,
|
||||
default: 'xlsx'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
options: ['xlsx', 'csv', 'txt']
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
bookType: {
|
||||
get() {
|
||||
return this.value
|
||||
},
|
||||
set(val) {
|
||||
this.$emit('input', val)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -1,27 +0,0 @@
|
||||
<template>
|
||||
<div style="display:inline-block;">
|
||||
<label class="radio-label" style="padding-left:0;">Filename: </label>
|
||||
<el-input v-model="filename" placeholder="Please enter the file name (default excel-list)" style="width:345px;" prefix-icon="el-icon-document" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
value: {
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
filename: {
|
||||
get() {
|
||||
return this.value
|
||||
},
|
||||
set(val) {
|
||||
this.$emit('input', val)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -1,116 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<div>
|
||||
<FilenameOption v-model="filename" />
|
||||
<AutoWidthOption v-model="autoWidth" />
|
||||
<BookTypeOption v-model="bookType" />
|
||||
<el-button :loading="downloadLoading" style="margin:0 0 20px 20px;" type="primary" icon="el-icon-document" @click="handleDownload">
|
||||
Export Excel
|
||||
</el-button>
|
||||
<a href="https://panjiachen.github.io/vue-element-admin-site/feature/component/excel.html" target="_blank" style="margin-left:15px;">
|
||||
<el-tag type="info">Documentation</el-tag>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<el-table v-loading="listLoading" :data="list" element-loading-text="Loading..." border fit highlight-current-row>
|
||||
<el-table-column align="center" label="Id" width="95">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.$index }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="Title">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.title }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="Author" width="110" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-tag>{{ scope.row.author }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="Readings" width="115" align="center">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.pageviews }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="Date" width="220">
|
||||
<template slot-scope="scope">
|
||||
<i class="el-icon-time" />
|
||||
<span>{{ scope.row.timestamp | parseTime('{y}-{m}-{d} {h}:{i}') }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { fetchList } from '@/api/article'
|
||||
import { parseTime } from '@/utils'
|
||||
// options components
|
||||
import FilenameOption from './components/FilenameOption'
|
||||
import AutoWidthOption from './components/AutoWidthOption'
|
||||
import BookTypeOption from './components/BookTypeOption'
|
||||
|
||||
export default {
|
||||
name: 'ExportExcel',
|
||||
components: { FilenameOption, AutoWidthOption, BookTypeOption },
|
||||
data() {
|
||||
return {
|
||||
list: null,
|
||||
listLoading: true,
|
||||
downloadLoading: false,
|
||||
filename: '',
|
||||
autoWidth: true,
|
||||
bookType: 'xlsx'
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
fetchList().then(response => {
|
||||
this.list = response.data.items
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
handleDownload() {
|
||||
this.downloadLoading = true
|
||||
import('@/vendor/Export2Excel').then(excel => {
|
||||
const tHeader = ['Id', 'Title', 'Author', 'Readings', 'Date']
|
||||
const filterVal = ['id', 'title', 'author', 'pageviews', 'display_time']
|
||||
const list = this.list
|
||||
const data = this.formatJson(filterVal, list)
|
||||
excel.export_json_to_excel({
|
||||
header: tHeader,
|
||||
data,
|
||||
filename: this.filename,
|
||||
autoWidth: this.autoWidth,
|
||||
bookType: this.bookType
|
||||
})
|
||||
this.downloadLoading = false
|
||||
})
|
||||
},
|
||||
formatJson(filterVal, jsonData) {
|
||||
return jsonData.map(v => filterVal.map(j => {
|
||||
if (j === 'timestamp') {
|
||||
return parseTime(v[j])
|
||||
} else {
|
||||
return v[j]
|
||||
}
|
||||
}))
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.radio-label {
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
line-height: 40px;
|
||||
padding: 0 12px 0 30px;
|
||||
}
|
||||
</style>
|
||||
@ -1,101 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<el-button :loading="downloadLoading" style="margin-bottom:20px" type="primary" icon="el-icon-document" @click="handleDownload">Export</el-button>
|
||||
|
||||
<el-table
|
||||
ref="multipleTable"
|
||||
v-loading="listLoading"
|
||||
:data="list"
|
||||
element-loading-text="Loading"
|
||||
border
|
||||
fit
|
||||
highlight-current-row
|
||||
>
|
||||
<el-table-column align="center" label="Id" width="95">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.$index }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="Main Information" align="center">
|
||||
<el-table-column label="Title">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.title }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="Author" width="110" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-tag>{{ scope.row.author }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="Readings" width="115" align="center">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.pageviews }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="Date" width="220">
|
||||
<template slot-scope="scope">
|
||||
<i class="el-icon-time" />
|
||||
<span>{{ scope.row.timestamp | parseTime('{y}-{m}-{d} {h}:{i}') }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { fetchList } from '@/api/article'
|
||||
import { parseTime } from '@/utils'
|
||||
|
||||
export default {
|
||||
name: 'MergeHeader',
|
||||
data() {
|
||||
return {
|
||||
list: null,
|
||||
listLoading: true,
|
||||
downloadLoading: false
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
fetchList(this.listQuery).then(response => {
|
||||
this.list = response.data.items
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
handleDownload() {
|
||||
this.downloadLoading = true
|
||||
import('@/vendor/Export2Excel').then(excel => {
|
||||
const multiHeader = [['Id', 'Main Information', '', '', 'Date']]
|
||||
const header = ['', 'Title', 'Author', 'Readings', '']
|
||||
const filterVal = ['id', 'title', 'author', 'pageviews', 'display_time']
|
||||
const list = this.list
|
||||
const data = this.formatJson(filterVal, list)
|
||||
const merges = ['A1:A2', 'B1:D1', 'E1:E2']
|
||||
excel.export_json_to_excel({
|
||||
multiHeader,
|
||||
header,
|
||||
merges,
|
||||
data
|
||||
})
|
||||
this.downloadLoading = false
|
||||
})
|
||||
},
|
||||
formatJson(filterVal, jsonData) {
|
||||
return jsonData.map(v => filterVal.map(j => {
|
||||
if (j === 'timestamp') {
|
||||
return parseTime(v[j])
|
||||
} else {
|
||||
return v[j]
|
||||
}
|
||||
}))
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -1,107 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-input v-model="filename" placeholder="Please enter the file name (default excel-list)" style="width:350px;" prefix-icon="el-icon-document" />
|
||||
<el-button :loading="downloadLoading" style="margin-bottom:20px" type="primary" icon="el-icon-document" @click="handleDownload">
|
||||
Export Selected Items
|
||||
</el-button>
|
||||
<a href="https://panjiachen.github.io/vue-element-admin-site/feature/component/excel.html" target="_blank" style="margin-left:15px;">
|
||||
<el-tag type="info">Documentation</el-tag>
|
||||
</a>
|
||||
<el-table
|
||||
ref="multipleTable"
|
||||
v-loading="listLoading"
|
||||
:data="list"
|
||||
element-loading-text="拼命加载中"
|
||||
border
|
||||
fit
|
||||
highlight-current-row
|
||||
@selection-change="handleSelectionChange"
|
||||
>
|
||||
<el-table-column type="selection" align="center" />
|
||||
<el-table-column align="center" label="Id" width="95">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.$index }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="Title">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.title }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="Author" width="110" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-tag>{{ scope.row.author }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="Readings" width="115" align="center">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.pageviews }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="PDate" width="220">
|
||||
<template slot-scope="scope">
|
||||
<i class="el-icon-time" />
|
||||
<span>{{ scope.row.display_time }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { fetchList } from '@/api/article'
|
||||
|
||||
export default {
|
||||
name: 'SelectExcel',
|
||||
data() {
|
||||
return {
|
||||
list: null,
|
||||
listLoading: true,
|
||||
multipleSelection: [],
|
||||
downloadLoading: false,
|
||||
filename: ''
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
fetchList(this.listQuery).then(response => {
|
||||
this.list = response.data.items
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
handleSelectionChange(val) {
|
||||
this.multipleSelection = val
|
||||
},
|
||||
handleDownload() {
|
||||
if (this.multipleSelection.length) {
|
||||
this.downloadLoading = true
|
||||
import('@/vendor/Export2Excel').then(excel => {
|
||||
const tHeader = ['Id', 'Title', 'Author', 'Readings', 'Date']
|
||||
const filterVal = ['id', 'title', 'author', 'pageviews', 'display_time']
|
||||
const list = this.multipleSelection
|
||||
const data = this.formatJson(filterVal, list)
|
||||
excel.export_json_to_excel({
|
||||
header: tHeader,
|
||||
data,
|
||||
filename: this.filename
|
||||
})
|
||||
this.$refs.multipleTable.clearSelection()
|
||||
this.downloadLoading = false
|
||||
})
|
||||
} else {
|
||||
this.$message({
|
||||
message: 'Please select at least one item',
|
||||
type: 'warning'
|
||||
})
|
||||
}
|
||||
},
|
||||
formatJson(filterVal, jsonData) {
|
||||
return jsonData.map(v => filterVal.map(j => v[j]))
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -1,42 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<upload-excel-component :on-success="handleSuccess" :before-upload="beforeUpload" />
|
||||
<el-table :data="tableData" border highlight-current-row style="width: 100%;margin-top:20px;">
|
||||
<el-table-column v-for="item of tableHeader" :key="item" :prop="item" :label="item" />
|
||||
</el-table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import UploadExcelComponent from '@/components/UploadExcel/index.vue'
|
||||
|
||||
export default {
|
||||
name: 'UploadExcel',
|
||||
components: { UploadExcelComponent },
|
||||
data() {
|
||||
return {
|
||||
tableData: [],
|
||||
tableHeader: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
beforeUpload(file) {
|
||||
const isLt1M = file.size / 1024 / 1024 < 1
|
||||
|
||||
if (isLt1M) {
|
||||
return true
|
||||
}
|
||||
|
||||
this.$message({
|
||||
message: 'Please do not upload files larger than 1m in size.',
|
||||
type: 'warning'
|
||||
})
|
||||
return false
|
||||
},
|
||||
handleSuccess({ results, header }) {
|
||||
this.tableData = results
|
||||
this.tableHeader = header
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -1,36 +0,0 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
export default {
|
||||
getDept(pageSize, pageNo) {
|
||||
return request({
|
||||
url: `/commonAction.do?eventcode=query_data&funid=queryevent&pagetype=editgrid&query_funid=sys_dept&user_id=administrator`,
|
||||
method: 'post',
|
||||
data: `start=${pageNo}&limit=${pageSize}&where_sql=&where_value=&where_type=&is_query=1&query_type=0`
|
||||
}).then(response => response.data)
|
||||
},
|
||||
Crerte(data) {
|
||||
return request({
|
||||
url: `/commonAction.do`,
|
||||
method: 'post',
|
||||
data: `${data}`
|
||||
}).then(response => response.data)
|
||||
},
|
||||
auditSave(data) {
|
||||
return request({
|
||||
url: `/commonAction.do`,
|
||||
method: 'post',
|
||||
data: `${data}`
|
||||
}).then(response => response.data)
|
||||
},
|
||||
Delete(ids) {
|
||||
let keys = ''
|
||||
ids.forEach(d => {
|
||||
keys += 'keyid=' + d + '&'
|
||||
})
|
||||
return request({
|
||||
url: `/commonAction.do`,
|
||||
method: 'post',
|
||||
data: `funid=sys_dept&${keys}pagetype=editgrid&eventcode=delete_eg&user_id=administrator&dataType=json`
|
||||
}).then(response => response.data)
|
||||
}
|
||||
}
|
||||
@ -1,92 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-card>
|
||||
<el-form ref="auditForm" :model="form" :rules="rules">
|
||||
<el-form-item label="所属部门" :label-width="formLabelWidth">
|
||||
<el-select v-model="id" placeholder="请选择" disabled>
|
||||
<el-option
|
||||
v-for="item in data"
|
||||
:key="item.sys_dept__dept_id"
|
||||
:label="item.sys_dept__dept_name"
|
||||
:value="item.sys_dept__dept_id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="部门编码" :label-width="formLabelWidth" prop="sys_dept__dept_code">
|
||||
<el-input v-model="form.sys_dept__dept_code" @change="change" />
|
||||
</el-form-item>
|
||||
<el-form-item label="部门名称" :label-width="formLabelWidth" prop="sys_dept__dept_name">
|
||||
<el-input v-model="form.sys_dept__dept_name" @change="change" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" :label-width="formLabelWidth" prop="sys_dept__memo">
|
||||
<el-input v-model="form.sys_dept__memo" @change="change" />
|
||||
</el-form-item>
|
||||
<el-form-item label="是否注销" :label-width="formLabelWidth">
|
||||
<el-select v-model="form.sys_dept__is_novalid" placeholder="请选择" @change="change">
|
||||
<el-option
|
||||
v-for="item in novalid"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
id: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
data: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
},
|
||||
auditForm: {
|
||||
type: Object,
|
||||
default: () => {}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
novalid: [
|
||||
{
|
||||
value: '0',
|
||||
label: '否'
|
||||
}, {
|
||||
value: '1',
|
||||
label: '是'
|
||||
}
|
||||
],
|
||||
rules: {
|
||||
sys_dept__dept_code: [
|
||||
{ required: true, message: '请输入部门编码', trigger: 'blur' }
|
||||
],
|
||||
sys_dept__dept_name: [
|
||||
{ required: true, message: '请输入部门名称', trigger: 'blur' }
|
||||
|
||||
]
|
||||
},
|
||||
formLabelWidth: '120px',
|
||||
form: {}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.form = JSON.parse(JSON.stringify(this.auditForm))
|
||||
},
|
||||
methods: {
|
||||
change() {
|
||||
this.$emit('change', this.form)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
@ -1,299 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<buttons funid="sys_dept" @editCreate="editCreate" @editDelete="editDelete" @editSave="editSave" @upload="upload" />
|
||||
<el-card>
|
||||
<el-table
|
||||
ref="deptTable"
|
||||
v-loading="loading"
|
||||
:data="data"
|
||||
style="width: 100%"
|
||||
@selection-change="handleSelectionChange"
|
||||
@cell-dblclick="cellDblclick"
|
||||
>
|
||||
<template v-for="(d,i) in tableHeader">
|
||||
<el-table-column v-if="d.type && d.type === 'selection'" :key="i" :type="d.type" :fixed="d.fixed" />
|
||||
<el-table-column
|
||||
v-else
|
||||
:key="i"
|
||||
:prop="d.prop"
|
||||
:label="d.label"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<div v-if="d.label==='是否注销'">
|
||||
{{
|
||||
scope.row.sys_dept__is_novalid == 0 ? '否' : '是'
|
||||
}}
|
||||
</div>
|
||||
<div v-else-if="d.label === '操作'">
|
||||
<el-button icon="el-icon-view" type="text" title="编辑" @click="edit(scope.row)" />
|
||||
<el-button v-if="scope.row.status !== 'NULLIFY'" icon="el-icon-delete" style="color:#F56C6C" type="text" title="删除" @click="Delete(scope.row)" />
|
||||
</div>
|
||||
<div v-else>{{ scope.row[d.prop] }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</template>
|
||||
</el-table>
|
||||
<el-pagination
|
||||
:current-page="pager.pageNo"
|
||||
:page-sizes="[10, 30, 50, 100, 500]"
|
||||
:page-size="pager.pageSize"
|
||||
:total="pager.total"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
@size-change="sizeChange"
|
||||
@current-change="pageChange"
|
||||
/>
|
||||
</el-card>
|
||||
<el-dialog v-if="dialogFormVisible" title="新增部门" :visible.sync="dialogFormVisible" @close="closeDialog">
|
||||
<el-form ref="form" :model="form" :rules="rules">
|
||||
<el-form-item label="所属部门" :label-width="formLabelWidth">
|
||||
<el-select v-model="dept_id" placeholder="请选择">
|
||||
<el-option
|
||||
v-for="item in data"
|
||||
:key="item.sys_dept__dept_id"
|
||||
:label="item.sys_dept__dept_name"
|
||||
:value="item.sys_dept__dept_id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="部门编码" :label-width="formLabelWidth" prop="dept_code">
|
||||
<el-input v-model="form.dept_code" />
|
||||
</el-form-item>
|
||||
<el-form-item label="部门名称" :label-width="formLabelWidth" prop="dept_name">
|
||||
<el-input v-model="form.dept_name" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" :label-width="formLabelWidth" prop="memo">
|
||||
<el-input v-model="form.memo" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogFormVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="create">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
<el-dialog v-if="dialogEditVisible" title="部门" :visible.sync="dialogEditVisible" @close="closeDialog">
|
||||
<AdutiDept :id="parent_id" ref="auditForm" :audit-form="auditForm" :data="data" @change="auditFormChange" />
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogEditVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="save">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import api from './api'
|
||||
import buttons from '@/components/Buttons'
|
||||
import AdutiDept from './components/auditDept'
|
||||
export default {
|
||||
name: 'Guide',
|
||||
components: {
|
||||
buttons,
|
||||
AdutiDept
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
data: [],
|
||||
ids: [],
|
||||
pager: {
|
||||
pageNo: 0,
|
||||
pageSize: 10,
|
||||
total: 0
|
||||
},
|
||||
tableHeader: [
|
||||
{
|
||||
prop: 'selection',
|
||||
type: 'selection',
|
||||
fixed: 'left'
|
||||
}, {
|
||||
prop: 'sys_dept__dept_code',
|
||||
label: '组织编码'
|
||||
}, {
|
||||
prop: 'sys_dept__dept_name',
|
||||
label: '组织名称'
|
||||
}, {
|
||||
prop: 'sys_dept__memo',
|
||||
label: '备注'
|
||||
}, {
|
||||
prop: 'sys_dept__is_novalid',
|
||||
label: '是否注销'
|
||||
},
|
||||
{
|
||||
prop: 'opration',
|
||||
label: '操作',
|
||||
width: '70px',
|
||||
fixed: 'right',
|
||||
minWidth: '70px',
|
||||
show: true
|
||||
}],
|
||||
value: '',
|
||||
dept_id: '',
|
||||
id: '',
|
||||
parent_id: '',
|
||||
form: {
|
||||
dept_name: '',
|
||||
dept_code: '',
|
||||
memo: ''
|
||||
},
|
||||
rules: {
|
||||
dept_code: [
|
||||
{ required: true, message: '请输入部门编码', trigger: 'blur' }
|
||||
],
|
||||
dept_name: [
|
||||
{ required: true, message: '请输入部门名称', trigger: 'blur' }
|
||||
|
||||
]
|
||||
},
|
||||
dialogFormVisible: false,
|
||||
dialogEditVisible: false,
|
||||
formLabelWidth: '120px',
|
||||
auditForm: {},
|
||||
saveFrom: {}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
this.loading = true
|
||||
let pageNo = this.pager.pageNo * this.pager.pageSize - this.pager.pageSize
|
||||
if (pageNo < 0) {
|
||||
pageNo = 0
|
||||
}
|
||||
api.getDept(
|
||||
this.pager.pageSize,
|
||||
pageNo
|
||||
).then(data => {
|
||||
if (data.success) {
|
||||
this.data = data.data.root
|
||||
this.pager.total = data.data.total
|
||||
setTimeout(() => {
|
||||
this.loading = false
|
||||
}, 200)
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
editCreate() {
|
||||
if (this.ids === null) {
|
||||
this.$message.warning('请选择一个组织再添加下属组织')
|
||||
} else if (this.ids.length !== 1) {
|
||||
this.$message.warning('请选择一个组织再添加下属组织')
|
||||
} else {
|
||||
this.dialogFormVisible = true
|
||||
this.dept_id = this.ids[0]
|
||||
}
|
||||
},
|
||||
create() {
|
||||
this.$refs['form'].validate((valid) => {
|
||||
if (valid) {
|
||||
const data = `funid= sys_dept&parentId= ${this.dept_id}&levelCol= sys_dept.dept_level&keyid= &pagetype= editgrid&eventcode= save_eg&sys_dept__dept_code= ${this.form.dept_code}&sys_dept__dept_name= ${this.form.dept_name}&sys_dept__memo= ${this.form.memo}&sys_dept__is_novalid= 0&sys_dept__dept_id= &sys_dept__dept_level= &user_id= administrator&dataType= json`
|
||||
api.Crerte(data).then(data => {
|
||||
if (data.success) {
|
||||
this.getList()
|
||||
this.dialogFormVisible = false
|
||||
this.$refs['form'].resetFields()
|
||||
this.form.dept_name = ''
|
||||
this.form.dept_code = ''
|
||||
this.$message.success('新增成功！')
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
Delete(row) {
|
||||
this.ids = []
|
||||
this.ids.push(row.sys_dept__dept_id)
|
||||
this.editDelete()
|
||||
},
|
||||
editDelete() {
|
||||
if (this.ids && this.ids.length > 0) {
|
||||
this.$confirm('确认删除部门？').then(() => {
|
||||
api.Delete(this.ids).then(data => {
|
||||
if (data.success) {
|
||||
this.getList()
|
||||
this.$message.success('删除成功！')
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
}).catch(() => {})
|
||||
} else {
|
||||
this.$message.warning('请选择数据进行删除')
|
||||
}
|
||||
},
|
||||
editSave() {
|
||||
console.log('editSave')
|
||||
},
|
||||
upload() {
|
||||
console.log('upload')
|
||||
},
|
||||
edit(row) {
|
||||
this.id = row.sys_dept__dept_id
|
||||
this.parent_id = this.id.substring(0, this.id.length - 4)
|
||||
console.log(this.parent_id, this.id)
|
||||
this.auditForm = row
|
||||
this.dialogEditVisible = true
|
||||
},
|
||||
auditFormChange(form) {
|
||||
this.saveFrom = form
|
||||
},
|
||||
save() {
|
||||
console.log(this.saveFrom, 'this.saveFrom')
|
||||
console.log(this.auditForm, 'this.auditForm')
|
||||
if (Object.keys(this.saveFrom).length === 0) {
|
||||
this.saveFrom = this.auditForm
|
||||
}
|
||||
this.$refs.auditForm.$refs.auditForm.validate(valid => {
|
||||
if (valid) {
|
||||
const _form = `funid=sys_dept&parentId=&levelCol=sys_dept.dept_level&keyid=${this.id}&pagetype=editgrid&eventcode=save_eg&sys_dept__dept_code=${this.saveFrom.sys_dept__dept_code}&sys_dept__dept_name=${this.saveFrom.sys_dept__dept_name}&sys_dept__memo=${this.saveFrom.sys_dept__memo}&sys_dept__is_novalid=${this.saveFrom.sys_dept__is_novalid}&sys_dept__dept_id=${this.id}&sys_dept__dept_level=3&user_id=administrator&dataType=json`
|
||||
api.auditSave(_form).then(data => {
|
||||
if (data.success) {
|
||||
this.getList()
|
||||
this.$message.success('保存成功！')
|
||||
this.dialogEditVisible = false
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
cellDblclick(row) {
|
||||
console.log(row, 'row')
|
||||
this.id = row.sys_dept__dept_id
|
||||
this.auditForm = row
|
||||
this.saveFrom = []
|
||||
this.dialogEditVisible = true
|
||||
},
|
||||
sizeChange(size) {
|
||||
this.pager.pageSize = size
|
||||
this.getList()
|
||||
},
|
||||
pageChange(page) {
|
||||
this.pager.pageNo = page
|
||||
this.getList()
|
||||
},
|
||||
handleSelectionChange(val) {
|
||||
this.ids = val.map(d => d.sys_dept__dept_id)
|
||||
},
|
||||
closeDialog() {
|
||||
this.dialogFormVisible = false
|
||||
this.$refs['form'].resetFields()
|
||||
this.form.dept_name = ''
|
||||
this.form.dept_code = ''
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.el-card {
|
||||
margin-top: 10px;
|
||||
}
|
||||
</style>
|
||||
@ -1,53 +0,0 @@
|
||||
const steps = [
|
||||
{
|
||||
element: '#hamburger-container',
|
||||
popover: {
|
||||
title: 'Hamburger',
|
||||
description: 'Open && Close sidebar',
|
||||
position: 'bottom'
|
||||
}
|
||||
},
|
||||
{
|
||||
element: '#breadcrumb-container',
|
||||
popover: {
|
||||
title: 'Breadcrumb',
|
||||
description: 'Indicate the current page location',
|
||||
position: 'bottom'
|
||||
}
|
||||
},
|
||||
{
|
||||
element: '#header-search',
|
||||
popover: {
|
||||
title: 'Page Search',
|
||||
description: 'Page search, quick navigation',
|
||||
position: 'left'
|
||||
}
|
||||
},
|
||||
{
|
||||
element: '#screenfull',
|
||||
popover: {
|
||||
title: 'Screenfull',
|
||||
description: 'Set the page into fullscreen',
|
||||
position: 'left'
|
||||
}
|
||||
},
|
||||
{
|
||||
element: '#size-select',
|
||||
popover: {
|
||||
title: 'Switch Size',
|
||||
description: 'Switch the system size',
|
||||
position: 'left'
|
||||
}
|
||||
},
|
||||
{
|
||||
element: '#tags-view-container',
|
||||
popover: {
|
||||
title: 'Tags view',
|
||||
description: 'The history of the page you visited',
|
||||
position: 'bottom'
|
||||
},
|
||||
padding: 0
|
||||
}
|
||||
]
|
||||
|
||||
export default steps
|
||||
63
src/views/hidden_check/api/index.js
Normal file
63
src/views/hidden_check/api/index.js
Normal file
@ -0,0 +1,63 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
export default {
|
||||
getDate(pageSize, pageNo, isWhereSql, whereValue) {
|
||||
let whereSql = ''
|
||||
let whereType = ''
|
||||
if (isWhereSql) {
|
||||
whereSql = `dept_id like ?`
|
||||
whereType = 'string'
|
||||
}
|
||||
return request({
|
||||
url: `commonAction.do?eventcode=query_data&funid=queryevent&pagetype=grid&query_funid=hidden_check&user_id=administrator`,
|
||||
method: 'post',
|
||||
data: `start=${pageNo}&limit=${pageSize}&where_sql=${whereSql}&where_value=${whereValue}&where_type=${whereType}&is_query=1&query_type=0`
|
||||
}).then(response => response.data)
|
||||
},
|
||||
getDeptTree() {
|
||||
return request({
|
||||
url: `/commonAction.do?eventcode=query_data&funid=queryevent&pagetype=editgrid&query_funid=sys_dept&user_id=administrator`,
|
||||
method: 'post',
|
||||
data: `start=0&limit=10000&where_sql=&where_value=&where_type=&is_query=1&query_type=0`
|
||||
}).then(response => response.data)
|
||||
},
|
||||
Crerte(data) {
|
||||
return request({
|
||||
url: `/commonAction.do`,
|
||||
method: 'post',
|
||||
data: `funid=hidden_check&keyid=${data.hidden_danger__hidden_danger_id}&hidden_danger__hidden_code=${data.hidden_danger__hidden_code}&hidden_danger__hidden_state=${data.hidden_danger__hidden_state}&hidden_danger__check_man=${data.hidden_danger__check_man}&hidden_danger__check_dept=${data.hidden_danger__check_dept}&hidden_danger__check_date=${data.hidden_danger__check_date}&hidden_danger__check_location=${data.hidden_danger__check_location}&hidden_danger__check_content=${data.hidden_danger__check_content}&hidden_danger__check_problem=${data.hidden_danger__check_problem}&hidden_danger__org_id=${data.hidden_danger__org_id}&hidden_danger__insp_det_id=${data.hidden_danger__insp_det_id}&hidden_danger__dept_id=${data.hidden_danger__dept_id}&hidden_danger__hidden_danger_id=${data.hidden_danger__hidden_danger_id}&hidden_danger__reform_man=${data.hidden_danger__reform_man}&hidden_danger__reform_dept=${data.hidden_danger__reform_dept}&hidden_danger__reform_limit=${data.hidden_danger__reform_limit}&hidden_danger__check_photo=${data.hidden_danger__check_photo}&hidden_danger__more_flag=${data.hidden_danger__more_flag}&hidden_danger__check_man_id=${data.hidden_danger__check_man_id}&hidden_danger__check_dept_id=${data.hidden_danger__check_dept_id}&hidden_danger__reform_dept_id=${data.hidden_danger__reform_dept_id}&hidden_danger__reform_man_id=${data.hidden_danger__reform_man_id}&hidden_danger__safe_insp_id=${data.hidden_danger__safe_insp_id}&pagetype=form&eventcode=create&fkValue=&user_id=administrator&dataType=json`
|
||||
}).then(response => response.data)
|
||||
},
|
||||
Save(data) {
|
||||
return request({
|
||||
url: `/commonAction.do`,
|
||||
method: 'post',
|
||||
data: `funid=hidden_check&keyid=${data.hidden_danger__hidden_danger_id}&hidden_danger__hidden_code=${data.hidden_danger__hidden_code}&hidden_danger__hidden_state=${data.hidden_danger__hidden_state}&hidden_danger__check_man=${data.hidden_danger__check_man}&hidden_danger__check_dept=${data.hidden_danger__check_dept}&hidden_danger__check_date=${data.hidden_danger__check_date}&hidden_danger__check_location=${data.hidden_danger__check_location}&hidden_danger__check_content=${data.hidden_danger__check_content}&hidden_danger__check_problem=${data.hidden_danger__check_problem}&hidden_danger__org_id=${data.hidden_danger__org_id}&hidden_danger__insp_det_id=${data.hidden_danger__insp_det_id}&hidden_danger__dept_id=${data.hidden_danger__dept_id}&hidden_danger__hidden_danger_id=${data.hidden_danger__hidden_danger_id}&hidden_danger__reform_man=${data.hidden_danger__reform_man}&hidden_danger__reform_dept=${data.hidden_danger__reform_dept}&hidden_danger__reform_limit=${data.hidden_danger__reform_limit}&hidden_danger__check_photo=${data.hidden_danger__check_photo}&hidden_danger__more_flag=${data.hidden_danger__more_flag}&hidden_danger__check_man_id=${data.hidden_danger__check_man_id}&hidden_danger__check_dept_id=${data.hidden_danger__check_dept_id}&hidden_danger__reform_dept_id=${data.hidden_danger__reform_dept_id}&hidden_danger__reform_man_id=${data.hidden_danger__reform_man_id}&hidden_danger__safe_insp_id=${data.hidden_danger__safe_insp_id}&pagetype=form&eventcode=save&dirtyfields=hidden_danger.check_man;hidden_danger.reform_man;hidden_danger.reform_dept;hidden_danger.check_dept;hidden_danger.check_date;hidden_danger.check_location;hidden_danger.check_content;hidden_danger.check_problem;hidden_danger.dept_id;hidden_danger.reform_dept_id;hidden_danger.reform_limit;hidden_danger.check_dept_id;hidden_danger.check_man_id;hidden_danger.reform_man_id&fkValue=&user_id=administrator&dataType=json`
|
||||
}).then(response => response.data)
|
||||
},
|
||||
auditSave(data) {
|
||||
return request({
|
||||
url: `/commonAction.do`,
|
||||
method: 'post',
|
||||
data: `${data}`
|
||||
}).then(response => response.data)
|
||||
},
|
||||
Delete(ids) {
|
||||
let keys = ''
|
||||
ids.forEach(d => {
|
||||
keys += 'keyid=' + d + '&'
|
||||
})
|
||||
return request({
|
||||
url: `/commonAction.do`,
|
||||
method: 'post',
|
||||
data: `funid=hidden_check&${keys}pagetype=editgrid&eventcode=delete&user_id=administrator&dataType=json`
|
||||
}).then(response => response.data)
|
||||
},
|
||||
getFormDate(id) {
|
||||
return request({
|
||||
url: `/commonAction.do?eventcode=query_data&funid=queryevent&pagetype=grid&query_funid=hidden_check&user_id=administrator`,
|
||||
method: 'post',
|
||||
data: `start=0&limit=10&where_sql=hidden_danger.hidden_danger_id = ?&where_value=${id}&where_type=string&is_query=1&query_type=0`
|
||||
}).then(response => response.data)
|
||||
}
|
||||
}
|
||||
344
src/views/hidden_check/components/create/index.vue
Normal file
344
src/views/hidden_check/components/create/index.vue
Normal file
@ -0,0 +1,344 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-card>
|
||||
<buttons funid="hidden_check" style="margin-bottom:20px" @save="save" />
|
||||
<el-form ref="form" :model="form" label-width="80px" :rules="rules">
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="隐患编号">
|
||||
<el-input v-model="form.hidden_danger__hidden_code" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="巡检状态">
|
||||
<el-select v-model="form.hidden_danger__hidden_state" placeholder="请选择" :disabled="!disabled">
|
||||
<el-option
|
||||
v-for="item in hiddenState"
|
||||
:key="item.funall_control__value_data"
|
||||
:label="item.funall_control__display_data"
|
||||
:value="item.funall_control__value_data"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="检查人">
|
||||
<el-input v-model="form.hidden_danger__check_man" placeholder="请选择检查人" class="input-with-select" clearable>
|
||||
<el-button slot="append" icon="el-icon-search" @click="checkManVisible = !checkManVisible" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="检查部门">
|
||||
<el-input v-model="form.hidden_danger__check_dept" placeholder="请选择检查部门" class="input-with-select" clearable>
|
||||
<el-button slot="append" icon="el-icon-search" @click="checkDeptVisible = !checkDeptVisible" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="检查时间">
|
||||
<el-date-picker
|
||||
v-model="form.hidden_danger__check_date"
|
||||
type="date"
|
||||
placeholder="选择日期"
|
||||
style="width: 100%;"
|
||||
format="yyyy-MM-dd"
|
||||
value-format="yyyy-MM-dd"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="检查地点">
|
||||
<el-input v-model="form.hidden_danger__check_location" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="检查内容">
|
||||
<el-input v-model="form.hidden_danger__check_content" type="textarea" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="隐患描述" prop="hidden_danger__check_problem">
|
||||
<el-input v-model="form.hidden_danger__check_problem" type="textarea" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="整改人">
|
||||
<el-input v-model="form.hidden_danger__reform_man" placeholder="请选择整改人" class="input-with-select" clearable>
|
||||
<el-button slot="append" icon="el-icon-search" @click="reformManVisible = !reformManVisible" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="整改部门">
|
||||
<el-input v-model="form.hidden_danger__reform_dept" placeholder="请选择检查部门" class="input-with-select" clearable>
|
||||
<el-button slot="append" icon="el-icon-search" @click="reformDeptVisible = !reformDeptVisible" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="整改期限">
|
||||
<el-date-picker
|
||||
v-model="form.hidden_danger__reform_limit"
|
||||
type="date"
|
||||
placeholder="选择日期"
|
||||
style="width: 100%;"
|
||||
format="yyyy-MM-dd"
|
||||
value-format="yyyy-MM-dd"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</el-card>
|
||||
<el-dialog
|
||||
v-if="checkManVisible"
|
||||
title="选择人员"
|
||||
:visible.sync="checkManVisible"
|
||||
width="60%"
|
||||
>
|
||||
<SelUser ref="CheckMan" @updateUser="getCheckMan" />
|
||||
<span>
|
||||
<el-button @click="checkManVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="selCheckMan">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
v-if="reformManVisible"
|
||||
title="选择人员"
|
||||
:visible.sync="reformManVisible"
|
||||
width="60%"
|
||||
>
|
||||
<SelUser ref="ReformMan" @updateUser="getReformMan" />
|
||||
<span>
|
||||
<el-button @click="reformManVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="selReformMan">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
v-if="checkDeptVisible"
|
||||
class="selDept"
|
||||
title="选择部门"
|
||||
:visible.sync="checkDeptVisible"
|
||||
width="60%"
|
||||
:modal="false"
|
||||
>
|
||||
<SelDept ref="CheckDept" @updateDept="getCheckDept" />
|
||||
<span>
|
||||
<el-button @click="checkDeptVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="selCheckDept">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
v-if="reformDeptVisible"
|
||||
class="selDept"
|
||||
title="选择部门"
|
||||
:visible.sync="reformDeptVisible"
|
||||
width="60%"
|
||||
:modal="false"
|
||||
>
|
||||
<SelDept ref="ReformDept" @updateDept="getReformDept" />
|
||||
<span>
|
||||
<el-button @click="reformDeptVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="selReformDept">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import api from '../../api'
|
||||
import publicApi from '@/api/public'
|
||||
import buttons from '@/components/formBtn'
|
||||
import SelUser from '@/components/selUser'
|
||||
import SelDept from '@/components/selDept'
|
||||
export default {
|
||||
name: 'AuditForm',
|
||||
components: {
|
||||
buttons,
|
||||
SelUser,
|
||||
SelDept
|
||||
},
|
||||
// props: {
|
||||
// id: { type: String, default: () => '' }
|
||||
// },
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
form: {
|
||||
hidden_danger__hidden_code: '',
|
||||
hidden_danger__hidden_state: '1',
|
||||
hidden_danger__check_man: '',
|
||||
hidden_danger__check_dept: '',
|
||||
hidden_danger__check_date: '',
|
||||
hidden_danger__check_location: '',
|
||||
hidden_danger__check_content: '',
|
||||
hidden_danger__check_problem: '',
|
||||
hidden_danger__reform_man: '',
|
||||
hidden_danger__reform_dept: '',
|
||||
hidden_danger__reform_limit: '',
|
||||
hidden_danger__check_photo: '',
|
||||
hidden_danger__more_flag: '',
|
||||
hidden_danger__safe_insp_id: '',
|
||||
hidden_danger__reform_man_id: '',
|
||||
hidden_danger__reform_dept_id: '',
|
||||
hidden_danger__org_id: '',
|
||||
hidden_danger__insp_det_id: '',
|
||||
hidden_danger__hidden_danger_id: '',
|
||||
hidden_danger__dept_id: '',
|
||||
hidden_danger__check_man_id: '',
|
||||
hidden_danger__check_dept_id: ''
|
||||
},
|
||||
rules: {
|
||||
hidden_danger__check_problem: [
|
||||
{ required: true, message: '请输入隐患描述', trigger: 'blur' }
|
||||
]
|
||||
},
|
||||
inspName: [],
|
||||
disabled: false,
|
||||
options: [],
|
||||
checkManVisible: false,
|
||||
reformManVisible: false,
|
||||
checkDeptVisible: false,
|
||||
reformDeptVisible: false,
|
||||
inspNameVisible: false,
|
||||
id: '',
|
||||
hiddenState: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getHiddenState()
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
this.loading = true
|
||||
api.getFormDate().then(data => {
|
||||
if (data.success) {
|
||||
this.form = data.data.root[0]
|
||||
setTimeout(() => {
|
||||
this.loading = false
|
||||
}, 200)
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
async getHiddenState() {
|
||||
await publicApi.getTypeSel('hiddenstate').then(data => {
|
||||
if (data.success) {
|
||||
this.hiddenState = data.data.root
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
onSubmit() {},
|
||||
getCheckMan(data) {
|
||||
this.form.hidden_danger__check_man = data.sys_user__user_name
|
||||
this.form.hidden_danger__check_man_id = data.sys_user__user_id
|
||||
this.form.hidden_danger__check_dept = data.sys_dept__dept_name
|
||||
this.form.hidden_danger__check_dept_id = data.sys_user__dept_id
|
||||
this.checkManVisible = false
|
||||
},
|
||||
selCheckMan() {
|
||||
this.getCheckMans(this.$refs.CheckMan.Users)
|
||||
this.checkManVisible = false
|
||||
},
|
||||
getCheckMans(data) {
|
||||
this.form.hidden_danger__check_man = data.map(d => { return d.sys_user__user_name }).join(';')
|
||||
this.form.hidden_danger__check_man_id = data.map(d => { return d.sys_user__user_id }).join(';')
|
||||
this.form.hidden_danger__check_dept = data.map(d => { return d.sys_dept__dept_name }).join(';')
|
||||
this.form.hidden_danger__check_dept_id = data.map(d => { return d.sys_user__dept_id }).join(';')
|
||||
this.checkManVisible = false
|
||||
},
|
||||
getReformMan(data) {
|
||||
this.form.hidden_danger__reform_man = data.sys_user__user_name
|
||||
this.form.hidden_danger__reform_man_id = data.sys_user__user_id
|
||||
this.form.hidden_danger__reform_dept = data.sys_dept__dept_name
|
||||
this.form.hidden_danger__reform_dept_id = data.sys_user__dept_id
|
||||
this.reformManVisible = false
|
||||
},
|
||||
selReformMan() {
|
||||
this.getReformMans(this.$refs.ReformMan.Users)
|
||||
this.reformManVisible = false
|
||||
},
|
||||
getReformMans(data) {
|
||||
this.form.hidden_danger__reform_man = data.map(d => { return d.sys_user__user_name }).join(';')
|
||||
this.form.hidden_danger__reform_man_id = data.map(d => { return d.sys_user__user_id }).join(';')
|
||||
this.form.hidden_danger__reform_dept = data.map(d => { return d.sys_dept__dept_name }).join(';')
|
||||
this.form.hidden_danger__reform_dept_id = data.map(d => { return d.sys_user__dept_id }).join(';')
|
||||
this.reformManVisible = false
|
||||
},
|
||||
getCheckDept(data) {
|
||||
this.form.hidden_danger__check_dept = data.sys_dept__dept_name
|
||||
this.form.hidden_danger__check_dept_id = data.sys_dept__dept_id
|
||||
this.checkDeptVisible = false
|
||||
},
|
||||
selCheckDept() {
|
||||
this.CheckDepts(this.$refs.CheckDept.Dpets)
|
||||
},
|
||||
CheckDepts(data) {
|
||||
this.form.hidden_danger__check_dept = data.map(d => { return d.sys_dept__dept_name }).join(';')
|
||||
this.form.hidden_danger__check_dept_id = data.map(d => { return d.sys_dept__dept_id }).join(';')
|
||||
this.checkDeptVisible = false
|
||||
},
|
||||
getReformDept(data) {
|
||||
this.form.hidden_danger__reform_dept = data.sys_dept__dept_name
|
||||
this.form.hidden_danger__reform_dept_id = data.sys_dept__dept_id
|
||||
this.reformDeptVisible = false
|
||||
},
|
||||
selReformDept() {
|
||||
this.ReformDepts(this.$refs.ReformDept.Dpets)
|
||||
},
|
||||
ReformDepts(data) {
|
||||
this.form.hidden_danger__reform_dept = data.map(d => { return d.sys_dept__dept_name }).join(';')
|
||||
this.form.hidden_danger__reform_dept_id = data.map(d => { return d.sys_dept__dept_id }).join(';')
|
||||
this.reformDeptVisible = false
|
||||
},
|
||||
save() {
|
||||
this.$refs['form'].validate((valid) => {
|
||||
if (valid) {
|
||||
api.Crerte(this.form).then(data => {
|
||||
if (data.success) {
|
||||
this.$message.success('保存成功！')
|
||||
const param = `/hidden_danger/hidden_check/audit/${data.data.keyid}`
|
||||
this.$router.push(param)
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
back() {
|
||||
// this.$router__back(-1)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
::v-deep .el-dialog__body {
|
||||
padding: 10px 20px !important;
|
||||
}
|
||||
::v-deep .el-form-item__label {
|
||||
text-align: right;
|
||||
/* vertical-align: middle; */
|
||||
float: left;
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
line-height: 40px;
|
||||
padding: 0 6px 0 0;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.el-col{
|
||||
margin-left: 2%;
|
||||
}
|
||||
</style>
|
||||
344
src/views/hidden_check/components/edit_form/index.vue
Normal file
344
src/views/hidden_check/components/edit_form/index.vue
Normal file
@ -0,0 +1,344 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-card>
|
||||
<buttons funid="hidden_check" style="margin-bottom:20px" @save="save" />
|
||||
<el-form ref="form" :model="form" label-width="80px" :rules="rules">
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="隐患编号">
|
||||
<el-input v-model="form.hidden_danger__hidden_code" :disabled="!disabled" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="巡检状态">
|
||||
<el-select v-model="form.hidden_danger__hidden_state" placeholder="请选择" :disabled="!disabled">
|
||||
<el-option
|
||||
v-for="item in hiddenState"
|
||||
:key="item.funall_control__value_data"
|
||||
:label="item.funall_control__display_data"
|
||||
:value="item.funall_control__value_data"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="检查人">
|
||||
<el-input v-model="form.hidden_danger__check_man" placeholder="请选择检查人" class="input-with-select" clearable>
|
||||
<el-button slot="append" icon="el-icon-search" @click="checkManVisible = !checkManVisible" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="检查部门">
|
||||
<el-input v-model="form.hidden_danger__check_dept" placeholder="请选择检查部门" class="input-with-select" clearable>
|
||||
<el-button slot="append" icon="el-icon-search" @click="checkDeptVisible = !checkDeptVisible" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="检查时间">
|
||||
<el-date-picker
|
||||
v-model="form.hidden_danger__check_date"
|
||||
type="date"
|
||||
placeholder="选择日期"
|
||||
style="width: 100%;"
|
||||
format="yyyy-MM-dd"
|
||||
value-format="yyyy-MM-dd"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="检查地点">
|
||||
<el-input v-model="form.hidden_danger__check_location" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="检查内容">
|
||||
<el-input v-model="form.hidden_danger__check_content" type="textarea" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="隐患描述" prop="hidden_danger__check_problem">
|
||||
<el-input v-model="form.hidden_danger__check_problem" type="textarea" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="整改人">
|
||||
<el-input v-model="form.hidden_danger__reform_man" placeholder="请选择整改人" class="input-with-select" clearable>
|
||||
<el-button slot="append" icon="el-icon-search" @click="reformManVisible = !reformManVisible" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="整改部门">
|
||||
<el-input v-model="form.hidden_danger__reform_dept" placeholder="请选择检查部门" class="input-with-select" clearable>
|
||||
<el-button slot="append" icon="el-icon-search" @click="reformDeptVisible = !reformDeptVisible" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="整改期限">
|
||||
<el-date-picker
|
||||
v-model="form.hidden_danger__reform_limit"
|
||||
type="date"
|
||||
placeholder="选择日期"
|
||||
style="width: 100%;"
|
||||
format="yyyy-MM-dd"
|
||||
value-format="yyyy-MM-dd"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</el-card>
|
||||
<el-dialog
|
||||
v-if="checkManVisible"
|
||||
title="选择人员"
|
||||
:visible.sync="checkManVisible"
|
||||
width="60%"
|
||||
>
|
||||
<SelUser ref="CheckMan" @updateUser="getCheckMan" />
|
||||
<span>
|
||||
<el-button @click="checkManVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="selCheckMan">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
v-if="reformManVisible"
|
||||
title="选择人员"
|
||||
:visible.sync="reformManVisible"
|
||||
width="60%"
|
||||
>
|
||||
<SelUser ref="ReformMan" @updateUser="getReformMan" />
|
||||
<span>
|
||||
<el-button @click="reformManVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="selReformMan">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
v-if="checkDeptVisible"
|
||||
class="selDept"
|
||||
title="选择部门"
|
||||
:visible.sync="checkDeptVisible"
|
||||
width="60%"
|
||||
:modal="false"
|
||||
>
|
||||
<SelDept ref="CheckDept" @updateDept="getCheckDept" />
|
||||
<span>
|
||||
<el-button @click="checkDeptVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="selCheckDept">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
v-if="reformDeptVisible"
|
||||
class="selDept"
|
||||
title="选择部门"
|
||||
:visible.sync="reformDeptVisible"
|
||||
width="60%"
|
||||
:modal="false"
|
||||
>
|
||||
<SelDept ref="ReformDept" @updateDept="getReformDept" />
|
||||
<span>
|
||||
<el-button @click="reformDeptVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="selReformDept">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import api from '../../api'
|
||||
import publicApi from '@/api/public'
|
||||
import buttons from '@/components/formBtn'
|
||||
import SelUser from '@/components/selUser'
|
||||
import SelDept from '@/components/selDept'
|
||||
export default {
|
||||
name: 'AuditForm',
|
||||
components: {
|
||||
buttons,
|
||||
SelUser,
|
||||
SelDept
|
||||
},
|
||||
// props: {
|
||||
// id: { type: String, default: () => '' }
|
||||
// },
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
id: this.$route.params.id,
|
||||
form: {
|
||||
hidden_danger__hidden_code: '',
|
||||
hidden_danger__hidden_state: '1',
|
||||
hidden_danger__check_man: '',
|
||||
hidden_danger__check_dept: '',
|
||||
hidden_danger__check_date: '',
|
||||
hidden_danger__check_location: '',
|
||||
hidden_danger__check_content: '',
|
||||
hidden_danger__check_problem: '',
|
||||
hidden_danger__reform_man: '',
|
||||
hidden_danger__reform_dept: '',
|
||||
hidden_danger__reform_limit: '',
|
||||
hidden_danger__check_photo: '',
|
||||
hidden_danger__more_flag: '',
|
||||
hidden_danger__safe_insp_id: '',
|
||||
hidden_danger__reform_man_id: '',
|
||||
hidden_danger__reform_dept_id: '',
|
||||
hidden_danger__org_id: '',
|
||||
hidden_danger__insp_det_id: '',
|
||||
hidden_danger__hidden_danger_id: '',
|
||||
hidden_danger__dept_id: '',
|
||||
hidden_danger__check_man_id: '',
|
||||
hidden_danger__check_dept_id: ''
|
||||
},
|
||||
rules: {
|
||||
hidden_danger__check_problem: [
|
||||
{ required: true, message: '请输入隐患描述', trigger: 'blur' }
|
||||
]
|
||||
},
|
||||
inspName: [],
|
||||
disabled: false,
|
||||
options: [],
|
||||
checkManVisible: false,
|
||||
reformManVisible: false,
|
||||
checkDeptVisible: false,
|
||||
reformDeptVisible: false,
|
||||
hiddenState: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
this.getHiddenState()
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
this.loading = true
|
||||
api.getFormDate(this.id).then(data => {
|
||||
if (data.success) {
|
||||
this.form = data.data.root[0]
|
||||
setTimeout(() => {
|
||||
this.loading = false
|
||||
}, 200)
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
async getHiddenState() {
|
||||
await publicApi.getTypeSel('hiddenstate').then(data => {
|
||||
if (data.success) {
|
||||
this.hiddenState = data.data.root
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
onSubmit() {},
|
||||
getCheckMan(data) {
|
||||
this.form.hidden_danger__check_man = data.sys_user__user_name
|
||||
this.form.hidden_danger__check_man_id = data.sys_user__user_id
|
||||
this.form.hidden_danger__check_dept = data.sys_dept__dept_name
|
||||
this.form.hidden_danger__check_dept_id = data.sys_user__dept_id
|
||||
this.checkManVisible = false
|
||||
},
|
||||
selCheckMan() {
|
||||
this.getCheckMans(this.$refs.CheckMan.Users)
|
||||
this.checkManVisible = false
|
||||
},
|
||||
getCheckMans(data) {
|
||||
this.form.hidden_danger__check_man = data.map(d => { return d.sys_user__user_name }).join(';')
|
||||
this.form.hidden_danger__check_man_id = data.map(d => { return d.sys_user__user_id }).join(';')
|
||||
this.form.hidden_danger__check_dept = data.map(d => { return d.sys_dept__dept_name }).join(';')
|
||||
this.form.hidden_danger__check_dept_id = data.map(d => { return d.sys_user__dept_id }).join(';')
|
||||
this.checkManVisible = false
|
||||
},
|
||||
getReformMan(data) {
|
||||
this.form.hidden_danger__reform_man = data.sys_user__user_name
|
||||
this.form.hidden_danger__reform_man_id = data.sys_user__user_id
|
||||
this.form.hidden_danger__reform_dept = data.sys_dept__dept_name
|
||||
this.form.hidden_danger__reform_dept_id = data.sys_user__dept_id
|
||||
this.reformManVisible = false
|
||||
},
|
||||
selReformMan() {
|
||||
this.getReformMans(this.$refs.ReformMan.Users)
|
||||
this.reformManVisible = false
|
||||
},
|
||||
getReformMans(data) {
|
||||
this.form.hidden_danger__reform_man = data.map(d => { return d.sys_user__user_name }).join(';')
|
||||
this.form.hidden_danger__reform_man_id = data.map(d => { return d.sys_user__user_id }).join(';')
|
||||
this.form.hidden_danger__reform_dept = data.map(d => { return d.sys_dept__dept_name }).join(';')
|
||||
this.form.hidden_danger__reform_dept_id = data.map(d => { return d.sys_user__dept_id }).join(';')
|
||||
this.reformManVisible = false
|
||||
},
|
||||
getCheckDept(data) {
|
||||
this.form.hidden_danger__check_dept = data.sys_dept__dept_name
|
||||
this.form.hidden_danger__check_dept_id = data.sys_dept__dept_id
|
||||
this.checkDeptVisible = false
|
||||
},
|
||||
selCheckDept() {
|
||||
this.CheckDepts(this.$refs.CheckDept.Dpets)
|
||||
},
|
||||
CheckDepts(data) {
|
||||
this.form.hidden_danger__check_dept = data.map(d => { return d.sys_dept__dept_name }).join(';')
|
||||
this.form.hidden_danger__check_dept_id = data.map(d => { return d.sys_dept__dept_id }).join(';')
|
||||
this.checkDeptVisible = false
|
||||
},
|
||||
getReformDept(data) {
|
||||
this.form.hidden_danger__reform_dept = data.sys_dept__dept_name
|
||||
this.form.hidden_danger__reform_dept_id = data.sys_dept__dept_id
|
||||
this.reformDeptVisible = false
|
||||
},
|
||||
selReformDept() {
|
||||
this.ReformDepts(this.$refs.ReformDept.Dpets)
|
||||
},
|
||||
ReformDepts(data) {
|
||||
this.form.hidden_danger__reform_dept = data.map(d => { return d.sys_dept__dept_name }).join(';')
|
||||
this.form.hidden_danger__reform_dept_id = data.map(d => { return d.sys_dept__dept_id }).join(';')
|
||||
this.reformDeptVisible = false
|
||||
},
|
||||
save() {
|
||||
this.$refs['form'].validate((valid) => {
|
||||
if (valid) {
|
||||
api.Save(this.form).then(data => {
|
||||
if (data.success) {
|
||||
this.$message.success('保存成功！')
|
||||
// const param = `/insp/edit_form/audit/${data.data.keyid}`
|
||||
// this.$router__push(param)
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
back() {
|
||||
// this.$router__back(-1)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
::v-deep .el-dialog__body {
|
||||
padding: 10px 20px !important;
|
||||
}
|
||||
::v-deep .el-form-item__label {
|
||||
text-align: right;
|
||||
/* vertical-align: middle; */
|
||||
float: left;
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
line-height: 40px;
|
||||
padding: 0 6px 0 0;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.el-col{
|
||||
margin-left: 2%;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,257 @@
|
||||
<template>
|
||||
<div>
|
||||
<buttons funid="hidden_check" style="margin:10px 10px" @Create="editCreate" @Del="editDelete" @editSave="editSave" @upload="upload" />
|
||||
<el-card>
|
||||
<el-table
|
||||
ref="deptTable"
|
||||
v-loading="loading"
|
||||
:data="data"
|
||||
style="width: 100%"
|
||||
@selection-change="handleSelectionChange"
|
||||
@cell-dblclick="cellDblclick"
|
||||
>
|
||||
<template v-for="(d,i) in tableHeader">
|
||||
<el-table-column v-if="d.type && d.type === 'selection'" :key="i" :type="d.type" :fixed="d.fixed" />
|
||||
<el-table-column
|
||||
v-else
|
||||
:key="i"
|
||||
:prop="d.prop"
|
||||
:label="d.label"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<div v-if="d.label==='隐患状态'">
|
||||
{{
|
||||
scope.row.hidden_danger__hidden_state == 1 ? '排查中' : scope.row.hidden_danger__hidden_state == 2 ? '待整改' :scope.row.hidden_danger__hidden_state == 3 ? '整改中' :scope.row.hidden_danger__hidden_state == 4 ? '待验收' : '已验收'
|
||||
}}
|
||||
</div>
|
||||
<div v-else-if="d.label === '操作'">
|
||||
<el-button icon="el-icon-view" type="text" title="编辑" @click="edit(scope.row)" />
|
||||
<el-button v-if="scope.row.status !== 'NULLIFY'" icon="el-icon-delete" style="color:#F56C6C" type="text" title="删除" @click="Delete(scope.row)" />
|
||||
</div>
|
||||
<div v-else>{{ scope.row[d.prop] }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</template>
|
||||
</el-table>
|
||||
<el-pagination
|
||||
:current-page="pager.pageNo"
|
||||
:page-sizes="[10, 30, 50, 100, 500]"
|
||||
:page-size="pager.pageSize"
|
||||
:total="pager.total"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
@size-change="sizeChange"
|
||||
@current-change="pageChange"
|
||||
/>
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import api from './api'
|
||||
import buttons from '@/components/Buttons'
|
||||
export default {
|
||||
name: 'SafeIdsp',
|
||||
components: {
|
||||
buttons
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
data: [],
|
||||
deptTree: [],
|
||||
ids: [],
|
||||
levels: [],
|
||||
pager: {
|
||||
pageNo: 0,
|
||||
pageSize: 10,
|
||||
total: 0
|
||||
},
|
||||
tableHeader: [
|
||||
{
|
||||
prop: 'selection',
|
||||
type: 'selection',
|
||||
fixed: 'left'
|
||||
}, {
|
||||
prop: 'hidden_danger__hidden_state',
|
||||
label: '隐患状态'
|
||||
}, {
|
||||
prop: 'hidden_danger__hidden_code',
|
||||
label: '隐患编号'
|
||||
},
|
||||
{
|
||||
prop: 'hidden_danger__check_man',
|
||||
label: '检查人'
|
||||
}, {
|
||||
prop: 'hidden_danger__check_dept',
|
||||
label: '检查部门'
|
||||
},
|
||||
{
|
||||
prop: 'hidden_danger__check_date',
|
||||
label: '检查时间'
|
||||
}, {
|
||||
prop: 'hidden_danger__check_location',
|
||||
label: '隐患描述'
|
||||
}, {
|
||||
prop: 'hidden_danger__check_content',
|
||||
label: '隐患描述'
|
||||
}, {
|
||||
prop: 'opration',
|
||||
label: '操作',
|
||||
width: '70px',
|
||||
fixed: 'right',
|
||||
minWidth: '70px',
|
||||
show: true
|
||||
}],
|
||||
value: '',
|
||||
dept_id: '',
|
||||
level: '',
|
||||
id: '',
|
||||
parent_id: '',
|
||||
form: {
|
||||
dept_name: '',
|
||||
dept_code: '',
|
||||
memo: ''
|
||||
},
|
||||
rules: {
|
||||
dept_code: [
|
||||
{ required: true, message: '请输入部门编码', trigger: 'blur' }
|
||||
],
|
||||
dept_name: [
|
||||
{ required: true, message: '请输入部门名称', trigger: 'blur' }
|
||||
|
||||
]
|
||||
},
|
||||
formLabelWidth: '120px',
|
||||
auditForm: {},
|
||||
saveFrom: {},
|
||||
treeData: [],
|
||||
defaultProps: {
|
||||
children: 'children',
|
||||
label: 'sys_dept__dept_name'
|
||||
},
|
||||
treeList: [],
|
||||
whereSql: false,
|
||||
whereValue: ''
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
this.loading = true
|
||||
let pageNo = this.pager.pageNo * this.pager.pageSize - this.pager.pageSize
|
||||
if (pageNo < 0) {
|
||||
pageNo = 0
|
||||
}
|
||||
api.getDate(
|
||||
this.pager.pageSize,
|
||||
pageNo,
|
||||
this.whereSql,
|
||||
this.whereValue
|
||||
).then(data => {
|
||||
if (data.success) {
|
||||
this.data = data.data.root
|
||||
this.pager.total = data.data.total
|
||||
setTimeout(() => {
|
||||
this.loading = false
|
||||
}, 200)
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
editCreate() {
|
||||
const param = `/hidden_danger/hidden_check/create`
|
||||
this.$router.push(param)
|
||||
},
|
||||
Delete(row) {
|
||||
this.ids = []
|
||||
this.ids.push(row.hidden_danger__hidden_danger_id)
|
||||
this.editDelete()
|
||||
},
|
||||
editDelete() {
|
||||
if (this.ids && this.ids.length > 0) {
|
||||
this.$confirm('确认删除？').then(() => {
|
||||
api.Delete(this.ids).then(data => {
|
||||
if (data.success) {
|
||||
this.getList()
|
||||
this.$message.success('删除成功！')
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
}).catch(() => {})
|
||||
} else {
|
||||
this.$message.warning('请选择数据进行删除')
|
||||
}
|
||||
},
|
||||
editSave() {
|
||||
console.log('editSave')
|
||||
},
|
||||
upload() {
|
||||
console.log('upload')
|
||||
},
|
||||
edit(row) {
|
||||
const param = `/hidden_danger/hidden_check/audit/${row.hidden_danger__hidden_danger_id}`
|
||||
this.$router.push(param)
|
||||
},
|
||||
auditFormChange(form) {
|
||||
this.saveFrom = form
|
||||
},
|
||||
save() {
|
||||
if (Object.keys(this.saveFrom).length === 0) {
|
||||
this.saveFrom = this.auditForm
|
||||
}
|
||||
this.$refs.auditForm.$refs.auditForm.validate(valid => {
|
||||
if (valid) {
|
||||
const _form = `funid=sys_dept&parentId=&levelCol=sys_dept.dept_level&keyid=${this.id}&pagetype=editgrid&eventcode=save_eg&sys_dept__dept_code=${this.saveFrom.sys_dept__dept_code}&sys_dept__dept_name=${this.saveFrom.sys_dept__dept_name}&sys_dept__memo=${this.saveFrom.sys_dept__memo}&sys_dept__is_novalid=${this.saveFrom.sys_dept__is_novalid}&sys_dept__dept_id=${this.id}&sys_dept__dept_level=${this.saveFrom.sys_dept__dept_level}&user_id=administrator&dataType=json`
|
||||
api.auditSave(_form).then(data => {
|
||||
if (data.success) {
|
||||
this.whereSql = false
|
||||
this.whereValue = ''
|
||||
this.getList()
|
||||
this.$message.success('保存成功！')
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
cellDblclick(row) {
|
||||
const param = `/hidden_danger/hidden_check/audit/${row.hidden_danger__hidden_danger_id}`
|
||||
this.$router.push(param)
|
||||
},
|
||||
sizeChange(size) {
|
||||
this.pager.pageSize = size
|
||||
this.getList()
|
||||
},
|
||||
pageChange(page) {
|
||||
this.pager.pageNo = page
|
||||
this.getList()
|
||||
},
|
||||
handleSelectionChange(val) {
|
||||
this.ids = val.map(d => d.hidden_danger__hidden_danger_id)
|
||||
},
|
||||
closeDialog() {
|
||||
this.$refs['form'].resetFields()
|
||||
this.form.dept_name = ''
|
||||
this.form.dept_code = ''
|
||||
},
|
||||
handleNodeClick(data) {
|
||||
console.log(data)
|
||||
this.whereValue = encodeURI(`${data.sys_dept__dept_id}\%`)
|
||||
this.whereSql = true
|
||||
this.getList()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.el-card {
|
||||
margin-top: 10px;
|
||||
}
|
||||
</style>
|
||||
63
src/views/hidden_reform/api/index.js
Normal file
63
src/views/hidden_reform/api/index.js
Normal file
@ -0,0 +1,63 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
export default {
|
||||
getDate(pageSize, pageNo, isWhereSql, whereValue) {
|
||||
let whereSql = ''
|
||||
let whereType = ''
|
||||
if (isWhereSql) {
|
||||
whereSql = `dept_id like ?`
|
||||
whereType = 'string'
|
||||
}
|
||||
return request({
|
||||
url: `commonAction.do?eventcode=query_data&funid=queryevent&pagetype=grid&query_funid=hidden_reform&user_id=administrator`,
|
||||
method: 'post',
|
||||
data: `start=${pageNo}&limit=${pageSize}&where_sql=${whereSql}&where_value=${whereValue}&where_type=${whereType}&is_query=1&query_type=0`
|
||||
}).then(response => response.data)
|
||||
},
|
||||
getDeptTree() {
|
||||
return request({
|
||||
url: `/commonAction.do?eventcode=query_data&funid=queryevent&pagetype=editgrid&query_funid=sys_dept&user_id=administrator`,
|
||||
method: 'post',
|
||||
data: `start=0&limit=10000&where_sql=&where_value=&where_type=&is_query=1&query_type=0`
|
||||
}).then(response => response.data)
|
||||
},
|
||||
Crerte(data) {
|
||||
return request({
|
||||
url: `/commonAction.do`,
|
||||
method: 'post',
|
||||
data: `funid=hidden_reform&keyid=${data.hidden_danger__hidden_danger_id}&hidden_danger__hidden_code=${data.hidden_danger__hidden_code}&hidden_danger__hidden_state=${data.hidden_danger__hidden_state}&hidden_danger__check_man=${data.hidden_danger__check_man}&hidden_danger__check_dept=${data.hidden_danger__check_dept}&hidden_danger__check_date=${data.hidden_danger__check_date}&hidden_danger__check_location=${data.hidden_danger__check_location}&hidden_danger__check_content=${data.hidden_danger__check_content}&hidden_danger__check_problem=${data.hidden_danger__check_problem}&hidden_danger__org_id=${data.hidden_danger__org_id}&hidden_danger__insp_det_id=${data.hidden_danger__insp_det_id}&hidden_danger__dept_id=${data.hidden_danger__dept_id}&hidden_danger__hidden_danger_id=${data.hidden_danger__hidden_danger_id}&hidden_danger__reform_man=${data.hidden_danger__reform_man}&hidden_danger__reform_dept=${data.hidden_danger__reform_dept}&hidden_danger__reform_limit=${data.hidden_danger__reform_limit}&hidden_danger__check_photo=${data.hidden_danger__check_photo}&hidden_danger__more_flag=${data.hidden_danger__more_flag}&hidden_danger__check_man_id=${data.hidden_danger__check_man_id}&hidden_danger__check_dept_id=${data.hidden_danger__check_dept_id}&hidden_danger__reform_dept_id=${data.hidden_danger__reform_dept_id}&hidden_danger__reform_man_id=${data.hidden_danger__reform_man_id}&hidden_danger__safe_insp_id=${data.hidden_danger__safe_insp_id}&pagetype=form&eventcode=create&fkValue=&user_id=administrator&dataType=json`
|
||||
}).then(response => response.data)
|
||||
},
|
||||
Save(data) {
|
||||
return request({
|
||||
url: `/commonAction.do`,
|
||||
method: 'post',
|
||||
data: `funid=hidden_reform&keyid=${data.hidden_danger__hidden_danger_id}&hidden_danger__hidden_danger_id=${data.hidden_danger__hidden_danger_id}&hidden_danger__reform_date=${data.hidden_danger__reform_date}&hidden_danger__reform_money=${data.hidden_danger__reform_money}&hidden_danger__reform_desc=${data.hidden_danger__reform_desc}&pagetype=form&eventcode=save&dirtyfields=hidden_danger.reform_date;hidden_danger.reform_money;hidden_danger.reform_desc&fkValue=&user_id=administrator&dataType=json`
|
||||
}).then(response => response.data)
|
||||
},
|
||||
auditSave(data) {
|
||||
return request({
|
||||
url: `/commonAction.do`,
|
||||
method: 'post',
|
||||
data: `${data}`
|
||||
}).then(response => response.data)
|
||||
},
|
||||
Delete(ids) {
|
||||
let keys = ''
|
||||
ids.forEach(d => {
|
||||
keys += 'keyid=' + d + '&'
|
||||
})
|
||||
return request({
|
||||
url: `/commonAction.do`,
|
||||
method: 'post',
|
||||
data: `funid=hidden_reform&${keys}pagetype=editgrid&eventcode=delete&user_id=administrator&dataType=json`
|
||||
}).then(response => response.data)
|
||||
},
|
||||
getFormDate(id) {
|
||||
return request({
|
||||
url: `/commonAction.do?eventcode=query_data&funid=queryevent&pagetype=grid&query_funid=hidden_reform&user_id=administrator`,
|
||||
method: 'post',
|
||||
data: `start=0&limit=10&where_sql=hidden_danger.hidden_danger_id = ?&where_value=${id}&where_type=string&is_query=1&query_type=0`
|
||||
}).then(response => response.data)
|
||||
}
|
||||
}
|
||||
344
src/views/hidden_reform/components/create/index.vue
Normal file
344
src/views/hidden_reform/components/create/index.vue
Normal file
@ -0,0 +1,344 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-card>
|
||||
<buttons funid="hidden_check" style="margin-bottom:20px" @save="save" />
|
||||
<el-form ref="form" :model="form" label-width="80px" :rules="rules">
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="隐患编号">
|
||||
<el-input v-model="form.hidden_danger__hidden_code" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="巡检状态">
|
||||
<el-select v-model="form.hidden_danger__hidden_state" placeholder="请选择" :disabled="!disabled">
|
||||
<el-option
|
||||
v-for="item in hiddenState"
|
||||
:key="item.funall_control__value_data"
|
||||
:label="item.funall_control__display_data"
|
||||
:value="item.funall_control__value_data"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="检查人">
|
||||
<el-input v-model="form.hidden_danger__check_man" placeholder="请选择检查人" class="input-with-select" clearable>
|
||||
<el-button slot="append" icon="el-icon-search" @click="checkManVisible = !checkManVisible" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="检查部门">
|
||||
<el-input v-model="form.hidden_danger__check_dept" placeholder="请选择检查部门" class="input-with-select" clearable>
|
||||
<el-button slot="append" icon="el-icon-search" @click="checkDeptVisible = !checkDeptVisible" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="检查时间">
|
||||
<el-date-picker
|
||||
v-model="form.hidden_danger__check_date"
|
||||
type="date"
|
||||
placeholder="选择日期"
|
||||
style="width: 100%;"
|
||||
format="yyyy-MM-dd"
|
||||
value-format="yyyy-MM-dd"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="检查地点">
|
||||
<el-input v-model="form.hidden_danger__check_location" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="检查内容">
|
||||
<el-input v-model="form.hidden_danger__check_content" type="textarea" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="隐患描述" prop="hidden_danger__check_problem">
|
||||
<el-input v-model="form.hidden_danger__check_problem" type="textarea" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="整改人">
|
||||
<el-input v-model="form.hidden_danger__reform_man" placeholder="请选择整改人" class="input-with-select" clearable>
|
||||
<el-button slot="append" icon="el-icon-search" @click="reformManVisible = !reformManVisible" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="整改部门">
|
||||
<el-input v-model="form.hidden_danger__reform_dept" placeholder="请选择检查部门" class="input-with-select" clearable>
|
||||
<el-button slot="append" icon="el-icon-search" @click="reformDeptVisible = !reformDeptVisible" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="整改期限">
|
||||
<el-date-picker
|
||||
v-model="form.hidden_danger__reform_limit"
|
||||
type="date"
|
||||
placeholder="选择日期"
|
||||
style="width: 100%;"
|
||||
format="yyyy-MM-dd"
|
||||
value-format="yyyy-MM-dd"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</el-card>
|
||||
<el-dialog
|
||||
v-if="checkManVisible"
|
||||
title="选择人员"
|
||||
:visible.sync="checkManVisible"
|
||||
width="60%"
|
||||
>
|
||||
<SelUser ref="CheckMan" @updateUser="getCheckMan" />
|
||||
<span>
|
||||
<el-button @click="checkManVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="selCheckMan">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
v-if="reformManVisible"
|
||||
title="选择人员"
|
||||
:visible.sync="reformManVisible"
|
||||
width="60%"
|
||||
>
|
||||
<SelUser ref="ReformMan" @updateUser="getReformMan" />
|
||||
<span>
|
||||
<el-button @click="reformManVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="selReformMan">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
v-if="checkDeptVisible"
|
||||
class="selDept"
|
||||
title="选择部门"
|
||||
:visible.sync="checkDeptVisible"
|
||||
width="60%"
|
||||
:modal="false"
|
||||
>
|
||||
<SelDept ref="CheckDept" @updateDept="getCheckDept" />
|
||||
<span>
|
||||
<el-button @click="checkDeptVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="selCheckDept">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
v-if="reformDeptVisible"
|
||||
class="selDept"
|
||||
title="选择部门"
|
||||
:visible.sync="reformDeptVisible"
|
||||
width="60%"
|
||||
:modal="false"
|
||||
>
|
||||
<SelDept ref="ReformDept" @updateDept="getReformDept" />
|
||||
<span>
|
||||
<el-button @click="reformDeptVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="selReformDept">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import api from '../../api'
|
||||
import publicApi from '@/api/public'
|
||||
import buttons from '@/components/formBtn'
|
||||
import SelUser from '@/components/selUser'
|
||||
import SelDept from '@/components/selDept'
|
||||
export default {
|
||||
name: 'AuditForm',
|
||||
components: {
|
||||
buttons,
|
||||
SelUser,
|
||||
SelDept
|
||||
},
|
||||
// props: {
|
||||
// id: { type: String, default: () => '' }
|
||||
// },
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
form: {
|
||||
hidden_danger__hidden_code: '',
|
||||
hidden_danger__hidden_state: '1',
|
||||
hidden_danger__check_man: '',
|
||||
hidden_danger__check_dept: '',
|
||||
hidden_danger__check_date: '',
|
||||
hidden_danger__check_location: '',
|
||||
hidden_danger__check_content: '',
|
||||
hidden_danger__check_problem: '',
|
||||
hidden_danger__reform_man: '',
|
||||
hidden_danger__reform_dept: '',
|
||||
hidden_danger__reform_limit: '',
|
||||
hidden_danger__check_photo: '',
|
||||
hidden_danger__more_flag: '',
|
||||
hidden_danger__safe_insp_id: '',
|
||||
hidden_danger__reform_man_id: '',
|
||||
hidden_danger__reform_dept_id: '',
|
||||
hidden_danger__org_id: '',
|
||||
hidden_danger__insp_det_id: '',
|
||||
hidden_danger__hidden_danger_id: '',
|
||||
hidden_danger__dept_id: '',
|
||||
hidden_danger__check_man_id: '',
|
||||
hidden_danger__check_dept_id: ''
|
||||
},
|
||||
rules: {
|
||||
hidden_danger__check_problem: [
|
||||
{ required: true, message: '请输入隐患描述', trigger: 'blur' }
|
||||
]
|
||||
},
|
||||
inspName: [],
|
||||
disabled: false,
|
||||
options: [],
|
||||
checkManVisible: false,
|
||||
reformManVisible: false,
|
||||
checkDeptVisible: false,
|
||||
reformDeptVisible: false,
|
||||
inspNameVisible: false,
|
||||
id: '',
|
||||
hiddenState: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getHiddenState()
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
this.loading = true
|
||||
api.getFormDate().then(data => {
|
||||
if (data.success) {
|
||||
this.form = data.data.root[0]
|
||||
setTimeout(() => {
|
||||
this.loading = false
|
||||
}, 200)
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
async getHiddenState() {
|
||||
await publicApi.getTypeSel('hiddenstate').then(data => {
|
||||
if (data.success) {
|
||||
this.hiddenState = data.data.root
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
onSubmit() {},
|
||||
getCheckMan(data) {
|
||||
this.form.hidden_danger__check_man = data.sys_user__user_name
|
||||
this.form.hidden_danger__check_man_id = data.sys_user__user_id
|
||||
this.form.hidden_danger__check_dept = data.sys_dept__dept_name
|
||||
this.form.hidden_danger__check_dept_id = data.sys_user__dept_id
|
||||
this.checkManVisible = false
|
||||
},
|
||||
selCheckMan() {
|
||||
this.getCheckMans(this.$refs.CheckMan.Users)
|
||||
this.checkManVisible = false
|
||||
},
|
||||
getCheckMans(data) {
|
||||
this.form.hidden_danger__check_man = data.map(d => { return d.sys_user__user_name }).join(';')
|
||||
this.form.hidden_danger__check_man_id = data.map(d => { return d.sys_user__user_id }).join(';')
|
||||
this.form.hidden_danger__check_dept = data.map(d => { return d.sys_dept__dept_name }).join(';')
|
||||
this.form.hidden_danger__check_dept_id = data.map(d => { return d.sys_user__dept_id }).join(';')
|
||||
this.checkManVisible = false
|
||||
},
|
||||
getReformMan(data) {
|
||||
this.form.hidden_danger__reform_man = data.sys_user__user_name
|
||||
this.form.hidden_danger__reform_man_id = data.sys_user__user_id
|
||||
this.form.hidden_danger__reform_dept = data.sys_dept__dept_name
|
||||
this.form.hidden_danger__reform_dept_id = data.sys_user__dept_id
|
||||
this.reformManVisible = false
|
||||
},
|
||||
selReformMan() {
|
||||
this.getReformMans(this.$refs.ReformMan.Users)
|
||||
this.reformManVisible = false
|
||||
},
|
||||
getReformMans(data) {
|
||||
this.form.hidden_danger__reform_man = data.map(d => { return d.sys_user__user_name }).join(';')
|
||||
this.form.hidden_danger__reform_man_id = data.map(d => { return d.sys_user__user_id }).join(';')
|
||||
this.form.hidden_danger__reform_dept = data.map(d => { return d.sys_dept__dept_name }).join(';')
|
||||
this.form.hidden_danger__reform_dept_id = data.map(d => { return d.sys_user__dept_id }).join(';')
|
||||
this.reformManVisible = false
|
||||
},
|
||||
getCheckDept(data) {
|
||||
this.form.hidden_danger__check_dept = data.sys_dept__dept_name
|
||||
this.form.hidden_danger__check_dept_id = data.sys_dept__dept_id
|
||||
this.checkDeptVisible = false
|
||||
},
|
||||
selCheckDept() {
|
||||
this.CheckDepts(this.$refs.CheckDept.Dpets)
|
||||
},
|
||||
CheckDepts(data) {
|
||||
this.form.hidden_danger__check_dept = data.map(d => { return d.sys_dept__dept_name }).join(';')
|
||||
this.form.hidden_danger__check_dept_id = data.map(d => { return d.sys_dept__dept_id }).join(';')
|
||||
this.checkDeptVisible = false
|
||||
},
|
||||
getReformDept(data) {
|
||||
this.form.hidden_danger__reform_dept = data.sys_dept__dept_name
|
||||
this.form.hidden_danger__reform_dept_id = data.sys_dept__dept_id
|
||||
this.reformDeptVisible = false
|
||||
},
|
||||
selReformDept() {
|
||||
this.ReformDepts(this.$refs.ReformDept.Dpets)
|
||||
},
|
||||
ReformDepts(data) {
|
||||
this.form.hidden_danger__reform_dept = data.map(d => { return d.sys_dept__dept_name }).join(';')
|
||||
this.form.hidden_danger__reform_dept_id = data.map(d => { return d.sys_dept__dept_id }).join(';')
|
||||
this.reformDeptVisible = false
|
||||
},
|
||||
save() {
|
||||
this.$refs['form'].validate((valid) => {
|
||||
if (valid) {
|
||||
api.Crerte(this.form).then(data => {
|
||||
if (data.success) {
|
||||
this.$message.success('保存成功！')
|
||||
const param = `/hidden_danger/hidden_check/audit/${data.data.keyid}`
|
||||
this.$router.push(param)
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
back() {
|
||||
// this.$router__back(-1)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
::v-deep .el-dialog__body {
|
||||
padding: 10px 20px !important;
|
||||
}
|
||||
::v-deep .el-form-item__label {
|
||||
text-align: right;
|
||||
/* vertical-align: middle; */
|
||||
float: left;
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
line-height: 40px;
|
||||
padding: 0 6px 0 0;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.el-col{
|
||||
margin-left: 2%;
|
||||
}
|
||||
</style>
|
||||
374
src/views/hidden_reform/components/edit_form/index.vue
Normal file
374
src/views/hidden_reform/components/edit_form/index.vue
Normal file
@ -0,0 +1,374 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-card>
|
||||
<buttons funid="hidden_check" style="margin-bottom:20px" @save="save" />
|
||||
<el-form ref="form" :model="form" label-width="80px" :rules="rules">
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="隐患编号">
|
||||
<el-input v-model="form.hidden_danger__hidden_code" :disabled="!disabled" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="巡检状态">
|
||||
<el-select v-model="form.hidden_danger__hidden_state" placeholder="请选择" :disabled="!disabled">
|
||||
<el-option
|
||||
v-for="item in hiddenState"
|
||||
:key="item.funall_control__value_data"
|
||||
:label="item.funall_control__display_data"
|
||||
:value="item.funall_control__value_data"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="检查人">
|
||||
<el-input v-model="form.hidden_danger__check_man" placeholder="请选择检查人" class="input-with-select" clearable :disabled="!disabled">
|
||||
<el-button slot="append" icon="el-icon-search" @click="checkManVisible = !checkManVisible" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="检查部门">
|
||||
<el-input v-model="form.hidden_danger__check_dept" placeholder="请选择检查部门" class="input-with-select" clearable :disabled="!disabled">
|
||||
<el-button slot="append" icon="el-icon-search" @click="checkDeptVisible = !checkDeptVisible" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="检查时间">
|
||||
<el-date-picker
|
||||
v-model="form.hidden_danger__check_date"
|
||||
type="date"
|
||||
placeholder="选择日期"
|
||||
style="width: 100%;"
|
||||
format="yyyy-MM-dd"
|
||||
value-format="yyyy-MM-dd"
|
||||
:disabled="!disabled"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="检查地点">
|
||||
<el-input v-model="form.hidden_danger__check_location" :disabled="!disabled" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="检查内容">
|
||||
<el-input v-model="form.hidden_danger__check_content" type="textarea" :disabled="!disabled" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="隐患描述" prop="hidden_danger__check_problem">
|
||||
<el-input v-model="form.hidden_danger__check_problem" type="textarea" :disabled="!disabled" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="整改人">
|
||||
<el-input v-model="form.hidden_danger__reform_man" placeholder="请选择整改人" class="input-with-select" clearable :disabled="!disabled">
|
||||
<el-button slot="append" icon="el-icon-search" @click="reformManVisible = !reformManVisible" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="整改部门">
|
||||
<el-input v-model="form.hidden_danger__reform_dept" placeholder="请选择检查部门" class="input-with-select" clearable :disabled="!disabled">
|
||||
<el-button slot="append" icon="el-icon-search" @click="reformDeptVisible = !reformDeptVisible" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="整改期限">
|
||||
<el-date-picker
|
||||
v-model="form.hidden_danger__reform_limit"
|
||||
type="date"
|
||||
placeholder="选择日期"
|
||||
style="width: 100%;"
|
||||
format="yyyy-MM-dd"
|
||||
value-format="yyyy-MM-dd"
|
||||
:disabled="!disabled"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="整改时间" prop="hidden_danger__reform_date">
|
||||
<el-date-picker
|
||||
v-model="form.hidden_danger__reform_date"
|
||||
type="date"
|
||||
placeholder="选择日期"
|
||||
style="width: 100%;"
|
||||
format="yyyy-MM-dd"
|
||||
value-format="yyyy-MM-dd"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="投入费用">
|
||||
<el-input v-model="form.hidden_danger__reform_money" placeholder="请输入安全投入费用" class="input-with-select" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="整改情况">
|
||||
<el-input v-model="form.hidden_danger__reform_desc" placeholder="请输入整改情况" class="input-with-select" type="textarea" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</el-card>
|
||||
<el-dialog
|
||||
v-if="checkManVisible"
|
||||
title="选择人员"
|
||||
:visible.sync="checkManVisible"
|
||||
width="60%"
|
||||
>
|
||||
<SelUser ref="CheckMan" @updateUser="getCheckMan" />
|
||||
<span>
|
||||
<el-button @click="checkManVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="selCheckMan">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
v-if="reformManVisible"
|
||||
title="选择人员"
|
||||
:visible.sync="reformManVisible"
|
||||
width="60%"
|
||||
>
|
||||
<SelUser ref="ReformMan" @updateUser="getReformMan" />
|
||||
<span>
|
||||
<el-button @click="reformManVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="selReformMan">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
v-if="checkDeptVisible"
|
||||
class="selDept"
|
||||
title="选择部门"
|
||||
:visible.sync="checkDeptVisible"
|
||||
width="60%"
|
||||
:modal="false"
|
||||
>
|
||||
<SelDept ref="CheckDept" @updateDept="getCheckDept" />
|
||||
<span>
|
||||
<el-button @click="checkDeptVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="selCheckDept">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
v-if="reformDeptVisible"
|
||||
class="selDept"
|
||||
title="选择部门"
|
||||
:visible.sync="reformDeptVisible"
|
||||
width="60%"
|
||||
:modal="false"
|
||||
>
|
||||
<SelDept ref="ReformDept" @updateDept="getReformDept" />
|
||||
<span>
|
||||
<el-button @click="reformDeptVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="selReformDept">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import api from '../../api'
|
||||
import publicApi from '@/api/public'
|
||||
import buttons from '@/components/formBtn'
|
||||
import SelUser from '@/components/selUser'
|
||||
import SelDept from '@/components/selDept'
|
||||
export default {
|
||||
name: 'AuditForm',
|
||||
components: {
|
||||
buttons,
|
||||
SelUser,
|
||||
SelDept
|
||||
},
|
||||
// props: {
|
||||
// id: { type: String, default: () => '' }
|
||||
// },
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
id: this.$route.params.id,
|
||||
form: {
|
||||
hidden_danger__hidden_code: '',
|
||||
hidden_danger__hidden_state: '',
|
||||
hidden_danger__check_man: '',
|
||||
hidden_danger__check_dept: '',
|
||||
hidden_danger__check_date: '',
|
||||
hidden_danger__check_location: '',
|
||||
hidden_danger__check_content: '',
|
||||
hidden_danger__check_problem: '',
|
||||
hidden_danger__reform_man: '',
|
||||
hidden_danger__reform_dept: '',
|
||||
hidden_danger__reform_limit: '',
|
||||
hidden_danger__check_photo: '',
|
||||
hidden_danger__more_flag: '',
|
||||
hidden_danger__reform_date: '',
|
||||
hidden_danger__reform_money: '',
|
||||
hidden_danger__reform_desc: '',
|
||||
hidden_danger__reform_photo: '',
|
||||
hidden_danger__safe_insp_id: '',
|
||||
hidden_danger__reform_man_id: '',
|
||||
hidden_danger__org_id: '',
|
||||
hidden_danger__reform_dept_id: '',
|
||||
hidden_danger__insp_det_id: '',
|
||||
hidden_danger__hidden_danger_id: '',
|
||||
hidden_danger__dept_id: '',
|
||||
hidden_danger__check_man_id: '',
|
||||
hidden_danger__check_dept_id: ''
|
||||
},
|
||||
rules: {
|
||||
hidden_danger__reform_date: [
|
||||
{ required: true, message: '请选择整改时间', trigger: 'blur' }
|
||||
]
|
||||
},
|
||||
inspName: [],
|
||||
disabled: false,
|
||||
options: [],
|
||||
checkManVisible: false,
|
||||
reformManVisible: false,
|
||||
checkDeptVisible: false,
|
||||
reformDeptVisible: false,
|
||||
hiddenState: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
this.getHiddenState()
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
this.loading = true
|
||||
api.getFormDate(this.id).then(data => {
|
||||
if (data.success) {
|
||||
this.form = data.data.root[0]
|
||||
setTimeout(() => {
|
||||
this.loading = false
|
||||
}, 200)
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
async getHiddenState() {
|
||||
await publicApi.getTypeSel('hiddenstate').then(data => {
|
||||
if (data.success) {
|
||||
this.hiddenState = data.data.root
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
onSubmit() {},
|
||||
getCheckMan(data) {
|
||||
this.form.hidden_danger__check_man = data.sys_user__user_name
|
||||
this.form.hidden_danger__check_man_id = data.sys_user__user_id
|
||||
this.form.hidden_danger__check_dept = data.sys_dept__dept_name
|
||||
this.form.hidden_danger__check_dept_id = data.sys_user__dept_id
|
||||
this.checkManVisible = false
|
||||
},
|
||||
selCheckMan() {
|
||||
this.getCheckMans(this.$refs.CheckMan.Users)
|
||||
this.checkManVisible = false
|
||||
},
|
||||
getCheckMans(data) {
|
||||
this.form.hidden_danger__check_man = data.map(d => { return d.sys_user__user_name }).join(';')
|
||||
this.form.hidden_danger__check_man_id = data.map(d => { return d.sys_user__user_id }).join(';')
|
||||
this.form.hidden_danger__check_dept = data.map(d => { return d.sys_dept__dept_name }).join(';')
|
||||
this.form.hidden_danger__check_dept_id = data.map(d => { return d.sys_user__dept_id }).join(';')
|
||||
this.checkManVisible = false
|
||||
},
|
||||
getReformMan(data) {
|
||||
this.form.hidden_danger__reform_man = data.sys_user__user_name
|
||||
this.form.hidden_danger__reform_man_id = data.sys_user__user_id
|
||||
this.form.hidden_danger__reform_dept = data.sys_dept__dept_name
|
||||
this.form.hidden_danger__reform_dept_id = data.sys_user__dept_id
|
||||
this.reformManVisible = false
|
||||
},
|
||||
selReformMan() {
|
||||
this.getReformMans(this.$refs.ReformMan.Users)
|
||||
this.reformManVisible = false
|
||||
},
|
||||
getReformMans(data) {
|
||||
this.form.hidden_danger__reform_man = data.map(d => { return d.sys_user__user_name }).join(';')
|
||||
this.form.hidden_danger__reform_man_id = data.map(d => { return d.sys_user__user_id }).join(';')
|
||||
this.form.hidden_danger__reform_dept = data.map(d => { return d.sys_dept__dept_name }).join(';')
|
||||
this.form.hidden_danger__reform_dept_id = data.map(d => { return d.sys_user__dept_id }).join(';')
|
||||
this.reformManVisible = false
|
||||
},
|
||||
getCheckDept(data) {
|
||||
this.form.hidden_danger__check_dept = data.sys_dept__dept_name
|
||||
this.form.hidden_danger__check_dept_id = data.sys_dept__dept_id
|
||||
this.checkDeptVisible = false
|
||||
},
|
||||
selCheckDept() {
|
||||
this.CheckDepts(this.$refs.CheckDept.Dpets)
|
||||
},
|
||||
CheckDepts(data) {
|
||||
this.form.hidden_danger__check_dept = data.map(d => { return d.sys_dept__dept_name }).join(';')
|
||||
this.form.hidden_danger__check_dept_id = data.map(d => { return d.sys_dept__dept_id }).join(';')
|
||||
this.checkDeptVisible = false
|
||||
},
|
||||
getReformDept(data) {
|
||||
this.form.hidden_danger__reform_dept = data.sys_dept__dept_name
|
||||
this.form.hidden_danger__reform_dept_id = data.sys_dept__dept_id
|
||||
this.reformDeptVisible = false
|
||||
},
|
||||
selReformDept() {
|
||||
this.ReformDepts(this.$refs.ReformDept.Dpets)
|
||||
},
|
||||
ReformDepts(data) {
|
||||
this.form.hidden_danger__reform_dept = data.map(d => { return d.sys_dept__dept_name }).join(';')
|
||||
this.form.hidden_danger__reform_dept_id = data.map(d => { return d.sys_dept__dept_id }).join(';')
|
||||
this.reformDeptVisible = false
|
||||
},
|
||||
save() {
|
||||
this.$refs['form'].validate((valid) => {
|
||||
if (valid) {
|
||||
api.Save(this.form).then(data => {
|
||||
if (data.success) {
|
||||
this.$message.success('保存成功！')
|
||||
// const param = `/insp/edit_form/audit/${data.data.keyid}`
|
||||
// this.$router__push(param)
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
back() {
|
||||
// this.$router__back(-1)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
::v-deep .el-dialog__body {
|
||||
padding: 10px 20px !important;
|
||||
}
|
||||
::v-deep .el-form-item__label {
|
||||
text-align: right;
|
||||
/* vertical-align: middle; */
|
||||
float: left;
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
line-height: 40px;
|
||||
padding: 0 6px 0 0;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.el-col{
|
||||
margin-left: 2%;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,266 @@
|
||||
<template>
|
||||
<div>
|
||||
<buttons funid="hidden_reform" style="margin:10px 10px" @Create="editCreate" @Del="editDelete" @editSave="editSave" @upload="upload" />
|
||||
<el-card>
|
||||
<el-table
|
||||
ref="deptTable"
|
||||
v-loading="loading"
|
||||
:data="data"
|
||||
style="width: 100%"
|
||||
@selection-change="handleSelectionChange"
|
||||
@cell-dblclick="cellDblclick"
|
||||
>
|
||||
<template v-for="(d,i) in tableHeader">
|
||||
<el-table-column v-if="d.type && d.type === 'selection'" :key="i" :type="d.type" :fixed="d.fixed" />
|
||||
<el-table-column
|
||||
v-else
|
||||
:key="i"
|
||||
:prop="d.prop"
|
||||
:label="d.label"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<div v-if="d.label==='隐患状态'">
|
||||
{{
|
||||
scope.row.hidden_danger__hidden_state == 1 ? '排查中' : scope.row.hidden_danger__hidden_state == 2 ? '待整改' :scope.row.hidden_danger__hidden_state == 3 ? '整改中' :scope.row.hidden_danger__hidden_state == 4 ? '待验收' : '已验收'
|
||||
}}
|
||||
</div>
|
||||
<div v-else-if="d.label === '操作'">
|
||||
<el-button icon="el-icon-view" type="text" title="编辑" @click="edit(scope.row)" />
|
||||
<el-button v-if="scope.row.status !== 'NULLIFY'" icon="el-icon-delete" style="color:#F56C6C" type="text" title="删除" @click="Delete(scope.row)" />
|
||||
</div>
|
||||
<div v-else>{{ scope.row[d.prop] }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</template>
|
||||
</el-table>
|
||||
<el-pagination
|
||||
:current-page="pager.pageNo"
|
||||
:page-sizes="[10, 30, 50, 100, 500]"
|
||||
:page-size="pager.pageSize"
|
||||
:total="pager.total"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
@size-change="sizeChange"
|
||||
@current-change="pageChange"
|
||||
/>
|
||||
</el-card>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import api from './api'
|
||||
import buttons from '@/components/Buttons'
|
||||
export default {
|
||||
name: 'SafeIdsp',
|
||||
components: {
|
||||
buttons
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
data: [],
|
||||
deptTree: [],
|
||||
ids: [],
|
||||
levels: [],
|
||||
pager: {
|
||||
pageNo: 0,
|
||||
pageSize: 10,
|
||||
total: 0
|
||||
},
|
||||
tableHeader: [
|
||||
{
|
||||
prop: 'selection',
|
||||
type: 'selection',
|
||||
fixed: 'left'
|
||||
}, {
|
||||
prop: 'hidden_danger__hidden_code',
|
||||
label: '隐患编号'
|
||||
}, {
|
||||
prop: 'hidden_danger__hidden_state',
|
||||
label: '隐患状态'
|
||||
}, {
|
||||
prop: 'hidden_danger__check_man',
|
||||
label: '检查人'
|
||||
}, {
|
||||
prop: 'hidden_danger__check_dept',
|
||||
label: '检查部门'
|
||||
},
|
||||
{
|
||||
prop: 'hidden_danger__check_date',
|
||||
label: '检查时间'
|
||||
}, {
|
||||
prop: 'hidden_danger__check_location',
|
||||
label: '隐患描述'
|
||||
}, {
|
||||
prop: 'hidden_danger__check_content',
|
||||
label: '隐患描述'
|
||||
}, {
|
||||
prop: 'hidden_danger__reform_dept',
|
||||
label: '整改人'
|
||||
}, {
|
||||
prop: 'hidden_danger__reform_man',
|
||||
label: '整改部门'
|
||||
}, {
|
||||
prop: 'hidden_danger__reform_limit',
|
||||
label: '整改期限'
|
||||
}, {
|
||||
prop: 'opration',
|
||||
label: '操作',
|
||||
width: '70px',
|
||||
fixed: 'right',
|
||||
minWidth: '70px',
|
||||
show: true
|
||||
}],
|
||||
value: '',
|
||||
dept_id: '',
|
||||
level: '',
|
||||
id: '',
|
||||
parent_id: '',
|
||||
form: {
|
||||
dept_name: '',
|
||||
dept_code: '',
|
||||
memo: ''
|
||||
},
|
||||
rules: {
|
||||
dept_code: [
|
||||
{ required: true, message: '请输入部门编码', trigger: 'blur' }
|
||||
],
|
||||
dept_name: [
|
||||
{ required: true, message: '请输入部门名称', trigger: 'blur' }
|
||||
|
||||
]
|
||||
},
|
||||
formLabelWidth: '120px',
|
||||
auditForm: {},
|
||||
saveFrom: {},
|
||||
treeData: [],
|
||||
defaultProps: {
|
||||
children: 'children',
|
||||
label: 'sys_dept__dept_name'
|
||||
},
|
||||
treeList: [],
|
||||
whereSql: false,
|
||||
whereValue: ''
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
this.loading = true
|
||||
let pageNo = this.pager.pageNo * this.pager.pageSize - this.pager.pageSize
|
||||
if (pageNo < 0) {
|
||||
pageNo = 0
|
||||
}
|
||||
api.getDate(
|
||||
this.pager.pageSize,
|
||||
pageNo,
|
||||
this.whereSql,
|
||||
this.whereValue
|
||||
).then(data => {
|
||||
if (data.success) {
|
||||
this.data = data.data.root
|
||||
this.pager.total = data.data.total
|
||||
setTimeout(() => {
|
||||
this.loading = false
|
||||
}, 200)
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
editCreate() {
|
||||
const param = `/hidden_danger/hidden_reform/create`
|
||||
this.$router.push(param)
|
||||
},
|
||||
Delete(row) {
|
||||
this.ids = []
|
||||
this.ids.push(row.hidden_danger__hidden_danger_id)
|
||||
this.editDelete()
|
||||
},
|
||||
editDelete() {
|
||||
if (this.ids && this.ids.length > 0) {
|
||||
this.$confirm('确认删除？').then(() => {
|
||||
api.Delete(this.ids).then(data => {
|
||||
if (data.success) {
|
||||
this.getList()
|
||||
this.$message.success('删除成功！')
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
}).catch(() => {})
|
||||
} else {
|
||||
this.$message.warning('请选择数据进行删除')
|
||||
}
|
||||
},
|
||||
editSave() {
|
||||
console.log('editSave')
|
||||
},
|
||||
upload() {
|
||||
console.log('upload')
|
||||
},
|
||||
edit(row) {
|
||||
const param = `/hidden_danger/hidden_reform/audit/${row.hidden_danger__hidden_danger_id}`
|
||||
this.$router.push(param)
|
||||
},
|
||||
auditFormChange(form) {
|
||||
this.saveFrom = form
|
||||
},
|
||||
save() {
|
||||
if (Object.keys(this.saveFrom).length === 0) {
|
||||
this.saveFrom = this.auditForm
|
||||
}
|
||||
this.$refs.auditForm.$refs.auditForm.validate(valid => {
|
||||
if (valid) {
|
||||
const _form = `funid=sys_dept&parentId=&levelCol=sys_dept.dept_level&keyid=${this.id}&pagetype=editgrid&eventcode=save_eg&sys_dept__dept_code=${this.saveFrom.sys_dept__dept_code}&sys_dept__dept_name=${this.saveFrom.sys_dept__dept_name}&sys_dept__memo=${this.saveFrom.sys_dept__memo}&sys_dept__is_novalid=${this.saveFrom.sys_dept__is_novalid}&sys_dept__dept_id=${this.id}&sys_dept__dept_level=${this.saveFrom.sys_dept__dept_level}&user_id=administrator&dataType=json`
|
||||
api.auditSave(_form).then(data => {
|
||||
if (data.success) {
|
||||
this.whereSql = false
|
||||
this.whereValue = ''
|
||||
this.getList()
|
||||
this.$message.success('保存成功！')
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
cellDblclick(row) {
|
||||
const param = `/hidden_danger/hidden_reform/audit/${row.hidden_danger__hidden_danger_id}`
|
||||
this.$router.push(param)
|
||||
},
|
||||
sizeChange(size) {
|
||||
this.pager.pageSize = size
|
||||
this.getList()
|
||||
},
|
||||
pageChange(page) {
|
||||
this.pager.pageNo = page
|
||||
this.getList()
|
||||
},
|
||||
handleSelectionChange(val) {
|
||||
this.ids = val.map(d => d.hidden_danger__hidden_danger_id)
|
||||
},
|
||||
closeDialog() {
|
||||
this.$refs['form'].resetFields()
|
||||
this.form.dept_name = ''
|
||||
this.form.dept_code = ''
|
||||
},
|
||||
handleNodeClick(data) {
|
||||
console.log(data)
|
||||
this.whereValue = encodeURI(`${data.sys_dept__dept_id}\%`)
|
||||
this.whereSql = true
|
||||
this.getList()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.el-card {
|
||||
margin-top: 10px;
|
||||
}
|
||||
</style>
|
||||
63
src/views/hidden_review/api/index.js
Normal file
63
src/views/hidden_review/api/index.js
Normal file
@ -0,0 +1,63 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
export default {
|
||||
getDate(pageSize, pageNo, isWhereSql, whereValue) {
|
||||
let whereSql = ''
|
||||
let whereType = ''
|
||||
if (isWhereSql) {
|
||||
whereSql = `dept_id like ?`
|
||||
whereType = 'string'
|
||||
}
|
||||
return request({
|
||||
url: `commonAction.do?eventcode=query_data&funid=queryevent&pagetype=grid&query_funid=hidden_review&user_id=administrator`,
|
||||
method: 'post',
|
||||
data: `start=${pageNo}&limit=${pageSize}&where_sql=${whereSql}&where_value=${whereValue}&where_type=${whereType}&is_query=1&query_type=0`
|
||||
}).then(response => response.data)
|
||||
},
|
||||
getDeptTree() {
|
||||
return request({
|
||||
url: `/commonAction.do?eventcode=query_data&funid=queryevent&pagetype=editgrid&query_funid=sys_dept&user_id=administrator`,
|
||||
method: 'post',
|
||||
data: `start=0&limit=10000&where_sql=&where_value=&where_type=&is_query=1&query_type=0`
|
||||
}).then(response => response.data)
|
||||
},
|
||||
Crerte(data) {
|
||||
return request({
|
||||
url: `/commonAction.do`,
|
||||
method: 'post',
|
||||
data: `funid=hidden_review&keyid=${data.hidden_danger__hidden_danger_id}&hidden_danger__hidden_code=${data.hidden_danger__hidden_code}&hidden_danger__hidden_state=${data.hidden_danger__hidden_state}&hidden_danger__check_man=${data.hidden_danger__check_man}&hidden_danger__check_dept=${data.hidden_danger__check_dept}&hidden_danger__check_date=${data.hidden_danger__check_date}&hidden_danger__check_location=${data.hidden_danger__check_location}&hidden_danger__check_content=${data.hidden_danger__check_content}&hidden_danger__check_problem=${data.hidden_danger__check_problem}&hidden_danger__org_id=${data.hidden_danger__org_id}&hidden_danger__insp_det_id=${data.hidden_danger__insp_det_id}&hidden_danger__dept_id=${data.hidden_danger__dept_id}&hidden_danger__hidden_danger_id=${data.hidden_danger__hidden_danger_id}&hidden_danger__reform_man=${data.hidden_danger__reform_man}&hidden_danger__reform_dept=${data.hidden_danger__reform_dept}&hidden_danger__reform_limit=${data.hidden_danger__reform_limit}&hidden_danger__check_photo=${data.hidden_danger__check_photo}&hidden_danger__more_flag=${data.hidden_danger__more_flag}&hidden_danger__check_man_id=${data.hidden_danger__check_man_id}&hidden_danger__check_dept_id=${data.hidden_danger__check_dept_id}&hidden_danger__reform_dept_id=${data.hidden_danger__reform_dept_id}&hidden_danger__reform_man_id=${data.hidden_danger__reform_man_id}&hidden_danger__safe_insp_id=${data.hidden_danger__safe_insp_id}&pagetype=form&eventcode=create&fkValue=&user_id=administrator&dataType=json`
|
||||
}).then(response => response.data)
|
||||
},
|
||||
Save(data) {
|
||||
return request({
|
||||
url: `/commonAction.do`,
|
||||
method: 'post',
|
||||
data: `funid=hidden_review&keyid=${data.hidden_danger__hidden_danger_id}&hidden_danger__hidden_danger_id=${data.hidden_danger__hidden_danger_id}&hidden_danger__review_date=${data.hidden_danger__review_date}&hidden_danger__review_man=${data.hidden_danger__review_man}&hidden_danger__review_man_id=${data.hidden_danger__review_man_id}&hidden_danger__review_desc=${data.hidden_danger__review_desc}&pagetype=form&eventcode=save&dirtyfields=hidden_danger.review_date;hidden_danger.review_man;hidden_danger.review_man_id;hidden_danger.review_desc&fkValue=&user_id=administrator&dataType=json`
|
||||
}).then(response => response.data)
|
||||
},
|
||||
auditSave(data) {
|
||||
return request({
|
||||
url: `/commonAction.do`,
|
||||
method: 'post',
|
||||
data: `${data}`
|
||||
}).then(response => response.data)
|
||||
},
|
||||
Delete(ids) {
|
||||
let keys = ''
|
||||
ids.forEach(d => {
|
||||
keys += 'keyid=' + d + '&'
|
||||
})
|
||||
return request({
|
||||
url: `/commonAction.do`,
|
||||
method: 'post',
|
||||
data: `funid=hidden_review&${keys}pagetype=editgrid&eventcode=delete&user_id=administrator&dataType=json`
|
||||
}).then(response => response.data)
|
||||
},
|
||||
getFormDate(id) {
|
||||
return request({
|
||||
url: `/commonAction.do?eventcode=query_data&funid=queryevent&pagetype=grid&query_funid=hidden_review&user_id=administrator`,
|
||||
method: 'post',
|
||||
data: `start=0&limit=10&where_sql=hidden_danger.hidden_danger_id = ?&where_value=${id}&where_type=string&is_query=1&query_type=0`
|
||||
}).then(response => response.data)
|
||||
}
|
||||
}
|
||||
344
src/views/hidden_review/components/create/index.vue
Normal file
344
src/views/hidden_review/components/create/index.vue
Normal file
@ -0,0 +1,344 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-card>
|
||||
<buttons funid="hidden_check" style="margin-bottom:20px" @save="save" />
|
||||
<el-form ref="form" :model="form" label-width="80px" :rules="rules">
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="隐患编号">
|
||||
<el-input v-model="form.hidden_danger__hidden_code" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="巡检状态">
|
||||
<el-select v-model="form.hidden_danger__hidden_state" placeholder="请选择" :disabled="!disabled">
|
||||
<el-option
|
||||
v-for="item in hiddenState"
|
||||
:key="item.funall_control__value_data"
|
||||
:label="item.funall_control__display_data"
|
||||
:value="item.funall_control__value_data"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="检查人">
|
||||
<el-input v-model="form.hidden_danger__check_man" placeholder="请选择检查人" class="input-with-select" clearable>
|
||||
<el-button slot="append" icon="el-icon-search" @click="checkManVisible = !checkManVisible" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="检查部门">
|
||||
<el-input v-model="form.hidden_danger__check_dept" placeholder="请选择检查部门" class="input-with-select" clearable>
|
||||
<el-button slot="append" icon="el-icon-search" @click="checkDeptVisible = !checkDeptVisible" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="检查时间">
|
||||
<el-date-picker
|
||||
v-model="form.hidden_danger__check_date"
|
||||
type="date"
|
||||
placeholder="选择日期"
|
||||
style="width: 100%;"
|
||||
format="yyyy-MM-dd"
|
||||
value-format="yyyy-MM-dd"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="检查地点">
|
||||
<el-input v-model="form.hidden_danger__check_location" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="检查内容">
|
||||
<el-input v-model="form.hidden_danger__check_content" type="textarea" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="隐患描述" prop="hidden_danger__check_problem">
|
||||
<el-input v-model="form.hidden_danger__check_problem" type="textarea" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="整改人">
|
||||
<el-input v-model="form.hidden_danger__reform_man" placeholder="请选择整改人" class="input-with-select" clearable>
|
||||
<el-button slot="append" icon="el-icon-search" @click="reformManVisible = !reformManVisible" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="整改部门">
|
||||
<el-input v-model="form.hidden_danger__reform_dept" placeholder="请选择检查部门" class="input-with-select" clearable>
|
||||
<el-button slot="append" icon="el-icon-search" @click="reformDeptVisible = !reformDeptVisible" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="整改期限">
|
||||
<el-date-picker
|
||||
v-model="form.hidden_danger__reform_limit"
|
||||
type="date"
|
||||
placeholder="选择日期"
|
||||
style="width: 100%;"
|
||||
format="yyyy-MM-dd"
|
||||
value-format="yyyy-MM-dd"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</el-card>
|
||||
<el-dialog
|
||||
v-if="checkManVisible"
|
||||
title="选择人员"
|
||||
:visible.sync="checkManVisible"
|
||||
width="60%"
|
||||
>
|
||||
<SelUser ref="CheckMan" @updateUser="getCheckMan" />
|
||||
<span>
|
||||
<el-button @click="checkManVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="selCheckMan">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
v-if="reformManVisible"
|
||||
title="选择人员"
|
||||
:visible.sync="reformManVisible"
|
||||
width="60%"
|
||||
>
|
||||
<SelUser ref="ReformMan" @updateUser="getReformMan" />
|
||||
<span>
|
||||
<el-button @click="reformManVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="selReformMan">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
v-if="checkDeptVisible"
|
||||
class="selDept"
|
||||
title="选择部门"
|
||||
:visible.sync="checkDeptVisible"
|
||||
width="60%"
|
||||
:modal="false"
|
||||
>
|
||||
<SelDept ref="CheckDept" @updateDept="getCheckDept" />
|
||||
<span>
|
||||
<el-button @click="checkDeptVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="selCheckDept">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
v-if="reformDeptVisible"
|
||||
class="selDept"
|
||||
title="选择部门"
|
||||
:visible.sync="reformDeptVisible"
|
||||
width="60%"
|
||||
:modal="false"
|
||||
>
|
||||
<SelDept ref="ReformDept" @updateDept="getReformDept" />
|
||||
<span>
|
||||
<el-button @click="reformDeptVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="selReformDept">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import api from '../../api'
|
||||
import publicApi from '@/api/public'
|
||||
import buttons from '@/components/formBtn'
|
||||
import SelUser from '@/components/selUser'
|
||||
import SelDept from '@/components/selDept'
|
||||
export default {
|
||||
name: 'AuditForm',
|
||||
components: {
|
||||
buttons,
|
||||
SelUser,
|
||||
SelDept
|
||||
},
|
||||
// props: {
|
||||
// id: { type: String, default: () => '' }
|
||||
// },
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
form: {
|
||||
hidden_danger__hidden_code: '',
|
||||
hidden_danger__hidden_state: '1',
|
||||
hidden_danger__check_man: '',
|
||||
hidden_danger__check_dept: '',
|
||||
hidden_danger__check_date: '',
|
||||
hidden_danger__check_location: '',
|
||||
hidden_danger__check_content: '',
|
||||
hidden_danger__check_problem: '',
|
||||
hidden_danger__reform_man: '',
|
||||
hidden_danger__reform_dept: '',
|
||||
hidden_danger__reform_limit: '',
|
||||
hidden_danger__check_photo: '',
|
||||
hidden_danger__more_flag: '',
|
||||
hidden_danger__safe_insp_id: '',
|
||||
hidden_danger__reform_man_id: '',
|
||||
hidden_danger__reform_dept_id: '',
|
||||
hidden_danger__org_id: '',
|
||||
hidden_danger__insp_det_id: '',
|
||||
hidden_danger__hidden_danger_id: '',
|
||||
hidden_danger__dept_id: '',
|
||||
hidden_danger__check_man_id: '',
|
||||
hidden_danger__check_dept_id: ''
|
||||
},
|
||||
rules: {
|
||||
hidden_danger__check_problem: [
|
||||
{ required: true, message: '请输入隐患描述', trigger: 'blur' }
|
||||
]
|
||||
},
|
||||
inspName: [],
|
||||
disabled: false,
|
||||
options: [],
|
||||
checkManVisible: false,
|
||||
reformManVisible: false,
|
||||
checkDeptVisible: false,
|
||||
reformDeptVisible: false,
|
||||
inspNameVisible: false,
|
||||
id: '',
|
||||
hiddenState: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getHiddenState()
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
this.loading = true
|
||||
api.getFormDate().then(data => {
|
||||
if (data.success) {
|
||||
this.form = data.data.root[0]
|
||||
setTimeout(() => {
|
||||
this.loading = false
|
||||
}, 200)
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
async getHiddenState() {
|
||||
await publicApi.getTypeSel('hiddenstate').then(data => {
|
||||
if (data.success) {
|
||||
this.hiddenState = data.data.root
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
onSubmit() {},
|
||||
getCheckMan(data) {
|
||||
this.form.hidden_danger__check_man = data.sys_user__user_name
|
||||
this.form.hidden_danger__check_man_id = data.sys_user__user_id
|
||||
this.form.hidden_danger__check_dept = data.sys_dept__dept_name
|
||||
this.form.hidden_danger__check_dept_id = data.sys_user__dept_id
|
||||
this.checkManVisible = false
|
||||
},
|
||||
selCheckMan() {
|
||||
this.getCheckMans(this.$refs.CheckMan.Users)
|
||||
this.checkManVisible = false
|
||||
},
|
||||
getCheckMans(data) {
|
||||
this.form.hidden_danger__check_man = data.map(d => { return d.sys_user__user_name }).join(';')
|
||||
this.form.hidden_danger__check_man_id = data.map(d => { return d.sys_user__user_id }).join(';')
|
||||
this.form.hidden_danger__check_dept = data.map(d => { return d.sys_dept__dept_name }).join(';')
|
||||
this.form.hidden_danger__check_dept_id = data.map(d => { return d.sys_user__dept_id }).join(';')
|
||||
this.checkManVisible = false
|
||||
},
|
||||
getReformMan(data) {
|
||||
this.form.hidden_danger__reform_man = data.sys_user__user_name
|
||||
this.form.hidden_danger__reform_man_id = data.sys_user__user_id
|
||||
this.form.hidden_danger__reform_dept = data.sys_dept__dept_name
|
||||
this.form.hidden_danger__reform_dept_id = data.sys_user__dept_id
|
||||
this.reformManVisible = false
|
||||
},
|
||||
selReformMan() {
|
||||
this.getReformMans(this.$refs.ReformMan.Users)
|
||||
this.reformManVisible = false
|
||||
},
|
||||
getReformMans(data) {
|
||||
this.form.hidden_danger__reform_man = data.map(d => { return d.sys_user__user_name }).join(';')
|
||||
this.form.hidden_danger__reform_man_id = data.map(d => { return d.sys_user__user_id }).join(';')
|
||||
this.form.hidden_danger__reform_dept = data.map(d => { return d.sys_dept__dept_name }).join(';')
|
||||
this.form.hidden_danger__reform_dept_id = data.map(d => { return d.sys_user__dept_id }).join(';')
|
||||
this.reformManVisible = false
|
||||
},
|
||||
getCheckDept(data) {
|
||||
this.form.hidden_danger__check_dept = data.sys_dept__dept_name
|
||||
this.form.hidden_danger__check_dept_id = data.sys_dept__dept_id
|
||||
this.checkDeptVisible = false
|
||||
},
|
||||
selCheckDept() {
|
||||
this.CheckDepts(this.$refs.CheckDept.Dpets)
|
||||
},
|
||||
CheckDepts(data) {
|
||||
this.form.hidden_danger__check_dept = data.map(d => { return d.sys_dept__dept_name }).join(';')
|
||||
this.form.hidden_danger__check_dept_id = data.map(d => { return d.sys_dept__dept_id }).join(';')
|
||||
this.checkDeptVisible = false
|
||||
},
|
||||
getReformDept(data) {
|
||||
this.form.hidden_danger__reform_dept = data.sys_dept__dept_name
|
||||
this.form.hidden_danger__reform_dept_id = data.sys_dept__dept_id
|
||||
this.reformDeptVisible = false
|
||||
},
|
||||
selReformDept() {
|
||||
this.ReformDepts(this.$refs.ReformDept.Dpets)
|
||||
},
|
||||
ReformDepts(data) {
|
||||
this.form.hidden_danger__reform_dept = data.map(d => { return d.sys_dept__dept_name }).join(';')
|
||||
this.form.hidden_danger__reform_dept_id = data.map(d => { return d.sys_dept__dept_id }).join(';')
|
||||
this.reformDeptVisible = false
|
||||
},
|
||||
save() {
|
||||
this.$refs['form'].validate((valid) => {
|
||||
if (valid) {
|
||||
api.Crerte(this.form).then(data => {
|
||||
if (data.success) {
|
||||
this.$message.success('保存成功！')
|
||||
const param = `/hidden_danger/hidden_check/audit/${data.data.keyid}`
|
||||
this.$router.push(param)
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
back() {
|
||||
// this.$router__back(-1)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
::v-deep .el-dialog__body {
|
||||
padding: 10px 20px !important;
|
||||
}
|
||||
::v-deep .el-form-item__label {
|
||||
text-align: right;
|
||||
/* vertical-align: middle; */
|
||||
float: left;
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
line-height: 40px;
|
||||
padding: 0 6px 0 0;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.el-col{
|
||||
margin-left: 2%;
|
||||
}
|
||||
</style>
|
||||
428
src/views/hidden_review/components/edit_form/index.vue
Normal file
428
src/views/hidden_review/components/edit_form/index.vue
Normal file
@ -0,0 +1,428 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-card>
|
||||
<buttons funid="hidden_check" style="margin-bottom:20px" @save="save" />
|
||||
<el-form ref="form" :model="form" label-width="80px" :rules="rules">
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="隐患编号">
|
||||
<el-input v-model="form.hidden_danger__hidden_code" :disabled="!disabled" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="巡检状态">
|
||||
<el-select v-model="form.hidden_danger__hidden_state" placeholder="请选择" :disabled="!disabled">
|
||||
<el-option
|
||||
v-for="item in hiddenState"
|
||||
:key="item.funall_control__value_data"
|
||||
:label="item.funall_control__display_data"
|
||||
:value="item.funall_control__value_data"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="检查人">
|
||||
<el-input v-model="form.hidden_danger__check_man" placeholder="请选择检查人" class="input-with-select" clearable :disabled="!disabled">
|
||||
<el-button slot="append" icon="el-icon-search" @click="checkManVisible = !checkManVisible" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="检查部门">
|
||||
<el-input v-model="form.hidden_danger__check_dept" placeholder="请选择检查部门" class="input-with-select" clearable :disabled="!disabled">
|
||||
<el-button slot="append" icon="el-icon-search" @click="checkDeptVisible = !checkDeptVisible" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="检查时间">
|
||||
<el-date-picker
|
||||
v-model="form.hidden_danger__check_date"
|
||||
type="date"
|
||||
placeholder="选择日期"
|
||||
style="width: 100%;"
|
||||
format="yyyy-MM-dd"
|
||||
value-format="yyyy-MM-dd"
|
||||
:disabled="!disabled"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="检查地点">
|
||||
<el-input v-model="form.hidden_danger__check_location" :disabled="!disabled" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="检查内容">
|
||||
<el-input v-model="form.hidden_danger__check_content" type="textarea" :disabled="!disabled" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="隐患描述" prop="hidden_danger__check_problem">
|
||||
<el-input v-model="form.hidden_danger__check_problem" type="textarea" :disabled="!disabled" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="整改人">
|
||||
<el-input v-model="form.hidden_danger__reform_man" placeholder="请选择整改人" class="input-with-select" clearable :disabled="!disabled">
|
||||
<el-button slot="append" icon="el-icon-search" @click="reformManVisible = !reformManVisible" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="整改部门">
|
||||
<el-input v-model="form.hidden_danger__reform_dept" placeholder="请选择检查部门" class="input-with-select" clearable :disabled="!disabled">
|
||||
<el-button slot="append" icon="el-icon-search" @click="reformDeptVisible = !reformDeptVisible" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="整改期限">
|
||||
<el-date-picker
|
||||
v-model="form.hidden_danger__reform_limit"
|
||||
type="date"
|
||||
placeholder="选择日期"
|
||||
style="width: 100%;"
|
||||
format="yyyy-MM-dd"
|
||||
value-format="yyyy-MM-dd"
|
||||
:disabled="!disabled"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="整改时间" prop="hidden_danger__reform_date">
|
||||
<el-date-picker
|
||||
v-model="form.hidden_danger__reform_date"
|
||||
type="date"
|
||||
placeholder="选择日期"
|
||||
style="width: 100%;"
|
||||
format="yyyy-MM-dd"
|
||||
value-format="yyyy-MM-dd"
|
||||
:disabled="!disabled"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="投入费用">
|
||||
<el-input v-model="form.hidden_danger__reform_money" placeholder="请输入安全投入费用" class="input-with-select" clearable :disabled="!disabled" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="整改情况">
|
||||
<el-input v-model="form.hidden_danger__reform_desc" placeholder="请输入整改情况" class="input-with-select" type="textarea" clearable :disabled="!disabled" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="验收时间" prop="hidden_danger__review_date">
|
||||
<el-date-picker
|
||||
v-model="form.hidden_danger__review_date"
|
||||
type="date"
|
||||
placeholder="选择日期"
|
||||
style="width: 100%;"
|
||||
format="yyyy-MM-dd"
|
||||
value-format="yyyy-MM-dd"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="验收人">
|
||||
<el-input v-model="form.hidden_danger__review_man" placeholder="请选择验收人" class="input-with-select" clearable>
|
||||
<el-button slot="append" icon="el-icon-search" @click="reviewManVisible = !reviewManVisible" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="验收情况">
|
||||
<el-input v-model="form.hidden_danger__review_desc" placeholder="请输入整改情况" class="input-with-select" type="textarea" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</el-card>
|
||||
<el-dialog
|
||||
v-if="checkManVisible"
|
||||
title="选择人员"
|
||||
:visible.sync="checkManVisible"
|
||||
width="60%"
|
||||
>
|
||||
<SelUser ref="CheckMan" @updateUser="getCheckMan" />
|
||||
<span>
|
||||
<el-button @click="checkManVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="selCheckMan">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
v-if="reformManVisible"
|
||||
title="选择人员"
|
||||
:visible.sync="reformManVisible"
|
||||
width="60%"
|
||||
>
|
||||
<SelUser ref="ReformMan" @updateUser="getReformMan" />
|
||||
<span>
|
||||
<el-button @click="reformManVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="selReformMan">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
v-if="reviewManVisible"
|
||||
title="选择人员"
|
||||
:visible.sync="reviewManVisible"
|
||||
width="60%"
|
||||
>
|
||||
<SelUser ref="eviewMan" @updateUser="getReviewMan" />
|
||||
<span>
|
||||
<el-button @click="reviewManVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="selReviewMan">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
v-if="checkDeptVisible"
|
||||
class="selDept"
|
||||
title="选择部门"
|
||||
:visible.sync="checkDeptVisible"
|
||||
width="60%"
|
||||
:modal="false"
|
||||
>
|
||||
<SelDept ref="CheckDept" @updateDept="getCheckDept" />
|
||||
<span>
|
||||
<el-button @click="checkDeptVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="selCheckDept">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
v-if="reformDeptVisible"
|
||||
class="selDept"
|
||||
title="选择部门"
|
||||
:visible.sync="reformDeptVisible"
|
||||
width="60%"
|
||||
:modal="false"
|
||||
>
|
||||
<SelDept ref="ReformDept" @updateDept="getReformDept" />
|
||||
<span>
|
||||
<el-button @click="reformDeptVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="selReformDept">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import api from '../../api'
|
||||
import publicApi from '@/api/public'
|
||||
import buttons from '@/components/formBtn'
|
||||
import SelUser from '@/components/selUser'
|
||||
import SelDept from '@/components/selDept'
|
||||
export default {
|
||||
name: 'AuditForm',
|
||||
components: {
|
||||
buttons,
|
||||
SelUser,
|
||||
SelDept
|
||||
},
|
||||
// props: {
|
||||
// id: { type: String, default: () => '' }
|
||||
// },
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
id: this.$route.params.id,
|
||||
form: {
|
||||
hidden_danger__hidden_code: '',
|
||||
hidden_danger__hidden_state: '',
|
||||
hidden_danger__check_man: '',
|
||||
hidden_danger__check_dept: '',
|
||||
hidden_danger__check_date: '',
|
||||
hidden_danger__check_location: '',
|
||||
hidden_danger__check_content: '',
|
||||
hidden_danger__check_problem: '',
|
||||
hidden_danger__reform_man: '',
|
||||
hidden_danger__reform_dept: '',
|
||||
hidden_danger__reform_limit: '',
|
||||
hidden_danger__check_photo: '',
|
||||
hidden_danger__more_flag: '',
|
||||
hidden_danger__reform_date: '',
|
||||
hidden_danger__reform_money: '',
|
||||
hidden_danger__reform_desc: '',
|
||||
hidden_danger__reform_photo: '',
|
||||
hidden_danger__safe_insp_id: '',
|
||||
hidden_danger__reform_man_id: '',
|
||||
hidden_danger__org_id: '',
|
||||
hidden_danger__reform_dept_id: '',
|
||||
hidden_danger__insp_det_id: '',
|
||||
hidden_danger__hidden_danger_id: '',
|
||||
hidden_danger__dept_id: '',
|
||||
hidden_danger__check_man_id: '',
|
||||
hidden_danger__check_dept_id: ''
|
||||
},
|
||||
rules: {
|
||||
hidden_danger__reform_date: [
|
||||
{ required: true, message: '请选择整改时间', trigger: 'blur' }
|
||||
]
|
||||
},
|
||||
inspName: [],
|
||||
disabled: false,
|
||||
options: [],
|
||||
checkManVisible: false,
|
||||
reformManVisible: false,
|
||||
checkDeptVisible: false,
|
||||
reformDeptVisible: false,
|
||||
reviewManVisible: false,
|
||||
hiddenState: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
this.getHiddenState()
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
this.loading = true
|
||||
api.getFormDate(this.id).then(data => {
|
||||
if (data.success) {
|
||||
this.form = data.data.root[0]
|
||||
setTimeout(() => {
|
||||
this.loading = false
|
||||
}, 200)
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
async getHiddenState() {
|
||||
await publicApi.getTypeSel('hiddenstate').then(data => {
|
||||
if (data.success) {
|
||||
this.hiddenState = data.data.root
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
onSubmit() {},
|
||||
getCheckMan(data) {
|
||||
this.form.hidden_danger__check_man = data.sys_user__user_name
|
||||
this.form.hidden_danger__check_man_id = data.sys_user__user_id
|
||||
this.form.hidden_danger__check_dept = data.sys_dept__dept_name
|
||||
this.form.hidden_danger__check_dept_id = data.sys_user__dept_id
|
||||
this.checkManVisible = false
|
||||
},
|
||||
selCheckMan() {
|
||||
this.getCheckMans(this.$refs.CheckMan.Users)
|
||||
this.checkManVisible = false
|
||||
},
|
||||
getCheckMans(data) {
|
||||
this.form.hidden_danger__check_man = data.map(d => { return d.sys_user__user_name }).join(';')
|
||||
this.form.hidden_danger__check_man_id = data.map(d => { return d.sys_user__user_id }).join(';')
|
||||
this.form.hidden_danger__check_dept = data.map(d => { return d.sys_dept__dept_name }).join(';')
|
||||
this.form.hidden_danger__check_dept_id = data.map(d => { return d.sys_user__dept_id }).join(';')
|
||||
this.checkManVisible = false
|
||||
},
|
||||
getReformMan(data) {
|
||||
this.form.hidden_danger__reform_man = data.sys_user__user_name
|
||||
this.form.hidden_danger__reform_man_id = data.sys_user__user_id
|
||||
this.form.hidden_danger__reform_dept = data.sys_dept__dept_name
|
||||
this.form.hidden_danger__reform_dept_id = data.sys_user__dept_id
|
||||
this.reformManVisible = false
|
||||
},
|
||||
selReformMan() {
|
||||
this.getReformMans(this.$refs.ReformMan.Users)
|
||||
this.reformManVisible = false
|
||||
},
|
||||
getReformMans(data) {
|
||||
this.form.hidden_danger__reform_man = data.map(d => { return d.sys_user__user_name }).join(';')
|
||||
this.form.hidden_danger__reform_man_id = data.map(d => { return d.sys_user__user_id }).join(';')
|
||||
this.form.hidden_danger__reform_dept = data.map(d => { return d.sys_dept__dept_name }).join(';')
|
||||
this.form.hidden_danger__reform_dept_id = data.map(d => { return d.sys_user__dept_id }).join(';')
|
||||
this.reformManVisible = false
|
||||
},
|
||||
getReviewMan(data) {
|
||||
this.form.hidden_danger__review_man = data.sys_user__user_name
|
||||
this.form.hidden_danger__review_man_id = data.sys_user__user_id
|
||||
this.reviewManVisible = false
|
||||
},
|
||||
selReviewMan() {
|
||||
this.getReformMans(this.$refs.ReviewMan.Users)
|
||||
this.reviewManVisible = false
|
||||
},
|
||||
getReviewMans(data) {
|
||||
this.form.hidden_danger__review_man = data.map(d => { return d.sys_user__user_name }).join(';')
|
||||
this.form.hidden_danger__review_man_id = data.map(d => { return d.sys_user__user_id }).join(';')
|
||||
this.reviewManVisible = false
|
||||
},
|
||||
getCheckDept(data) {
|
||||
this.form.hidden_danger__check_dept = data.sys_dept__dept_name
|
||||
this.form.hidden_danger__check_dept_id = data.sys_dept__dept_id
|
||||
this.checkDeptVisible = false
|
||||
},
|
||||
selCheckDept() {
|
||||
this.CheckDepts(this.$refs.CheckDept.Dpets)
|
||||
},
|
||||
CheckDepts(data) {
|
||||
this.form.hidden_danger__check_dept = data.map(d => { return d.sys_dept__dept_name }).join(';')
|
||||
this.form.hidden_danger__check_dept_id = data.map(d => { return d.sys_dept__dept_id }).join(';')
|
||||
this.checkDeptVisible = false
|
||||
},
|
||||
getReformDept(data) {
|
||||
this.form.hidden_danger__reform_dept = data.sys_dept__dept_name
|
||||
this.form.hidden_danger__reform_dept_id = data.sys_dept__dept_id
|
||||
this.reformDeptVisible = false
|
||||
},
|
||||
selReformDept() {
|
||||
this.ReformDepts(this.$refs.ReformDept.Dpets)
|
||||
},
|
||||
ReformDepts(data) {
|
||||
this.form.hidden_danger__reform_dept = data.map(d => { return d.sys_dept__dept_name }).join(';')
|
||||
this.form.hidden_danger__reform_dept_id = data.map(d => { return d.sys_dept__dept_id }).join(';')
|
||||
this.reformDeptVisible = false
|
||||
},
|
||||
save() {
|
||||
this.$refs['form'].validate((valid) => {
|
||||
if (valid) {
|
||||
api.Save(this.form).then(data => {
|
||||
if (data.success) {
|
||||
this.$message.success('保存成功！')
|
||||
// const param = `/insp/edit_form/audit/${data.data.keyid}`
|
||||
// this.$router__push(param)
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
back() {
|
||||
// this.$router__back(-1)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
::v-deep .el-dialog__body {
|
||||
padding: 10px 20px !important;
|
||||
}
|
||||
::v-deep .el-form-item__label {
|
||||
text-align: right;
|
||||
/* vertical-align: middle; */
|
||||
float: left;
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
line-height: 40px;
|
||||
padding: 0 6px 0 0;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.el-col{
|
||||
margin-left: 2%;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,266 @@
|
||||
<template>
|
||||
<div>
|
||||
<buttons funid="hidden_review" style="margin:10px 10px" @Create="editCreate" @Del="editDelete" @editSave="editSave" @upload="upload" />
|
||||
<el-card>
|
||||
<el-table
|
||||
ref="deptTable"
|
||||
v-loading="loading"
|
||||
:data="data"
|
||||
style="width: 100%"
|
||||
@selection-change="handleSelectionChange"
|
||||
@cell-dblclick="cellDblclick"
|
||||
>
|
||||
<template v-for="(d,i) in tableHeader">
|
||||
<el-table-column v-if="d.type && d.type === 'selection'" :key="i" :type="d.type" :fixed="d.fixed" />
|
||||
<el-table-column
|
||||
v-else
|
||||
:key="i"
|
||||
:prop="d.prop"
|
||||
:label="d.label"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<div v-if="d.label==='隐患状态'">
|
||||
{{
|
||||
scope.row.hidden_danger__hidden_state == 1 ? '排查中' : scope.row.hidden_danger__hidden_state == 2 ? '待整改' :scope.row.hidden_danger__hidden_state == 3 ? '整改中' :scope.row.hidden_danger__hidden_state == 4 ? '待验收' : '已验收'
|
||||
}}
|
||||
</div>
|
||||
<div v-else-if="d.label === '操作'">
|
||||
<el-button icon="el-icon-view" type="text" title="编辑" @click="edit(scope.row)" />
|
||||
<el-button v-if="scope.row.status !== 'NULLIFY'" icon="el-icon-delete" style="color:#F56C6C" type="text" title="删除" @click="Delete(scope.row)" />
|
||||
</div>
|
||||
<div v-else>{{ scope.row[d.prop] }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</template>
|
||||
</el-table>
|
||||
<el-pagination
|
||||
:current-page="pager.pageNo"
|
||||
:page-sizes="[10, 30, 50, 100, 500]"
|
||||
:page-size="pager.pageSize"
|
||||
:total="pager.total"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
@size-change="sizeChange"
|
||||
@current-change="pageChange"
|
||||
/>
|
||||
</el-card>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import api from './api'
|
||||
import buttons from '@/components/Buttons'
|
||||
export default {
|
||||
name: 'SafeIdsp',
|
||||
components: {
|
||||
buttons
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
data: [],
|
||||
deptTree: [],
|
||||
ids: [],
|
||||
levels: [],
|
||||
pager: {
|
||||
pageNo: 0,
|
||||
pageSize: 10,
|
||||
total: 0
|
||||
},
|
||||
tableHeader: [
|
||||
{
|
||||
prop: 'selection',
|
||||
type: 'selection',
|
||||
fixed: 'left'
|
||||
}, {
|
||||
prop: 'hidden_danger__hidden_code',
|
||||
label: '隐患编号'
|
||||
}, {
|
||||
prop: 'hidden_danger__hidden_state',
|
||||
label: '隐患状态'
|
||||
}, {
|
||||
prop: 'hidden_danger__check_man',
|
||||
label: '检查人'
|
||||
}, {
|
||||
prop: 'hidden_danger__check_dept',
|
||||
label: '检查部门'
|
||||
},
|
||||
{
|
||||
prop: 'hidden_danger__check_date',
|
||||
label: '检查时间'
|
||||
}, {
|
||||
prop: 'hidden_danger__check_location',
|
||||
label: '隐患描述'
|
||||
}, {
|
||||
prop: 'hidden_danger__check_content',
|
||||
label: '隐患描述'
|
||||
}, {
|
||||
prop: 'hidden_danger__reform_dept',
|
||||
label: '整改人'
|
||||
}, {
|
||||
prop: 'hidden_danger__reform_man',
|
||||
label: '整改部门'
|
||||
}, {
|
||||
prop: 'hidden_danger__reform_limit',
|
||||
label: '整改期限'
|
||||
}, {
|
||||
prop: 'opration',
|
||||
label: '操作',
|
||||
width: '70px',
|
||||
fixed: 'right',
|
||||
minWidth: '70px',
|
||||
show: true
|
||||
}],
|
||||
value: '',
|
||||
dept_id: '',
|
||||
level: '',
|
||||
id: '',
|
||||
parent_id: '',
|
||||
form: {
|
||||
dept_name: '',
|
||||
dept_code: '',
|
||||
memo: ''
|
||||
},
|
||||
rules: {
|
||||
dept_code: [
|
||||
{ required: true, message: '请输入部门编码', trigger: 'blur' }
|
||||
],
|
||||
dept_name: [
|
||||
{ required: true, message: '请输入部门名称', trigger: 'blur' }
|
||||
|
||||
]
|
||||
},
|
||||
formLabelWidth: '120px',
|
||||
auditForm: {},
|
||||
saveFrom: {},
|
||||
treeData: [],
|
||||
defaultProps: {
|
||||
children: 'children',
|
||||
label: 'sys_dept__dept_name'
|
||||
},
|
||||
treeList: [],
|
||||
whereSql: false,
|
||||
whereValue: ''
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
this.loading = true
|
||||
let pageNo = this.pager.pageNo * this.pager.pageSize - this.pager.pageSize
|
||||
if (pageNo < 0) {
|
||||
pageNo = 0
|
||||
}
|
||||
api.getDate(
|
||||
this.pager.pageSize,
|
||||
pageNo,
|
||||
this.whereSql,
|
||||
this.whereValue
|
||||
).then(data => {
|
||||
if (data.success) {
|
||||
this.data = data.data.root
|
||||
this.pager.total = data.data.total
|
||||
setTimeout(() => {
|
||||
this.loading = false
|
||||
}, 200)
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
editCreate() {
|
||||
const param = `/hidden_danger/hidden_review/create`
|
||||
this.$router.push(param)
|
||||
},
|
||||
Delete(row) {
|
||||
this.ids = []
|
||||
this.ids.push(row.hidden_danger__hidden_danger_id)
|
||||
this.editDelete()
|
||||
},
|
||||
editDelete() {
|
||||
if (this.ids && this.ids.length > 0) {
|
||||
this.$confirm('确认删除？').then(() => {
|
||||
api.Delete(this.ids).then(data => {
|
||||
if (data.success) {
|
||||
this.getList()
|
||||
this.$message.success('删除成功！')
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
}).catch(() => {})
|
||||
} else {
|
||||
this.$message.warning('请选择数据进行删除')
|
||||
}
|
||||
},
|
||||
editSave() {
|
||||
console.log('editSave')
|
||||
},
|
||||
upload() {
|
||||
console.log('upload')
|
||||
},
|
||||
edit(row) {
|
||||
const param = `/hidden_danger/hidden_review/audit/${row.hidden_danger__hidden_danger_id}`
|
||||
this.$router.push(param)
|
||||
},
|
||||
auditFormChange(form) {
|
||||
this.saveFrom = form
|
||||
},
|
||||
save() {
|
||||
if (Object.keys(this.saveFrom).length === 0) {
|
||||
this.saveFrom = this.auditForm
|
||||
}
|
||||
this.$refs.auditForm.$refs.auditForm.validate(valid => {
|
||||
if (valid) {
|
||||
const _form = `funid=sys_dept&parentId=&levelCol=sys_dept.dept_level&keyid=${this.id}&pagetype=editgrid&eventcode=save_eg&sys_dept__dept_code=${this.saveFrom.sys_dept__dept_code}&sys_dept__dept_name=${this.saveFrom.sys_dept__dept_name}&sys_dept__memo=${this.saveFrom.sys_dept__memo}&sys_dept__is_novalid=${this.saveFrom.sys_dept__is_novalid}&sys_dept__dept_id=${this.id}&sys_dept__dept_level=${this.saveFrom.sys_dept__dept_level}&user_id=administrator&dataType=json`
|
||||
api.auditSave(_form).then(data => {
|
||||
if (data.success) {
|
||||
this.whereSql = false
|
||||
this.whereValue = ''
|
||||
this.getList()
|
||||
this.$message.success('保存成功！')
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
cellDblclick(row) {
|
||||
const param = `/hidden_danger/hidden_review/audit/${row.hidden_danger__hidden_danger_id}`
|
||||
this.$router.push(param)
|
||||
},
|
||||
sizeChange(size) {
|
||||
this.pager.pageSize = size
|
||||
this.getList()
|
||||
},
|
||||
pageChange(page) {
|
||||
this.pager.pageNo = page
|
||||
this.getList()
|
||||
},
|
||||
handleSelectionChange(val) {
|
||||
this.ids = val.map(d => d.hidden_danger__hidden_danger_id)
|
||||
},
|
||||
closeDialog() {
|
||||
this.$refs['form'].resetFields()
|
||||
this.form.dept_name = ''
|
||||
this.form.dept_code = ''
|
||||
},
|
||||
handleNodeClick(data) {
|
||||
console.log(data)
|
||||
this.whereValue = encodeURI(`${data.sys_dept__dept_id}\%`)
|
||||
this.whereSql = true
|
||||
this.getList()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.el-card {
|
||||
margin-top: 10px;
|
||||
}
|
||||
</style>
|
||||
@ -1,3 +0,0 @@
|
||||
const elementIcons = ['platform-eleme', 'eleme', 'delete-solid', 'delete', 's-tools', 'setting', 'user-solid', 'user', 'phone', 'phone-outline', 'more', 'more-outline', 'star-on', 'star-off', 's-goods', 'goods', 'warning', 'warning-outline', 'question', 'info', 'remove', 'circle-plus', 'success', 'error', 'zoom-in', 'zoom-out', 'remove-outline', 'circle-plus-outline', 'circle-check', 'circle-close', 's-help', 'help', 'minus', 'plus', 'check', 'close', 'picture', 'picture-outline', 'picture-outline-round', 'upload', 'upload2', 'download', 'camera-solid', 'camera', 'video-camera-solid', 'video-camera', 'message-solid', 'bell', 's-cooperation', 's-order', 's-platform', 's-fold', 's-unfold', 's-operation', 's-promotion', 's-home', 's-release', 's-ticket', 's-management', 's-open', 's-shop', 's-marketing', 's-flag', 's-comment', 's-finance', 's-claim', 's-custom', 's-opportunity', 's-data', 's-check', 's-grid', 'menu', 'share', 'd-caret', 'caret-left', 'caret-right', 'caret-bottom', 'caret-top', 'bottom-left', 'bottom-right', 'back', 'right', 'bottom', 'top', 'top-left', 'top-right', 'arrow-left', 'arrow-right', 'arrow-down', 'arrow-up', 'd-arrow-left', 'd-arrow-right', 'video-pause', 'video-play', 'refresh', 'refresh-right', 'refresh-left', 'finished', 'sort', 'sort-up', 'sort-down', 'rank', 'loading', 'view', 'c-scale-to-original', 'date', 'edit', 'edit-outline', 'folder', 'folder-opened', 'folder-add', 'folder-remove', 'folder-delete', 'folder-checked', 'tickets', 'document-remove', 'document-delete', 'document-copy', 'document-checked', 'document', 'document-add', 'printer', 'paperclip', 'takeaway-box', 'search', 'monitor', 'attract', 'mobile', 'scissors', 'umbrella', 'headset', 'brush', 'mouse', 'coordinate', 'magic-stick', 'reading', 'data-line', 'data-board', 'pie-chart', 'data-analysis', 'collection-tag', 'film', 'suitcase', 'suitcase-1', 'receiving', 'collection', 'files', 'notebook-1', 'notebook-2', 'toilet-paper', 'office-building', 'school', 'table-lamp', 'house', 'no-smoking', 'smoking', 'shopping-cart-full', 'shopping-cart-1', 'shopping-cart-2', 'shopping-bag-1', 'shopping-bag-2', 'sold-out', 'sell', 'present', 'box', 'bank-card', 'money', 'coin', 'wallet', 'discount', 'price-tag', 'news', 'guide', 'male', 'female', 'thumb', 'cpu', 'link', 'connection', 'open', 'turn-off', 'set-up', 'chat-round', 'chat-line-round', 'chat-square', 'chat-dot-round', 'chat-dot-square', 'chat-line-square', 'message', 'postcard', 'position', 'turn-off-microphone', 'microphone', 'close-notification', 'bangzhu', 'time', 'odometer', 'crop', 'aim', 'switch-button', 'full-screen', 'copy-document', 'mic', 'stopwatch', 'medal-1', 'medal', 'trophy', 'trophy-1', 'first-aid-kit', 'discover', 'place', 'location', 'location-outline', 'location-information', 'add-location', 'delete-location', 'map-location', 'alarm-clock', 'timer', 'watch-1', 'watch', 'lock', 'unlock', 'key', 'service', 'mobile-phone', 'bicycle', 'truck', 'ship', 'basketball', 'football', 'soccer', 'baseball', 'wind-power', 'light-rain', 'lightning', 'heavy-rain', 'sunrise', 'sunrise-1', 'sunset', 'sunny', 'cloudy', 'partly-cloudy', 'cloudy-and-sunny', 'moon', 'moon-night', 'dish', 'dish-1', 'food', 'chicken', 'fork-spoon', 'knife-fork', 'burger', 'tableware', 'sugar', 'dessert', 'ice-cream', 'hot-water', 'water-cup', 'coffee-cup', 'cold-drink', 'goblet', 'goblet-full', 'goblet-square', 'goblet-square-full', 'refrigerator', 'grape', 'watermelon', 'cherry', 'apple', 'pear', 'orange', 'coffee', 'ice-tea', 'ice-drink', 'milk-tea', 'potato-strips', 'lollipop', 'ice-cream-square', 'ice-cream-round']
|
||||
|
||||
export default elementIcons
|
||||
@ -1,101 +0,0 @@
|
||||
<template>
|
||||
<div class="icons-container">
|
||||
<aside>
|
||||
<a href="https://panjiachen.github.io/vue-element-admin-site/guide/advanced/icon.html" target="_blank">Add and use
|
||||
</a>
|
||||
</aside>
|
||||
<el-tabs type="border-card">
|
||||
<el-tab-pane label="Icons">
|
||||
<div class="grid">
|
||||
<div v-for="item of svgIcons" :key="item" @click="handleClipboard(generateIconCode(item),$event)">
|
||||
<el-tooltip placement="top">
|
||||
<div slot="content">
|
||||
{{ generateIconCode(item) }}
|
||||
</div>
|
||||
<div class="icon-item">
|
||||
<svg-icon :icon-class="item" class-name="disabled" />
|
||||
<span>{{ item }}</span>
|
||||
</div>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="Element-UI Icons">
|
||||
<div class="grid">
|
||||
<div v-for="item of elementIcons" :key="item" @click="handleClipboard(generateElementIconCode(item),$event)">
|
||||
<el-tooltip placement="top">
|
||||
<div slot="content">
|
||||
{{ generateElementIconCode(item) }}
|
||||
</div>
|
||||
<div class="icon-item">
|
||||
<i :class="'el-icon-' + item" />
|
||||
<span>{{ item }}</span>
|
||||
</div>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import clipboard from '@/utils/clipboard'
|
||||
import svgIcons from './svg-icons'
|
||||
import elementIcons from './element-icons'
|
||||
|
||||
export default {
|
||||
name: 'Icons',
|
||||
data() {
|
||||
return {
|
||||
svgIcons,
|
||||
elementIcons
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
generateIconCode(symbol) {
|
||||
return `<svg-icon icon-class="${symbol}" />`
|
||||
},
|
||||
generateElementIconCode(symbol) {
|
||||
return `<i class="el-icon-${symbol}" />`
|
||||
},
|
||||
handleClipboard(text, event) {
|
||||
clipboard(text, event)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.icons-container {
|
||||
margin: 10px 20px 0;
|
||||
overflow: hidden;
|
||||
|
||||
.grid {
|
||||
position: relative;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
|
||||
}
|
||||
|
||||
.icon-item {
|
||||
margin: 20px;
|
||||
height: 85px;
|
||||
text-align: center;
|
||||
width: 100px;
|
||||
float: left;
|
||||
font-size: 30px;
|
||||
color: #24292e;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
span {
|
||||
display: block;
|
||||
font-size: 16px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.disabled {
|
||||
pointer-events: none;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,10 +0,0 @@
|
||||
const req = require.context('../../icons/svg', false, /\.svg$/)
|
||||
const requireAll = requireContext => requireContext.keys()
|
||||
|
||||
const re = /\.\/(.*)\.svg/
|
||||
|
||||
const svgIcons = requireAll(req).map(i => {
|
||||
return i.match(re)[1]
|
||||
})
|
||||
|
||||
export default svgIcons
|
||||
@ -1,7 +0,0 @@
|
||||
<template>
|
||||
<div style="padding:30px;">
|
||||
<el-alert :closable="false" title="menu 1">
|
||||
<router-view />
|
||||
</el-alert>
|
||||
</div>
|
||||
</template>
|
||||
@ -1,7 +0,0 @@
|
||||
<template>
|
||||
<div style="padding:30px;">
|
||||
<el-alert :closable="false" title="menu 1-1" type="success">
|
||||
<router-view />
|
||||
</el-alert>
|
||||
</div>
|
||||
</template>
|
||||
@ -1,7 +0,0 @@
|
||||
<template>
|
||||
<div style="padding:30px;">
|
||||
<el-alert :closable="false" title="menu 1-2" type="success">
|
||||
<router-view />
|
||||
</el-alert>
|
||||
</div>
|
||||
</template>
|
||||
@ -1,5 +0,0 @@
|
||||
<template functional>
|
||||
<div style="padding:30px;">
|
||||
<el-alert :closable="false" title="menu 1-2-1" type="warning" />
|
||||
</div>
|
||||
</template>
|
||||
@ -1,5 +0,0 @@
|
||||
<template functional>
|
||||
<div style="padding:30px;">
|
||||
<el-alert :closable="false" title="menu 1-2-2" type="warning" />
|
||||
</div>
|
||||
</template>
|
||||
@ -1,5 +0,0 @@
|
||||
<template functional>
|
||||
<div style="padding:30px;">
|
||||
<el-alert :closable="false" title="menu 1-3" type="success" />
|
||||
</div>
|
||||
</template>
|
||||
@ -1,5 +0,0 @@
|
||||
<template>
|
||||
<div style="padding:30px;">
|
||||
<el-alert :closable="false" title="menu 2" />
|
||||
</div>
|
||||
</template>
|
||||
@ -1,58 +0,0 @@
|
||||
const title = 'Plans for the Next Iteration of Vue.js'
|
||||
|
||||
const content = `<p>Last week at<a href="https://vuejs.london/summary" rel="nofollow">Vue.js London</a>I gave a brief sneak peek of what’s coming in the next major version of Vue. This post provides an in-depth overview of the plan.</p>
|
||||
<p><img class=" wscnph" src="https://wpimg.wallstcn.com/b8a1d7be-0b73-41b8-be8c-7c01c93cab66.png" data-wscntype="image" data-wscnh="742" data-wscnw="692" /></p>
|
||||
<h3>Why a new majorversion?</h3>
|
||||
<p>Vue 2.0 was released<a href="https://medium.com/the-vue-point/vue-2-0-is-here-ef1f26acf4b8" rel="nofollow">exactly two years ago</a>(how time flies!). During this period, the core has remained backwards compatible with five minor releases. We’ve accumulated a number of ideas that would bring improvements, but they were held off because they would result in breaking changes. At the same time, the JavaScript ecosystem and the language itself has been evolving rapidly. There are greatly improved tools that could enhance our workflow, and many new language features that could unlock simpler, more complete, and more efficient solutions to the problems Vue is trying to solve. What’s more exciting is that we are seeing ES2015 support becoming a baseline for all major evergreen browsers. Vue 3.0 aims to leverage these new language features to make Vue core smaller, faster, and more powerful.</p>
|
||||
<p>Vue 3.0 is currently in prototyping phase, and we have already implemented a runtime close to feature-parity with 2.x.<strong>Many of the items listed below are either already implemented, or confirmed to be feasible. Ones that are not yet implemented or still in exploration phase are marked with a *.</strong></p>
|
||||
<h3>The Details</h3>
|
||||
<h4>High-Level APIChanges</h4>
|
||||
<blockquote>TL;DR: Everything except render function API and scoped-slots syntax will either remain the same or can be made 2.x compatible via a compatibility build.</blockquote>
|
||||
<p>Since it’s a new major, there is going to be some breaking changes. However, we take backwards compatibility seriously, so we want to start communicating these changes as soon as possible. Here’s the currently planned public API changes:</p>
|
||||
<ul><li>Template syntax will remain 99% the same. There may be small tweaks in scoped slots syntax, but other than that we have no plans to change anything else for templates.</li><li>3.0 will support class-based components natively, with the aim to provide an API that is pleasant to use in native ES2015 without requiring any transpilation or stage-x features. Most current options will have a reasonable mapping in the class-based API. Stage-x features such as class fields and decorators can still be used optionally to enhance the authoring experience. In addition, the API is designed with TypeScript type inference in mind. The 3.x codebase will itself be written in TypeScript, and providing improved TypeScript support. (That said, usage of TypeScript in an application is still entirely optional.)</li><li>The 2.x object-based component format will still be supported by internally transforming the object to a corresponding class.</li><li>Mixins will still be supported.*</li><li>Top level APIs will likely receive an overhaul to avoid globally mutating the Vue runtime when installing plugins. Instead, plugins will be applied and scoped to a component tree. This will make it easier to test components that rely on specific plugins, and also make it possible to mount multiple Vue applications on the same page with different plugins, but using the same Vue runtime.*</li><li>Functional components can finally be plain functions —however, async components will now need to be explicitly created via a helper function.</li><li>The part that will receive the most changes is the Virtual DOM format used in render functions. We are currently collecting feedback from major library authors and will be sharing more details as we are more confident of the changes, but as long as you don’t heavily rely on hand-written (non-JSX) render functions in your app, upgrading should be a reasonably straightforward process.</li></ul>
|
||||
<h4>Source Code Architecture</h4>
|
||||
<blockquote>TL;DR: better decoupled internal modules, TypeScript, and a codebase that is easier to contribute to.</blockquote>
|
||||
<p>We are re-writing 3.0 from the ground up for a cleaner and more maintainable architecture, in particular trying to make it easier to contribute to. We are breaking some internal functionalities into individual packages in order to isolate the scope of complexity. For example, the observer module will become its own package, with its own public API and tests. Note this does not affect framework-level API— you will not have to manually import individual bits from multiple packages in order to use Vue. Instead, the final Vue package is assembled using these internal packages.</p>
|
||||
<p>The codebase is also now written in TypeScript. Although this will make proficiency in TypeScript a pre-requisite for contributing to the new codebase, we believe the type information and IDE support will actually make it easier for a new contributor to make meaningful contributions.</p>
|
||||
<p>Decoupling the observer and scheduler into separate packages also allows us to easily experiment with alternative implementations of these parts. For example, we can implement an IE11 compatible observer implementation with the same API, or an alternative scheduler that leverages<code>requestIdleCallback</code>to yield to the browser during long updates.*</p>
|
||||
<p><img class=" wscnph" src="https://wpimg.wallstcn.com/4d0b5fb2-d7f9-48fd-8f1b-03362b534dd9.png" data-wscntype="image" data-wscnh="716" data-wscnw="460" /></p>
|
||||
<h4>Observation Mechanism</h4>
|
||||
<blockquote>TL;DR: more complete, precise, efficient and debuggable reactivity tracking & API for creating observables.</blockquote>
|
||||
<p>3.0 will ship with a Proxy-based observer implementation that provides reactivity tracking with full language coverage. This eliminates a number of limitations of Vue 2’s current implementation based on<code>Object.defineProperty</code>:</p>
|
||||
<p>The new observer also features the following:</p>
|
||||
<p>Easily understand why a component is re-rendering</p>
|
||||
<p><img class=" wscnph" src="https://wpimg.wallstcn.com/a0c9d811-1ef9-4628-8976-f7c1aaa66da0.png" data-wscntype="image" data-wscnh="540" data-wscnw="789" /></p>
|
||||
<h4>Other Runtime Improvements</h4>
|
||||
<blockquote>TL;DR: smaller, faster, tree-shakable features, fragments & portals, custom renderer API.</blockquote>
|
||||
<h4>Compiler Improvements*</h4>
|
||||
<blockquote>TL;DR: tree-shaking friendly output, more AOT optimizations, parser with better error info and source map support.</blockquote>
|
||||
<h4>IE11 Support*</h4>
|
||||
<blockquote>TL;DR: it will be supported, but in a separate build with the same reactivity limitations of Vue 2.x.</blockquote>
|
||||
<p>The new codebase currently targets evergreen browsers only and assumes baseline native ES2015 support. But alas, we know a lot of our users still need to support IE11 for the foreseeable future. Most of the ES2015 features used can be transpiled / polyfilled for IE11, with the exception for Proxies. Our plan is to implement an alternative observer with the same API, but using the good old ES5<code>Object.defineProperty</code>API. A separate build of Vue 3.x will be distributed using this observer implementation. However, this build will be subject to the same change detection caveats of Vue 2.x and thus not fully compatible with the “modern” build of 3.x. We are aware that this imposes some inconvenience for library authors as they will need to be aware of compatibility for two different builds, but we will make sure to provide clear guidelines on this when we reach that stage.</p>
|
||||
<h3>How Do We GetThere</h3>
|
||||
<p>First of all, although we are announcing it today, we do not have a definitive timeline yet. What we do know at the moment is the steps we will be taking to get there:</p>
|
||||
<h4>1. Internal Feedback for the Runtime Prototype</h4>
|
||||
<p>This is the phase we are in right now. Currently, we already have a working runtime prototype that includes the new observer, Virtual DOM and component implementation. We have invited a group of authors of influential community projects to provide feedback for the internal changes, and would like to make sure they are comfortable with the changes before moving forward. We want to ensure that important libraries in the ecosystem will be ready at the same time when we release 3.0, so that users relying on those projects can upgrade easily.</p>
|
||||
<h4>2. Public Feedback viaRFCs</h4>
|
||||
<p>Once we gain a certain level of confidence in the new design, for each breaking change we will be opening a dedicated RFC issue which includes:</p>
|
||||
<p>We will anticipate public feedback from the wider community to help us consolidate these ideas.</p>
|
||||
<h4>3. Introduce Compatible Features in 2.x &2.x-next</h4>
|
||||
<p>We are not forgetting about 2.x! In fact, we plan to use 2.x to progressively accustom users to the new changes. We will be gradually introducing confirmed API changes into 2.x via opt-in adaptors, and 2.x-next will allow users to try out the new Proxy-based observer.</p>
|
||||
<p>The last minor release in 2.x will become LTS and continue to receive bug and security fixes for 18 months when 3.0 is released.</p>
|
||||
<h4>4. AlphaPhase</h4>
|
||||
<p>Next, we will finish up the compiler and server-side rendering parts of 3.0 and start making alpha releases. These will mostly be for stability testing purposes in small greenfield apps.</p>
|
||||
<h4>5. BetaPhase</h4>
|
||||
<p>During beta phase, our main goal is updating support libraries and tools like Vue Router, Vuex, Vue CLI, Vue DevTools and make sure they work smoothly with the new core. We will also be working with major library authors from the community to help them get ready for 3.0.</p>
|
||||
<h4>6. RCPhase</h4>
|
||||
<p>Once we consider the API and codebase stable, we will enter RC phase with API freeze. During this phase we will also work on a “compat build”: a build of 3.0 that includes compatibility layers for 2.x API. This build will also ship with a flag you can turn on to emit deprecation warnings for 2.x API usage in your app. The compat build can be used as a guide to upgrade your app to 3.0.</p>
|
||||
<h4>7. IE11build</h4>
|
||||
<p>The last task before the final release will be the IE11 compatibility build as mentioned above.</p>
|
||||
<h4>8. FinalRelease</h4>
|
||||
<p>In all honesty, we don’t know when this will happen yet, but likely in 2019. Again, we care more about shipping something that is solid and stable rather than hitting specific dates. There is a lot of work to be done, but we are excited for what’s coming next!</p>`
|
||||
|
||||
const data = {
|
||||
title,
|
||||
content
|
||||
}
|
||||
|
||||
export default data
|
||||
@ -1,201 +0,0 @@
|
||||
<template>
|
||||
<div v-loading.fullscreen.lock="fullscreenLoading" class="main-article" element-loading-text="Efforts to generate PDF">
|
||||
<div class="article__heading">
|
||||
<div class="article__heading__title">
|
||||
{{ article.title }}
|
||||
</div>
|
||||
</div>
|
||||
<div style="color: #ccc;">
|
||||
This article is from Evan You on <a target="_blank" href="https://medium.com/the-vue-point/plans-for-the-next-iteration-of-vue-js-777ffea6fabf">medium</a>
|
||||
</div>
|
||||
<div ref="content" class="node-article-content" v-html="article.content" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
article: '',
|
||||
fullscreenLoading: true
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
fetchData() {
|
||||
import('./content.js').then(data => {
|
||||
const { title } = data.default
|
||||
document.title = title
|
||||
this.article = data.default
|
||||
setTimeout(() => {
|
||||
this.fullscreenLoading = false
|
||||
this.$nextTick(() => {
|
||||
window.print()
|
||||
})
|
||||
}, 3000)
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@mixin clearfix {
|
||||
&:before {
|
||||
display: table;
|
||||
content: '';
|
||||
clear: both;
|
||||
}
|
||||
|
||||
&:after {
|
||||
display: table;
|
||||
content: '';
|
||||
clear: both;
|
||||
}
|
||||
}
|
||||
|
||||
.main-article {
|
||||
padding: 20px;
|
||||
margin: 0 auto;
|
||||
display: block;
|
||||
width: 740px;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.article__heading {
|
||||
position: relative;
|
||||
padding: 0 0 20px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.article__heading__title {
|
||||
display: block;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
line-clamp: 2;
|
||||
word-wrap: break-word;
|
||||
overflow-wrap: break-word;
|
||||
font-size: 32px;
|
||||
line-height: 48px;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.node-article-content {
|
||||
margin: 20px 0 0;
|
||||
@include clearfix;
|
||||
font-size: 16px;
|
||||
color: #333;
|
||||
letter-spacing: 0.5px;
|
||||
line-height: 28px;
|
||||
margin-bottom: 30px;
|
||||
font-family: medium-content-serif-font, Georgia, Cambria, "Times New Roman", Times, serif;
|
||||
|
||||
&> :last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
b,
|
||||
strong {
|
||||
font-weight: inherit;
|
||||
font-weight: bolder;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
p {
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 21px;
|
||||
line-height: 1.58;
|
||||
letter-spacing: -.003em;
|
||||
|
||||
}
|
||||
|
||||
ul {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
li {
|
||||
--x-height-multiplier: 0.375;
|
||||
--baseline-multiplier: 0.17;
|
||||
|
||||
letter-spacing: .01rem;
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-size: 21px;
|
||||
line-height: 1.58;
|
||||
letter-spacing: -.003em;
|
||||
margin-left: 30px;
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
background-repeat: repeat-x;
|
||||
background-image: linear-gradient(to right, rgba(0, 0, 0, .84) 100%, rgba(0, 0, 0, 0) 0);
|
||||
background-size: 1px 1px;
|
||||
background-position: 0 calc(1em + 1px);
|
||||
padding: 0 6px;
|
||||
}
|
||||
|
||||
code {
|
||||
background: rgba(0, 0, 0, .05);
|
||||
padding: 3px 4px;
|
||||
margin: 0 2px;
|
||||
font-size: 16px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
img {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
/* 解决 IE6-7 图片缩放锯齿问题 */
|
||||
img {
|
||||
-ms-interpolation-mode: bicubic;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
--x-height-multiplier: 0.375;
|
||||
--baseline-multiplier: 0.17;
|
||||
font-family: medium-content-serif-font, Georgia, Cambria, "Times New Roman", Times, serif;
|
||||
letter-spacing: .01rem;
|
||||
font-weight: 400;
|
||||
font-style: italic;
|
||||
font-size: 21px;
|
||||
line-height: 1.58;
|
||||
letter-spacing: -.003em;
|
||||
border-left: 3px solid rgba(0, 0, 0, .84);
|
||||
padding-left: 20px;
|
||||
margin-left: -23px;
|
||||
padding-bottom: 2px;
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
h2,
|
||||
h3,
|
||||
h4 {
|
||||
font-size: 34px;
|
||||
line-height: 1.15;
|
||||
letter-spacing: -.015em;
|
||||
margin: 53px 0 0;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: 26px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,13 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<aside style="margin-top:15px;">
|
||||
Here we use window.print() to implement the feature of downloading PDF.
|
||||
</aside>
|
||||
<router-link target="_blank" to="/pdf/download">
|
||||
<el-button type="primary">
|
||||
Click to download PDF
|
||||
</el-button>
|
||||
</router-link>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -1,41 +0,0 @@
|
||||
<template>
|
||||
<el-upload :data="dataObj" :multiple="true" :before-upload="beforeUpload" action="https://upload.qbox.me" drag>
|
||||
<i class="el-icon-upload" />
|
||||
<div class="el-upload__text">
|
||||
将文件拖到此处，或<em>点击上传</em>
|
||||
</div>
|
||||
</el-upload>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getToken } from '@/api/qiniu'
|
||||
// 获取七牛token 后端通过Access Key,Secret Key,bucket等生成token
|
||||
// 七牛官方sdk https://developer.qiniu.com/sdk#official-sdk
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
dataObj: { token: '', key: '' },
|
||||
image_uri: [],
|
||||
fileList: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
beforeUpload() {
|
||||
const _self = this
|
||||
return new Promise((resolve, reject) => {
|
||||
getToken().then(response => {
|
||||
const key = response.data.qiniu_key
|
||||
const token = response.data.qiniu_token
|
||||
_self._data.dataObj.token = token
|
||||
_self._data.dataObj.key = key
|
||||
resolve(true)
|
||||
}).catch(err => {
|
||||
console.log(err)
|
||||
reject(false)
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -2,7 +2,7 @@
|
||||
<div>
|
||||
<el-card>
|
||||
<buttons funid="safe_insp" style="margin-bottom:20px" @save="save" />
|
||||
<el-form ref="form" :model="form" label-width="80px">
|
||||
<el-form ref="form" :model="form" label-width="80px" :rules="rules">
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="巡检单编号">
|
||||
@ -22,7 +22,7 @@
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="巡检名称">
|
||||
<el-form-item ref="safe_insp__insp_name" label="巡检名称" prop="safe_insp__insp_name">
|
||||
<el-input v-model="form.safe_insp__insp_name" placeholder="请选择巡检名称" class="input-with-select" clearable>
|
||||
<el-button slot="append" icon="el-icon-search" @click="inspNameVisible = !inspNameVisible" />
|
||||
</el-input>
|
||||
@ -31,7 +31,7 @@
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="巡检日期">
|
||||
<el-form-item label="巡检日期" prop="safe_insp__insp_date">
|
||||
<el-date-picker
|
||||
v-model="form.safe_insp__insp_date"
|
||||
type="date"
|
||||
@ -43,7 +43,7 @@
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="巡检人员">
|
||||
<el-form-item ref="safe_insp__insp_man" label="巡检人员" prop="safe_insp__insp_man">
|
||||
<el-input v-model="form.safe_insp__insp_man" placeholder="请选择巡检人员" class="input-with-select" clearable>
|
||||
<el-button slot="append" icon="el-icon-search" @click="selUserVisible = !selUserVisible" />
|
||||
</el-input>
|
||||
@ -57,8 +57,15 @@
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="巡检频率">
|
||||
<el-input v-model="form.safe_insp__insp_times" />
|
||||
<el-form-item ref="safe_insp__insp_times" label="巡检频率" prop="safe_insp__insp_times">
|
||||
<el-select v-model="form.safe_insp__insp_times" placeholder="请选择">
|
||||
<el-option
|
||||
v-for="item in insptimes"
|
||||
:key="item.funall_control__value_data"
|
||||
:label="item.funall_control__display_data"
|
||||
:value="item.funall_control__value_data"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
@ -147,16 +154,52 @@ export default {
|
||||
safe_insp__dept_id: '',
|
||||
safe_insp__insp_man_id: ''
|
||||
},
|
||||
rules: {
|
||||
safe_insp__insp_name: [
|
||||
{ required: true, message: '请选择巡检名称', trigger: 'blur' }
|
||||
],
|
||||
safe_insp__insp_man: [
|
||||
{ required: true, message: '请选择巡检人员', trigger: 'blur' }
|
||||
],
|
||||
safe_insp__insp_date: [
|
||||
{ required: true, message: '请选择巡检日期', trigger: 'blur' }
|
||||
],
|
||||
safe_insp__insp_times: [
|
||||
{ required: true, message: '请选择巡检频率', trigger: 'blur' }
|
||||
]
|
||||
},
|
||||
inspName: [],
|
||||
disabled: false,
|
||||
options: [],
|
||||
insptimes: [],
|
||||
selUserVisible: false,
|
||||
inspNameVisible: false,
|
||||
id: ''
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'form.safe_insp__insp_name': {
|
||||
handler(val, oldVal) {
|
||||
this.$refs['safe_insp__insp_name'].clearValidate()
|
||||
},
|
||||
deep: true
|
||||
},
|
||||
'form.safe_insp__insp_man': {
|
||||
handler(val, oldVal) {
|
||||
this.$refs['safe_insp__insp_man'].clearValidate()
|
||||
},
|
||||
deep: true
|
||||
},
|
||||
'form.safe_insp__insp_times': {
|
||||
handler(val, oldVal) {
|
||||
this.$refs['safe_insp__insp_times'].clearValidate()
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getTypeSel()
|
||||
this.getInsptimes()
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
@ -173,7 +216,7 @@ export default {
|
||||
})
|
||||
},
|
||||
async getTypeSel() {
|
||||
await publicApi.getTypeSel('insptimes').then(data => {
|
||||
await publicApi.getTypeSel('inspstate').then(data => {
|
||||
if (data.success) {
|
||||
this.options = data.data.root
|
||||
} else {
|
||||
@ -181,6 +224,15 @@ export default {
|
||||
}
|
||||
})
|
||||
},
|
||||
async getInsptimes() {
|
||||
await publicApi.getTypeSel('insptimes').then(data => {
|
||||
if (data.success) {
|
||||
this.insptimes = data.data.root
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
onSubmit() {},
|
||||
updateUser(data) {
|
||||
this.form.safe_insp__insp_man = data.sys_user__user_name
|
||||
@ -202,13 +254,17 @@ export default {
|
||||
this.inspNameVisible = false
|
||||
},
|
||||
save() {
|
||||
api.Crerte(this.form).then(data => {
|
||||
if (data.success) {
|
||||
this.$message.success('保存成功！')
|
||||
const param = `/insp/edit_form/audit/${data.data.keyid}`
|
||||
this.$router.push(param)
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
this.$refs.form.validate(valid => {
|
||||
if (valid) {
|
||||
api.Crerte(this.form).then(data => {
|
||||
if (data.success) {
|
||||
this.$message.success('保存成功！')
|
||||
const param = `/insp/edit_form/audit/${data.data.keyid}`
|
||||
this.$router.push(param)
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
<div>
|
||||
<el-card>
|
||||
<buttons funid="safe_insp" style="margin-bottom:20px" @save="save" />
|
||||
<el-form ref="form" :model="form" label-width="80px">
|
||||
<el-form ref="form" :model="form" label-width="80px" :rules="rules">
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="巡检单编号">
|
||||
@ -22,14 +22,16 @@
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="巡检名称">
|
||||
<el-input v-model="form.safe_insp__insp_name" />
|
||||
<el-form-item ref="safe_insp__insp_name" label="巡检名称" prop="safe_insp__insp_name">
|
||||
<el-input v-model="form.safe_insp__insp_name" placeholder="请选择巡检名称" class="input-with-select" clearable>
|
||||
<el-button slot="append" icon="el-icon-search" @click="inspNameVisible = !inspNameVisible" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="巡检日期">
|
||||
<el-form-item label="巡检日期" prop="safe_insp__insp_date">
|
||||
<el-date-picker
|
||||
v-model="form.safe_insp__insp_date"
|
||||
type="date"
|
||||
@ -41,8 +43,8 @@
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="巡检人员">
|
||||
<el-input v-model="form.safe_insp__insp_man" placeholder="请输入内容" class="input-with-select" clearable>
|
||||
<el-form-item ref="safe_insp__insp_man" label="巡检人员" prop="safe_insp__insp_man">
|
||||
<el-input v-model="form.safe_insp__insp_man" placeholder="请选择巡检人员" class="input-with-select" clearable>
|
||||
<el-button slot="append" icon="el-icon-search" @click="selUserVisible = !selUserVisible" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
@ -55,8 +57,15 @@
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="巡检频率">
|
||||
<el-input v-model="form.safe_insp__insp_times" />
|
||||
<el-form-item ref="safe_insp__insp_times" label="巡检频率" prop="safe_insp__insp_times">
|
||||
<el-select v-model="form.safe_insp__insp_times" placeholder="请选择">
|
||||
<el-option
|
||||
v-for="item in insptimes"
|
||||
:key="item.funall_control__value_data"
|
||||
:label="item.funall_control__display_data"
|
||||
:value="item.funall_control__value_data"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
@ -92,6 +101,18 @@
|
||||
<el-button type="primary" @click="selUserVisible = false">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
v-if="inspNameVisible"
|
||||
title="选择巡检名称"
|
||||
:visible.sync="inspNameVisible"
|
||||
width="60%"
|
||||
>
|
||||
<InspName @updateInspName="updateInspName" />
|
||||
<span>
|
||||
<el-button @click="inspNameVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="inspNameVisible = false">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -101,12 +122,15 @@ import publicApi from '@/api/public'
|
||||
import buttons from '@/components/formBtn'
|
||||
import InspDet from '../insp_det'
|
||||
import SelUser from '@/components/selUser'
|
||||
import InspName from '../inspName'
|
||||
import { parseDay } from '@/utils'
|
||||
export default {
|
||||
name: 'EditForm',
|
||||
components: {
|
||||
buttons,
|
||||
SelUser,
|
||||
InspDet
|
||||
InspDet,
|
||||
InspName
|
||||
},
|
||||
// props: {
|
||||
// id: { type: String, default: () => '' }
|
||||
@ -114,11 +138,60 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
form: {},
|
||||
parseDay,
|
||||
form: {
|
||||
safe_insp__insp_code: '',
|
||||
safe_insp__insp_name: '',
|
||||
safe_insp__insp_state: '',
|
||||
safe_insp__insp_date: '',
|
||||
safe_insp__insp_man: '',
|
||||
safe_insp__insp_times: '',
|
||||
safe_insp__insp_memo: '',
|
||||
safe_insp__insp_ed: '',
|
||||
safe_insp__insp_ing: '',
|
||||
safe_insp__insp_non: '',
|
||||
safe_insp__safe_insp_id: ''
|
||||
},
|
||||
rules: {
|
||||
safe_insp__insp_name: [
|
||||
{ required: true, message: '请选择巡检名称', trigger: 'blur' }
|
||||
],
|
||||
safe_insp__insp_man: [
|
||||
{ required: true, message: '请选择巡检人员', trigger: 'blur' }
|
||||
],
|
||||
safe_insp__insp_date: [
|
||||
{ required: true, message: '请选择巡检日期', trigger: 'blur' }
|
||||
],
|
||||
safe_insp__insp_times: [
|
||||
{ required: true, message: '请选择巡检频率', trigger: 'blur' }
|
||||
]
|
||||
},
|
||||
id: this.$route.params.id,
|
||||
disabled: false,
|
||||
options: [],
|
||||
selUserVisible: false
|
||||
insptimes: [],
|
||||
selUserVisible: false,
|
||||
inspNameVisible: false
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'form.safe_insp__insp_name': {
|
||||
handler(val, oldVal) {
|
||||
this.$refs['safe_insp__insp_name'].clearValidate()
|
||||
},
|
||||
deep: true
|
||||
},
|
||||
'form.safe_insp__insp_man': {
|
||||
handler(val, oldVal) {
|
||||
this.$refs['safe_insp__insp_man'].clearValidate()
|
||||
},
|
||||
deep: true
|
||||
},
|
||||
'form.safe_insp__insp_times': {
|
||||
handler(val, oldVal) {
|
||||
this.$refs['safe_insp__insp_times'].clearValidate()
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
created() {
|
||||
@ -132,6 +205,7 @@ export default {
|
||||
api.getFormDate(this.id).then(data => {
|
||||
if (data.success) {
|
||||
this.form = data.data.root[0]
|
||||
this.form.safe_insp__insp_date = parseDay(data.data.root[0].safe_insp__insp_date)
|
||||
setTimeout(() => {
|
||||
this.loading = false
|
||||
}, 200)
|
||||
@ -149,6 +223,15 @@ export default {
|
||||
}
|
||||
})
|
||||
},
|
||||
async getInsptimes() {
|
||||
await publicApi.getTypeSel('insptimes').then(data => {
|
||||
if (data.success) {
|
||||
this.insptimes = data.data.root
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
onSubmit() {},
|
||||
updateUser(data) {
|
||||
this.form.safe_insp__insp_man = data.sys_user__user_name
|
||||
@ -168,6 +251,11 @@ export default {
|
||||
}
|
||||
})
|
||||
},
|
||||
updateInspName(data) {
|
||||
this.form.safe_insp__insp_name = data.insp_name__insp_name
|
||||
this.form.safe_insp__insp_name_id = data.insp_name__insp_name_id
|
||||
this.inspNameVisible = false
|
||||
},
|
||||
back() {
|
||||
// this.$router.back(-1)
|
||||
}
|
||||
|
||||
@ -3,20 +3,26 @@
|
||||
<buttons funid="insp_det" style="margin:10px 10px" @editCreate="editCreate" @editDelete="editDelete" @editSave="editSave" @upload="upload" />
|
||||
<el-card>
|
||||
<el-table
|
||||
ref="deptTable"
|
||||
ref="table"
|
||||
v-loading="loading"
|
||||
:data="data"
|
||||
style="width: 100%"
|
||||
border
|
||||
stripe
|
||||
@selection-change="handleSelectionChange"
|
||||
@cell-dblclick="cellDblclick"
|
||||
>
|
||||
<template v-for="(d,i) in tableHeader">
|
||||
<el-table-column v-if="d.type && d.type === 'selection'" :key="i" :type="d.type" :fixed="d.fixed" />
|
||||
<el-table-column
|
||||
v-else
|
||||
v-else-if="d.show !== false"
|
||||
:key="i"
|
||||
:prop="d.prop"
|
||||
:label="d.label"
|
||||
:width="d.width"
|
||||
:min-width="d.minWidth"
|
||||
:class-name="d.className"
|
||||
:fixed="d.fixed"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<div v-if="d.label==='巡检状态'">
|
||||
@ -24,8 +30,13 @@
|
||||
scope.row.ssafe_insp__insp_state == 1 ? '巡检中' : '已巡检'
|
||||
}}
|
||||
</div>
|
||||
<div v-else-if="d.label==='巡检日期'">
|
||||
{{
|
||||
parseDay(scope.row.safe_insp__insp_date)
|
||||
}}
|
||||
</div>
|
||||
<div v-else-if="d.label === '操作'">
|
||||
<el-button icon="el-icon-view" type="text" title="编辑" @click="edit(scope.row)" />
|
||||
<el-button icon="el-icon-view" type="text" size="mini" title="编辑" @click="edit(scope.row)" />
|
||||
<el-button v-if="scope.row.status !== 'NULLIFY'" icon="el-icon-delete" style="color:#F56C6C" type="text" title="删除" @click="Delete(scope.row)" />
|
||||
</div>
|
||||
<div v-else>{{ scope.row[d.prop] }}</div>
|
||||
@ -44,38 +55,12 @@
|
||||
/>
|
||||
</el-card>
|
||||
|
||||
<el-dialog v-if="dialogFormVisible" title="新增部门" :visible.sync="dialogFormVisible" @close="closeDialog">
|
||||
<el-form ref="form" :model="form" :rules="rules">
|
||||
<el-form-item label="所属部门" :label-width="formLabelWidth">
|
||||
<el-select v-model="dept_id" placeholder="请选择">
|
||||
<el-option
|
||||
v-for="item in data"
|
||||
:key="item.sys_dept__dept_id"
|
||||
:label="item.sys_dept__dept_name"
|
||||
:value="item.sys_dept__dept_id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="部门编码" :label-width="formLabelWidth" prop="dept_code">
|
||||
<el-input v-model="form.dept_code" />
|
||||
</el-form-item>
|
||||
<el-form-item label="部门名称" :label-width="formLabelWidth" prop="dept_name">
|
||||
<el-input v-model="form.dept_name" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" :label-width="formLabelWidth" prop="memo">
|
||||
<el-input v-model="form.memo" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogFormVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="create">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import api from './api'
|
||||
import { parseDay } from '@/utils'
|
||||
import buttons from '@/components/Buttons'
|
||||
export default {
|
||||
name: 'SafeIdsp',
|
||||
@ -89,6 +74,7 @@ export default {
|
||||
deptTree: [],
|
||||
ids: [],
|
||||
levels: [],
|
||||
parseDay,
|
||||
pager: {
|
||||
pageNo: 0,
|
||||
pageSize: 10,
|
||||
@ -98,51 +84,73 @@ export default {
|
||||
{
|
||||
prop: 'selection',
|
||||
type: 'selection',
|
||||
fixed: 'left'
|
||||
fixed: 'left',
|
||||
width: '100px',
|
||||
show: true
|
||||
}, {
|
||||
prop: 'safe_insp__insp_code',
|
||||
label: '巡检编号'
|
||||
label: '巡检编号',
|
||||
width: '200px',
|
||||
show: true
|
||||
}, {
|
||||
prop: 'safe_insp__insp_name',
|
||||
label: '巡检名称'
|
||||
label: '巡检名称',
|
||||
width: '250px',
|
||||
show: true
|
||||
},
|
||||
{
|
||||
prop: 'safe_insp__insp_state',
|
||||
label: '巡检状态'
|
||||
label: '巡检状态',
|
||||
width: '100px',
|
||||
show: true
|
||||
}, {
|
||||
prop: 'safe_insp__insp_date',
|
||||
label: '巡检日期'
|
||||
label: '巡检日期',
|
||||
width: '100px',
|
||||
show: true
|
||||
},
|
||||
{
|
||||
prop: 'safe_insp__insp_man',
|
||||
label: '巡检人员'
|
||||
label: '巡检人员',
|
||||
width: '100px',
|
||||
show: true
|
||||
},
|
||||
{
|
||||
prop: 'safe_insp__insp_times',
|
||||
label: '巡检频率'
|
||||
label: '巡检频率',
|
||||
width: '100px',
|
||||
show: true
|
||||
},
|
||||
{
|
||||
prop: 'safe_insp__insp_memo',
|
||||
label: '备注'
|
||||
label: '备注',
|
||||
width: '100px',
|
||||
show: true
|
||||
},
|
||||
{
|
||||
prop: 'safe_insp__insp_ed',
|
||||
label: '已巡检数量'
|
||||
label: '已巡检数量',
|
||||
width: '100px',
|
||||
show: true
|
||||
},
|
||||
{
|
||||
prop: 'safe_insp__insp_ing',
|
||||
label: '待巡检数量'
|
||||
label: '待巡检数量',
|
||||
width: '100px',
|
||||
show: true
|
||||
},
|
||||
{
|
||||
prop: 'safe_insp__insp_non',
|
||||
label: '不符合数量'
|
||||
label: '不符合数量',
|
||||
width: '100px',
|
||||
show: true
|
||||
},
|
||||
{
|
||||
prop: 'opration',
|
||||
label: '操作',
|
||||
width: '70px',
|
||||
width: '120px',
|
||||
fixed: 'right',
|
||||
minWidth: '70px',
|
||||
minWidth: '120px',
|
||||
show: true
|
||||
}],
|
||||
value: '',
|
||||
|
||||
@ -98,10 +98,9 @@
|
||||
width="60%"
|
||||
:modal="false"
|
||||
>
|
||||
<SelDept ref="seLDept" @updateDept="updateDept" @updateDepts="updateDepts" />
|
||||
<SelDept ref="seLDept" selective="single" @updateDept="updateDept" @updateDepts="updateDepts" />
|
||||
<span>
|
||||
<el-button @click="selDeptVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="selDeptVisible = false">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
@ -199,6 +198,7 @@ export default {
|
||||
this.form.sys_dept__dept_name = data.map(d => { return d.sys_dept__dept_name }).join(';')
|
||||
this.form.sys_user__dept_id = data.map(d => { return d.sys_dept__dept_id }).join(';')
|
||||
this.change()
|
||||
this.selDeptVisible = false
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,103 +0,0 @@
|
||||
<template>
|
||||
<el-table :data="list" border fit highlight-current-row style="width: 100%">
|
||||
<el-table-column
|
||||
v-loading="loading"
|
||||
align="center"
|
||||
label="ID"
|
||||
width="65"
|
||||
element-loading-text="请给我点时间！"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.id }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column width="180px" align="center" label="Date">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.timestamp | parseTime('{y}-{m}-{d} {h}:{i}') }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column min-width="300px" label="Title">
|
||||
<template slot-scope="{row}">
|
||||
<span>{{ row.title }}</span>
|
||||
<el-tag>{{ row.type }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column width="110px" align="center" label="Author">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.author }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column width="120px" label="Importance">
|
||||
<template slot-scope="scope">
|
||||
<svg-icon v-for="n in +scope.row.importance" :key="n" icon-class="star" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="Readings" width="95">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.pageviews }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column class-name="status-col" label="Status" width="110">
|
||||
<template slot-scope="{row}">
|
||||
<el-tag :type="row.status | statusFilter">
|
||||
{{ row.status }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { fetchList } from '@/api/article'
|
||||
|
||||
export default {
|
||||
filters: {
|
||||
statusFilter(status) {
|
||||
const statusMap = {
|
||||
published: 'success',
|
||||
draft: 'info',
|
||||
deleted: 'danger'
|
||||
}
|
||||
return statusMap[status]
|
||||
}
|
||||
},
|
||||
props: {
|
||||
type: {
|
||||
type: String,
|
||||
default: 'CN'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
list: null,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 5,
|
||||
type: this.type,
|
||||
sort: '+id'
|
||||
},
|
||||
loading: false
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
this.loading = true
|
||||
this.$emit('create') // for test
|
||||
fetchList(this.listQuery).then(response => {
|
||||
this.list = response.data.items
|
||||
this.loading = false
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -1,57 +0,0 @@
|
||||
<template>
|
||||
<div class="tab-container">
|
||||
<el-tag>mounted times ：{{ createdTimes }}</el-tag>
|
||||
<el-alert :closable="false" style="width:200px;display:inline-block;vertical-align: middle;margin-left:30px;" title="Tab with keep-alive" type="success" />
|
||||
<el-tabs v-model="activeName" style="margin-top:15px;" type="border-card">
|
||||
<el-tab-pane v-for="item in tabMapOptions" :key="item.key" :label="item.label" :name="item.key">
|
||||
<keep-alive>
|
||||
<tab-pane v-if="activeName==item.key" :type="item.key" @create="showCreatedTimes" />
|
||||
</keep-alive>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import TabPane from './components/TabPane'
|
||||
|
||||
export default {
|
||||
name: 'Tab',
|
||||
components: { TabPane },
|
||||
data() {
|
||||
return {
|
||||
tabMapOptions: [
|
||||
{ label: 'China', key: 'CN' },
|
||||
{ label: 'USA', key: 'US' },
|
||||
{ label: 'Japan', key: 'JP' },
|
||||
{ label: 'Eurozone', key: 'EU' }
|
||||
],
|
||||
activeName: 'CN',
|
||||
createdTimes: 0
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
activeName(val) {
|
||||
this.$router.push(`${this.$route.path}?tab=${val}`)
|
||||
}
|
||||
},
|
||||
created() {
|
||||
// init the default selected tab
|
||||
const tab = this.$route.query.tab
|
||||
if (tab) {
|
||||
this.activeName = tab
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
showCreatedTimes() {
|
||||
this.createdTimes = this.createdTimes + 1
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tab-container {
|
||||
margin: 30px;
|
||||
}
|
||||
</style>
|
||||
@ -1,379 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<div class="filter-container">
|
||||
<el-input v-model="listQuery.title" placeholder="Title" style="width: 200px;" class="filter-item" @keyup.enter.native="handleFilter" />
|
||||
<el-select v-model="listQuery.importance" placeholder="Imp" clearable style="width: 90px" class="filter-item">
|
||||
<el-option v-for="item in importanceOptions" :key="item" :label="item" :value="item" />
|
||||
</el-select>
|
||||
<el-select v-model="listQuery.type" placeholder="Type" clearable class="filter-item" style="width: 130px">
|
||||
<el-option v-for="item in calendarTypeOptions" :key="item.key" :label="item.display_name+'('+item.key+')'" :value="item.key" />
|
||||
</el-select>
|
||||
<el-select v-model="listQuery.sort" style="width: 140px" class="filter-item" @change="handleFilter">
|
||||
<el-option v-for="item in sortOptions" :key="item.key" :label="item.label" :value="item.key" />
|
||||
</el-select>
|
||||
<el-button v-waves class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">
|
||||
Search
|
||||
</el-button>
|
||||
<el-button class="filter-item" style="margin-left: 10px;" type="primary" icon="el-icon-edit" @click="handleCreate">
|
||||
Add
|
||||
</el-button>
|
||||
<el-button v-waves :loading="downloadLoading" class="filter-item" type="primary" icon="el-icon-download" @click="handleDownload">
|
||||
Export
|
||||
</el-button>
|
||||
<el-checkbox v-model="showReviewer" class="filter-item" style="margin-left:15px;" @change="tableKey=tableKey+1">
|
||||
reviewer
|
||||
</el-checkbox>
|
||||
</div>
|
||||
|
||||
<el-table
|
||||
:key="tableKey"
|
||||
v-loading="listLoading"
|
||||
:data="list"
|
||||
border
|
||||
fit
|
||||
highlight-current-row
|
||||
style="width: 100%;"
|
||||
@sort-change="sortChange"
|
||||
>
|
||||
<el-table-column label="ID" prop="id" sortable="custom" align="center" width="80" :class-name="getSortClass('id')">
|
||||
<template slot-scope="{row}">
|
||||
<span>{{ row.id }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="Date" width="150px" align="center">
|
||||
<template slot-scope="{row}">
|
||||
<span>{{ row.timestamp | parseTime('{y}-{m}-{d} {h}:{i}') }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="Title" min-width="150px">
|
||||
<template slot-scope="{row}">
|
||||
<span class="link-type" @click="handleUpdate(row)">{{ row.title }}</span>
|
||||
<el-tag>{{ row.type | typeFilter }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="Author" width="110px" align="center">
|
||||
<template slot-scope="{row}">
|
||||
<span>{{ row.author }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column v-if="showReviewer" label="Reviewer" width="110px" align="center">
|
||||
<template slot-scope="{row}">
|
||||
<span style="color:red;">{{ row.reviewer }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="Imp" width="80px">
|
||||
<template slot-scope="{row}">
|
||||
<svg-icon v-for="n in + row.importance" :key="n" icon-class="star" class="meta-item__icon" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="Readings" align="center" width="95">
|
||||
<template slot-scope="{row}">
|
||||
<span v-if="row.pageviews" class="link-type" @click="handleFetchPv(row.pageviews)">{{ row.pageviews }}</span>
|
||||
<span v-else>0</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="Status" class-name="status-col" width="100">
|
||||
<template slot-scope="{row}">
|
||||
<el-tag :type="row.status | statusFilter">
|
||||
{{ row.status }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="Actions" align="center" width="230" class-name="small-padding fixed-width">
|
||||
<template slot-scope="{row,$index}">
|
||||
<el-button type="primary" size="mini" @click="handleUpdate(row)">
|
||||
Edit
|
||||
</el-button>
|
||||
<el-button v-if="row.status!='published'" size="mini" type="success" @click="handleModifyStatus(row,'published')">
|
||||
Publish
|
||||
</el-button>
|
||||
<el-button v-if="row.status!='draft'" size="mini" @click="handleModifyStatus(row,'draft')">
|
||||
Draft
|
||||
</el-button>
|
||||
<el-button v-if="row.status!='deleted'" size="mini" type="danger" @click="handleDelete(row,$index)">
|
||||
Delete
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination v-show="total>0" :total="total" :page.sync="listQuery.page" :limit.sync="listQuery.limit" @pagination="getList" />
|
||||
|
||||
<el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible">
|
||||
<el-form ref="dataForm" :rules="rules" :model="temp" label-position="left" label-width="70px" style="width: 400px; margin-left:50px;">
|
||||
<el-form-item label="Type" prop="type">
|
||||
<el-select v-model="temp.type" class="filter-item" placeholder="Please select">
|
||||
<el-option v-for="item in calendarTypeOptions" :key="item.key" :label="item.display_name" :value="item.key" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="Date" prop="timestamp">
|
||||
<el-date-picker v-model="temp.timestamp" type="datetime" placeholder="Please pick a date" />
|
||||
</el-form-item>
|
||||
<el-form-item label="Title" prop="title">
|
||||
<el-input v-model="temp.title" />
|
||||
</el-form-item>
|
||||
<el-form-item label="Status">
|
||||
<el-select v-model="temp.status" class="filter-item" placeholder="Please select">
|
||||
<el-option v-for="item in statusOptions" :key="item" :label="item" :value="item" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="Imp">
|
||||
<el-rate v-model="temp.importance" :colors="['#99A9BF', '#F7BA2A', '#FF9900']" :max="3" style="margin-top:8px;" />
|
||||
</el-form-item>
|
||||
<el-form-item label="Remark">
|
||||
<el-input v-model="temp.remark" :autosize="{ minRows: 2, maxRows: 4}" type="textarea" placeholder="Please input" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogFormVisible = false">
|
||||
Cancel
|
||||
</el-button>
|
||||
<el-button type="primary" @click="dialogStatus==='create'?createData():updateData()">
|
||||
Confirm
|
||||
</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog :visible.sync="dialogPvVisible" title="Reading statistics">
|
||||
<el-table :data="pvData" border fit highlight-current-row style="width: 100%">
|
||||
<el-table-column prop="key" label="Channel" />
|
||||
<el-table-column prop="pv" label="Pv" />
|
||||
</el-table>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="dialogPvVisible = false">Confirm</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { fetchList, fetchPv, createArticle, updateArticle } from '@/api/article'
|
||||
import waves from '@/directive/waves' // waves directive
|
||||
import { parseTime } from '@/utils'
|
||||
import Pagination from '@/components/Pagination' // secondary package based on el-pagination
|
||||
|
||||
const calendarTypeOptions = [
|
||||
{ key: 'CN', display_name: 'China' },
|
||||
{ key: 'US', display_name: 'USA' },
|
||||
{ key: 'JP', display_name: 'Japan' },
|
||||
{ key: 'EU', display_name: 'Eurozone' }
|
||||
]
|
||||
|
||||
// arr to obj, such as { CN : "China", US : "USA" }
|
||||
const calendarTypeKeyValue = calendarTypeOptions.reduce((acc, cur) => {
|
||||
acc[cur.key] = cur.display_name
|
||||
return acc
|
||||
}, {})
|
||||
|
||||
export default {
|
||||
name: 'ComplexTable',
|
||||
components: { Pagination },
|
||||
directives: { waves },
|
||||
filters: {
|
||||
statusFilter(status) {
|
||||
const statusMap = {
|
||||
published: 'success',
|
||||
draft: 'info',
|
||||
deleted: 'danger'
|
||||
}
|
||||
return statusMap[status]
|
||||
},
|
||||
typeFilter(type) {
|
||||
return calendarTypeKeyValue[type]
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
tableKey: 0,
|
||||
list: null,
|
||||
total: 0,
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 20,
|
||||
importance: undefined,
|
||||
title: undefined,
|
||||
type: undefined,
|
||||
sort: '+id'
|
||||
},
|
||||
importanceOptions: [1, 2, 3],
|
||||
calendarTypeOptions,
|
||||
sortOptions: [{ label: 'ID Ascending', key: '+id' }, { label: 'ID Descending', key: '-id' }],
|
||||
statusOptions: ['published', 'draft', 'deleted'],
|
||||
showReviewer: false,
|
||||
temp: {
|
||||
id: undefined,
|
||||
importance: 1,
|
||||
remark: '',
|
||||
timestamp: new Date(),
|
||||
title: '',
|
||||
type: '',
|
||||
status: 'published'
|
||||
},
|
||||
dialogFormVisible: false,
|
||||
dialogStatus: '',
|
||||
textMap: {
|
||||
update: 'Edit',
|
||||
create: 'Create'
|
||||
},
|
||||
dialogPvVisible: false,
|
||||
pvData: [],
|
||||
rules: {
|
||||
type: [{ required: true, message: 'type is required', trigger: 'change' }],
|
||||
timestamp: [{ type: 'date', required: true, message: 'timestamp is required', trigger: 'change' }],
|
||||
title: [{ required: true, message: 'title is required', trigger: 'blur' }]
|
||||
},
|
||||
downloadLoading: false
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
this.listLoading = true
|
||||
fetchList(this.listQuery).then(response => {
|
||||
this.list = response.data.items
|
||||
this.total = response.data.total
|
||||
|
||||
// Just to simulate the time of the request
|
||||
setTimeout(() => {
|
||||
this.listLoading = false
|
||||
}, 1.5 * 1000)
|
||||
})
|
||||
},
|
||||
handleFilter() {
|
||||
this.listQuery.page = 1
|
||||
this.getList()
|
||||
},
|
||||
handleModifyStatus(row, status) {
|
||||
this.$message({
|
||||
message: '操作Success',
|
||||
type: 'success'
|
||||
})
|
||||
row.status = status
|
||||
},
|
||||
sortChange(data) {
|
||||
const { prop, order } = data
|
||||
if (prop === 'id') {
|
||||
this.sortByID(order)
|
||||
}
|
||||
},
|
||||
sortByID(order) {
|
||||
if (order === 'ascending') {
|
||||
this.listQuery.sort = '+id'
|
||||
} else {
|
||||
this.listQuery.sort = '-id'
|
||||
}
|
||||
this.handleFilter()
|
||||
},
|
||||
resetTemp() {
|
||||
this.temp = {
|
||||
id: undefined,
|
||||
importance: 1,
|
||||
remark: '',
|
||||
timestamp: new Date(),
|
||||
title: '',
|
||||
status: 'published',
|
||||
type: ''
|
||||
}
|
||||
},
|
||||
handleCreate() {
|
||||
this.resetTemp()
|
||||
this.dialogStatus = 'create'
|
||||
this.dialogFormVisible = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs['dataForm'].clearValidate()
|
||||
})
|
||||
},
|
||||
createData() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
this.temp.id = parseInt(Math.random() * 100) + 1024 // mock a id
|
||||
this.temp.author = 'vue-element-admin'
|
||||
createArticle(this.temp).then(() => {
|
||||
this.list.unshift(this.temp)
|
||||
this.dialogFormVisible = false
|
||||
this.$notify({
|
||||
title: 'Success',
|
||||
message: 'Created Successfully',
|
||||
type: 'success',
|
||||
duration: 2000
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
handleUpdate(row) {
|
||||
this.temp = Object.assign({}, row) // copy obj
|
||||
this.temp.timestamp = new Date(this.temp.timestamp)
|
||||
this.dialogStatus = 'update'
|
||||
this.dialogFormVisible = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs['dataForm'].clearValidate()
|
||||
})
|
||||
},
|
||||
updateData() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
const tempData = Object.assign({}, this.temp)
|
||||
tempData.timestamp = +new Date(tempData.timestamp) // change Thu Nov 30 2017 16:41:05 GMT+0800 (CST) to 1512031311464
|
||||
updateArticle(tempData).then(() => {
|
||||
const index = this.list.findIndex(v => v.id === this.temp.id)
|
||||
this.list.splice(index, 1, this.temp)
|
||||
this.dialogFormVisible = false
|
||||
this.$notify({
|
||||
title: 'Success',
|
||||
message: 'Update Successfully',
|
||||
type: 'success',
|
||||
duration: 2000
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
handleDelete(row, index) {
|
||||
this.$notify({
|
||||
title: 'Success',
|
||||
message: 'Delete Successfully',
|
||||
type: 'success',
|
||||
duration: 2000
|
||||
})
|
||||
this.list.splice(index, 1)
|
||||
},
|
||||
handleFetchPv(pv) {
|
||||
fetchPv(pv).then(response => {
|
||||
this.pvData = response.data.pvData
|
||||
this.dialogPvVisible = true
|
||||
})
|
||||
},
|
||||
handleDownload() {
|
||||
this.downloadLoading = true
|
||||
import('@/vendor/Export2Excel').then(excel => {
|
||||
const tHeader = ['timestamp', 'title', 'type', 'importance', 'status']
|
||||
const filterVal = ['timestamp', 'title', 'type', 'importance', 'status']
|
||||
const data = this.formatJson(filterVal)
|
||||
excel.export_json_to_excel({
|
||||
header: tHeader,
|
||||
data,
|
||||
filename: 'table-list'
|
||||
})
|
||||
this.downloadLoading = false
|
||||
})
|
||||
},
|
||||
formatJson(filterVal) {
|
||||
return this.list.map(v => filterVal.map(j => {
|
||||
if (j === 'timestamp') {
|
||||
return parseTime(v[j])
|
||||
} else {
|
||||
return v[j]
|
||||
}
|
||||
}))
|
||||
},
|
||||
getSortClass: function(key) {
|
||||
const sort = this.listQuery.sort
|
||||
return sort === `+${key}` ? 'ascending' : 'descending'
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -1,153 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<!-- Note that row-key is necessary to get a correct row order. -->
|
||||
<el-table ref="dragTable" v-loading="listLoading" :data="list" row-key="id" border fit highlight-current-row style="width: 100%">
|
||||
<el-table-column align="center" label="ID" width="65">
|
||||
<template slot-scope="{row}">
|
||||
<span>{{ row.id }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column width="180px" align="center" label="Date">
|
||||
<template slot-scope="{row}">
|
||||
<span>{{ row.timestamp | parseTime('{y}-{m}-{d} {h}:{i}') }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column min-width="300px" label="Title">
|
||||
<template slot-scope="{row}">
|
||||
<span>{{ row.title }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column width="110px" align="center" label="Author">
|
||||
<template slot-scope="{row}">
|
||||
<span>{{ row.author }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column width="100px" label="Importance">
|
||||
<template slot-scope="{row}">
|
||||
<svg-icon v-for="n in + row.importance" :key="n" icon-class="star" class="icon-star" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="Readings" width="95">
|
||||
<template slot-scope="{row}">
|
||||
<span>{{ row.pageviews }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column class-name="status-col" label="Status" width="110">
|
||||
<template slot-scope="{row}">
|
||||
<el-tag :type="row.status | statusFilter">
|
||||
{{ row.status }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="Drag" width="80">
|
||||
<template slot-scope="{}">
|
||||
<svg-icon class="drag-handler" icon-class="drag" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div class="show-d">
|
||||
<el-tag>The default order :</el-tag> {{ oldList }}
|
||||
</div>
|
||||
<div class="show-d">
|
||||
<el-tag>The after dragging order :</el-tag> {{ newList }}
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { fetchList } from '@/api/article'
|
||||
import Sortable from 'sortablejs'
|
||||
|
||||
export default {
|
||||
name: 'DragTable',
|
||||
filters: {
|
||||
statusFilter(status) {
|
||||
const statusMap = {
|
||||
published: 'success',
|
||||
draft: 'info',
|
||||
deleted: 'danger'
|
||||
}
|
||||
return statusMap[status]
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
list: null,
|
||||
total: null,
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 10
|
||||
},
|
||||
sortable: null,
|
||||
oldList: [],
|
||||
newList: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
async getList() {
|
||||
this.listLoading = true
|
||||
const { data } = await fetchList(this.listQuery)
|
||||
this.list = data.items
|
||||
this.total = data.total
|
||||
this.listLoading = false
|
||||
this.oldList = this.list.map(v => v.id)
|
||||
this.newList = this.oldList.slice()
|
||||
this.$nextTick(() => {
|
||||
this.setSort()
|
||||
})
|
||||
},
|
||||
setSort() {
|
||||
const el = this.$refs.dragTable.$el.querySelectorAll('.el-table__body-wrapper > table > tbody')[0]
|
||||
this.sortable = Sortable.create(el, {
|
||||
ghostClass: 'sortable-ghost', // Class name for the drop placeholder,
|
||||
setData: function(dataTransfer) {
|
||||
// to avoid Firefox bug
|
||||
// Detail see : https://github.com/RubaXa/Sortable/issues/1012
|
||||
dataTransfer.setData('Text', '')
|
||||
},
|
||||
onEnd: evt => {
|
||||
const targetRow = this.list.splice(evt.oldIndex, 1)[0]
|
||||
this.list.splice(evt.newIndex, 0, targetRow)
|
||||
|
||||
// for show the changes, you can delete in you code
|
||||
const tempIndex = this.newList.splice(evt.oldIndex, 1)[0]
|
||||
this.newList.splice(evt.newIndex, 0, tempIndex)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.sortable-ghost{
|
||||
opacity: .8;
|
||||
color: #fff!important;
|
||||
background: #42b983!important;
|
||||
}
|
||||
</style>
|
||||
|
||||
<style scoped>
|
||||
.icon-star{
|
||||
margin-right:2px;
|
||||
}
|
||||
.drag-handler{
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.show-d{
|
||||
margin-top: 15px;
|
||||
}
|
||||
</style>
|
||||
@ -1,62 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<div class="filter-container">
|
||||
<el-checkbox-group v-model="checkboxVal">
|
||||
<el-checkbox label="apple">
|
||||
apple
|
||||
</el-checkbox>
|
||||
<el-checkbox label="banana">
|
||||
banana
|
||||
</el-checkbox>
|
||||
<el-checkbox label="orange">
|
||||
orange
|
||||
</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</div>
|
||||
|
||||
<el-table :key="key" :data="tableData" border fit highlight-current-row style="width: 100%">
|
||||
<el-table-column prop="name" label="fruitName" width="180" />
|
||||
<el-table-column v-for="fruit in formThead" :key="fruit" :label="fruit">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row[fruit] }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
const defaultFormThead = ['apple', 'banana']
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData: [
|
||||
{
|
||||
name: 'fruit-1',
|
||||
apple: 'apple-10',
|
||||
banana: 'banana-10',
|
||||
orange: 'orange-10'
|
||||
},
|
||||
{
|
||||
name: 'fruit-2',
|
||||
apple: 'apple-20',
|
||||
banana: 'banana-20',
|
||||
orange: 'orange-20'
|
||||
}
|
||||
],
|
||||
key: 1, // table key
|
||||
formTheadOptions: ['apple', 'banana', 'orange'],
|
||||
checkboxVal: defaultFormThead, // checkboxVal
|
||||
formThead: defaultFormThead // 默认表头 Default header
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
checkboxVal(valArr) {
|
||||
this.formThead = this.formTheadOptions.filter(i => valArr.indexOf(i) >= 0)
|
||||
this.key = this.key + 1// 为了保证table 每次都会重渲 In order to ensure the table will be re-rendered each time
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -1,50 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<div class="filter-container">
|
||||
<el-checkbox-group v-model="formThead">
|
||||
<el-checkbox label="apple">
|
||||
apple
|
||||
</el-checkbox>
|
||||
<el-checkbox label="banana">
|
||||
banana
|
||||
</el-checkbox>
|
||||
<el-checkbox label="orange">
|
||||
orange
|
||||
</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</div>
|
||||
|
||||
<el-table :data="tableData" border fit highlight-current-row style="width: 100%">
|
||||
<el-table-column prop="name" label="fruitName" width="180" />
|
||||
<el-table-column v-for="fruit in formThead" :key="fruit" :label="fruit">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row[fruit] }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData: [
|
||||
{
|
||||
name: 'fruit-1',
|
||||
apple: 'apple-10',
|
||||
banana: 'banana-10',
|
||||
orange: 'orange-10'
|
||||
},
|
||||
{
|
||||
name: 'fruit-2',
|
||||
apple: 'apple-20',
|
||||
banana: 'banana-20',
|
||||
orange: 'orange-20'
|
||||
}
|
||||
],
|
||||
formThead: ['apple', 'banana']
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -1,24 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<div style="margin:0 0 5px 20px">
|
||||
Fixed header, sorted by header order,
|
||||
</div>
|
||||
<fixed-thead />
|
||||
|
||||
<div style="margin:30px 0 5px 20px">
|
||||
Not fixed header, sorted by click order
|
||||
</div>
|
||||
<unfixed-thead />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import FixedThead from './components/FixedThead'
|
||||
import UnfixedThead from './components/UnfixedThead'
|
||||
|
||||
export default {
|
||||
name: 'DynamicTable',
|
||||
components: { FixedThead, UnfixedThead }
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -1,149 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-table v-loading="listLoading" :data="list" border fit highlight-current-row style="width: 100%">
|
||||
<el-table-column align="center" label="ID" width="80">
|
||||
<template slot-scope="{row}">
|
||||
<span>{{ row.id }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column width="180px" align="center" label="Date">
|
||||
<template slot-scope="{row}">
|
||||
<span>{{ row.timestamp | parseTime('{y}-{m}-{d} {h}:{i}') }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column width="120px" align="center" label="Author">
|
||||
<template slot-scope="{row}">
|
||||
<span>{{ row.author }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column width="100px" label="Importance">
|
||||
<template slot-scope="{row}">
|
||||
<svg-icon v-for="n in + row.importance" :key="n" icon-class="star" class="meta-item__icon" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column class-name="status-col" label="Status" width="110">
|
||||
<template slot-scope="{row}">
|
||||
<el-tag :type="row.status | statusFilter">
|
||||
{{ row.status }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column min-width="300px" label="Title">
|
||||
<template slot-scope="{row}">
|
||||
<template v-if="row.edit">
|
||||
<el-input v-model="row.title" class="edit-input" size="small" />
|
||||
<el-button
|
||||
class="cancel-btn"
|
||||
size="small"
|
||||
icon="el-icon-refresh"
|
||||
type="warning"
|
||||
@click="cancelEdit(row)"
|
||||
>
|
||||
cancel
|
||||
</el-button>
|
||||
</template>
|
||||
<span v-else>{{ row.title }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="Actions" width="120">
|
||||
<template slot-scope="{row}">
|
||||
<el-button
|
||||
v-if="row.edit"
|
||||
type="success"
|
||||
size="small"
|
||||
icon="el-icon-circle-check-outline"
|
||||
@click="confirmEdit(row)"
|
||||
>
|
||||
Ok
|
||||
</el-button>
|
||||
<el-button
|
||||
v-else
|
||||
type="primary"
|
||||
size="small"
|
||||
icon="el-icon-edit"
|
||||
@click="row.edit=!row.edit"
|
||||
>
|
||||
Edit
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { fetchList } from '@/api/article'
|
||||
|
||||
export default {
|
||||
name: 'InlineEditTable',
|
||||
filters: {
|
||||
statusFilter(status) {
|
||||
const statusMap = {
|
||||
published: 'success',
|
||||
draft: 'info',
|
||||
deleted: 'danger'
|
||||
}
|
||||
return statusMap[status]
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
list: null,
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 10
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
async getList() {
|
||||
this.listLoading = true
|
||||
const { data } = await fetchList(this.listQuery)
|
||||
const items = data.items
|
||||
this.list = items.map(v => {
|
||||
this.$set(v, 'edit', false) // https://vuejs.org/v2/guide/reactivity.html
|
||||
v.originalTitle = v.title // will be used when user click the cancel botton
|
||||
return v
|
||||
})
|
||||
this.listLoading = false
|
||||
},
|
||||
cancelEdit(row) {
|
||||
row.title = row.originalTitle
|
||||
row.edit = false
|
||||
this.$message({
|
||||
message: 'The title has been restored to the original value',
|
||||
type: 'warning'
|
||||
})
|
||||
},
|
||||
confirmEdit(row) {
|
||||
row.edit = false
|
||||
row.originalTitle = row.title
|
||||
this.$message({
|
||||
message: 'The title has been edited',
|
||||
type: 'success'
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.edit-input {
|
||||
padding-right: 100px;
|
||||
}
|
||||
.cancel-btn {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 10px;
|
||||
}
|
||||
</style>
|
||||
@ -1,120 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-card class="box-card">
|
||||
<div slot="header">
|
||||
<a class="link-type link-title" target="_blank" href="https://panjiachen.github.io/vue-element-admin-site/guide/advanced/theme.html">
|
||||
Theme documentation
|
||||
</a>
|
||||
</div>
|
||||
<div class="box-item">
|
||||
<span class="field-label">Change Theme : </span>
|
||||
<el-switch v-model="theme" />
|
||||
<aside style="margin-top:15px;">
|
||||
Tips: It is different from the theme-pick on the navbar is two different skinning methods, each with different application scenarios. Refer to the documentation for details.
|
||||
</aside>
|
||||
</div>
|
||||
</el-card>
|
||||
|
||||
<div class="block">
|
||||
<el-button type="primary">
|
||||
Primary
|
||||
</el-button>
|
||||
<el-button type="success">
|
||||
Success
|
||||
</el-button>
|
||||
<el-button type="info">
|
||||
Info
|
||||
</el-button>
|
||||
<el-button type="warning">
|
||||
Warning
|
||||
</el-button>
|
||||
<el-button type="danger">
|
||||
Danger
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<div class="block">
|
||||
<el-button type="primary" icon="el-icon-edit" />
|
||||
<el-button type="primary" icon="el-icon-share" />
|
||||
<el-button type="primary" icon="el-icon-delete" />
|
||||
<el-button type="primary" icon="el-icon-search">
|
||||
Search
|
||||
</el-button>
|
||||
<el-button type="primary">
|
||||
Upload
|
||||
<i class="el-icon-upload el-icon-right" />
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<div class="block">
|
||||
<el-tag v-for="tag in tags" :key="tag.type" :type="tag.type" class="tag-item">
|
||||
{{ tag.name }}
|
||||
</el-tag>
|
||||
</div>
|
||||
|
||||
<div class="block">
|
||||
<el-radio-group v-model="radio">
|
||||
<el-radio :label="3">
|
||||
Option A
|
||||
</el-radio>
|
||||
<el-radio :label="6">
|
||||
Option B
|
||||
</el-radio>
|
||||
<el-radio :label="9">
|
||||
Option C
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
|
||||
<div class="block">
|
||||
<el-slider v-model="slideValue" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { toggleClass } from '@/utils'
|
||||
import '@/assets/custom-theme/index.css' // the theme changed version element-ui css
|
||||
|
||||
export default {
|
||||
name: 'Theme',
|
||||
data() {
|
||||
return {
|
||||
theme: false,
|
||||
tags: [
|
||||
{ name: 'Tag One', type: '' },
|
||||
{ name: 'Tag Two', type: 'info' },
|
||||
{ name: 'Tag Three', type: 'success' },
|
||||
{ name: 'Tag Four', type: 'warning' },
|
||||
{ name: 'Tag Five', type: 'danger' }
|
||||
],
|
||||
slideValue: 50,
|
||||
radio: 3
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
theme() {
|
||||
toggleClass(document.body, 'custom-theme')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.field-label{
|
||||
vertical-align: middle;
|
||||
}
|
||||
.box-card {
|
||||
width: 400px;
|
||||
max-width: 100%;
|
||||
margin: 20px auto;
|
||||
}
|
||||
|
||||
.block {
|
||||
padding: 30px 24px;
|
||||
}
|
||||
|
||||
.tag-item {
|
||||
margin-right: 15px;
|
||||
}
|
||||
</style>
|
||||
@ -1,77 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-input v-model="filename" placeholder="Please enter the file name (default file)" style="width:300px;" prefix-icon="el-icon-document" />
|
||||
<el-button :loading="downloadLoading" style="margin-bottom:20px;" type="primary" icon="el-icon-document" @click="handleDownload">
|
||||
Export Zip
|
||||
</el-button>
|
||||
<el-table v-loading="listLoading" :data="list" element-loading-text="拼命加载中" border fit highlight-current-row>
|
||||
<el-table-column align="center" label="ID" width="95">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.$index }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="Title">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.title }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="Author" width="95" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-tag>{{ scope.row.author }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="Readings" width="115" align="center">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.pageviews }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="Date" width="220">
|
||||
<template slot-scope="scope">
|
||||
<i class="el-icon-time" />
|
||||
<span>{{ scope.row.display_time }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { fetchList } from '@/api/article'
|
||||
|
||||
export default {
|
||||
name: 'ExportZip',
|
||||
data() {
|
||||
return {
|
||||
list: null,
|
||||
listLoading: true,
|
||||
downloadLoading: false,
|
||||
filename: ''
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
async fetchData() {
|
||||
this.listLoading = true
|
||||
const { data } = await fetchList()
|
||||
this.list = data.items
|
||||
this.listLoading = false
|
||||
},
|
||||
handleDownload() {
|
||||
this.downloadLoading = true
|
||||
import('@/vendor/Export2Zip').then(zip => {
|
||||
const tHeader = ['Id', 'Title', 'Author', 'Readings', 'Date']
|
||||
const filterVal = ['id', 'title', 'author', 'pageviews', 'display_time']
|
||||
const list = this.list
|
||||
const data = this.formatJson(filterVal, list)
|
||||
zip.export_txt_to_zip(tHeader, data, this.filename, this.filename)
|
||||
this.downloadLoading = false
|
||||
})
|
||||
},
|
||||
formatJson(filterVal, jsonData) {
|
||||
return jsonData.map(v => filterVal.map(j => v[j]))
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -18,13 +18,13 @@ const port = process.env.port || process.env.npm_config_port || 9527 // dev port
|
||||
// All configuration item explanations can be find in https://cli.vuejs.org/config/
|
||||
module.exports = {
|
||||
/**
|
||||
* You will need to set publicPath if you plan to deploy your site under a sub path,
|
||||
* for example GitHub Pages. If you plan to deploy your site to https://foo.github.io/bar/,
|
||||
* then publicPath should be set to "/bar/".
|
||||
* In most cases please use '/' !!!
|
||||
* You will need to set publicPath if you plan to deploy your site under a sub path,
|
||||
* for example GitHub Pages. If you plan to deploy your site to https://foo.github.io/bar/,
|
||||
* then publicPath should be set to "/bar/".
|
||||
* In most cases please use '/' !!!
|
||||
* Detail: https://cli.vuejs.org/config/#publicpath
|
||||
*/
|
||||
publicPath: '/',
|
||||
publicPath: '/bwhse',
|
||||
outputDir: 'dist',
|
||||
assetsDir: 'static',
|
||||
lintOnSave: process.env.NODE_ENV === 'development',
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user