Skip to content

bdc / bdcdj-web

Go to a project
Toggle navigation
Toggle navigation pinning
445d83dd by 任超
Options

结构

1 parent d742d4f1
Inline Side-by-side
Showing 20 changed files with 1 additions and 1147 deletions
1 export const httpStatus = (() => {
2 const status = {
3 OK: { code: 200, text: 'OK', description: '' },
4 CREATED: { code: 201, text: 'CREATED', description: '' },
5 DELETED: { code: 204, text: 'DELETED', description: '' },
6 NOT_MODIFIED: { code: 304, text: 'NOT MODIFIED', description: '' },
7 BAD_REQUEST: { code: 400, text: 'BAD REQUEST', description: '不正确的请求信息' },
8 METHOD_NOT_ALLOWED: { code: 405, text: 'METHOD NOT ALLOWED', description: '请求方法不支持' },
9 UNSUPPORTED_MEDIA_TYPE: { code: 415, text: 'UNSUPPORTED MEDIA TYPE', description: '媒体类型不支持' },
10 INTERNAL_SERVER_ERROR: { code: 500, text: 'INTERNAL SERVER_ERROR', description: '服务器内部错误' },
11 PAGE_NOT_FOUND: { code: 404, text: 'PAGE NOT FOUND', description: '网络资源无法访问' },
12 NOT_AUTHORIZED: { code: 401, text: 'NOT AUTHORIZED', description: '未经授权的访问' },
13 FORBIDDEN: { code: 403, text: 'FORBIDDEN', description: '禁止访问' },
14 UNPROCESSABLE_ENTITY: { code: 422, text: 'UNPROCESSABLE ENTITY', description: '' },
15 SESSION_TIME_OUT: { code: 419, text: 'SESSION_TIME_OUT', description: '会话超时' },
16 LOGIN_FAILURE:{ code: 11001, text: 'LOGIN_FAILURE', description: '登录失效' },
17 }
18 status.CODES = {
19 /**
20 * 成功
21 */
22 SUCCESS: {
23 200: status.OK,
24 201: status.CREATED,
25 204: status.DELETED,
26 304: status.NOT_MODIFIED
27 },
28 /**
29 * 程序错误或恶意攻击
30 */
31 PROGRAM_ERROR: {
32 400: status.BAD_REQUEST,
33 405: status.METHOD_NOT_ALLOWED,
34 415: status.UNSUPPORTED_MEDIA_TYPE,
35 500: status.INTERNAL_SERVER_ERROR
36 },
37 /**
38 * 网络访问错误
39 */
40 NETWORK_ERROR: {
41 404: status.PAGE_NOT_FOUND
42 },
43 /**
44 * 权限错误
45 * TODO 419未确定
46 */
47 AUTH_ERROR: {
48 401: status.NOT_AUTHORIZED,
49 403: status.FORBIDDEN,
50 419: status.SESSION_TIME_OUT
51 },
52 /**
53 * 正常交互错误
54 */
55 COMMUNICATION_ERROR: {
56 422: status.UNPROCESSABLE_ENTITY
57 },
58 /**
59 * 登录失效
60 */
61 LOGIN_FAILURE: {
62 11001: status.LOGIN_FAILURE
63 }
64 }
65 return status
66 })()
1 import request from '@/utils/request'
2
3 class dictionaries {
4 // 获取所有字典接口
5 async getDictionary(data){
6 return request({
7 url: '/system/sysDictionary/getDictionary',
8 method: 'get',
9 params: data,
10 })
11 }
12 // 获取字典根据字典标识码
13 async getDdicById (id) {
14 return request({
15 url: '/system/sysDictionary/getDdicById',
16 method: 'get',
17 params: {
18 id: id
19 },
20 })
21 }
22 //入住管理 导出
23 async checkexportData(data){
24 return request({
25 url:'/rent/zLiveManage/exportData',
26 method:'post',
27 data,
28 responseType: 'blob'
29 })
30 }
31 // 获取字典根据字典名称
32 async getDdicByMC (mc) {
33 return request({
34 url: '/system/sysDictionary/getDdicByMC',
35 method: 'get',
36 params: {
37 mc: mc
38 },
39 })
40 }
41 //
42 async getDetail () {
43 return request({
44 url: '/system/sysUser/getAddressInfo',
45 method: 'get',
46 })
47 }
48 // 根据市id,获取行政区-县区
49 async getDistByCity () {
50 return request({
51 url: '/xzq/getDistByCity',
52 method: 'get',
53 params: {
54 id: '350200000000'
55 },
56 })
57 }
58 // 行政区-县区-街道
59 async getXzq () {
60 return request({
61 url: '/xzq/getXzq',
62 method: 'get'
63 })
64 }
65
66
67 // 联想查询接口
68 async searchDepartmentByKeys () {
69 return request({
70 url: '/resource/fDepartment/searchDepartmentByKeys',
71 method: 'get',
72 })
73 }
74 async getAllDepartment(){
75 return request({
76 url:'/resource/fDepartment/getAllDepartment',
77 method:'get'
78 })
79 }
80 }
81 export default new dictionaries()
1 import request from '@/utils/request'
2
3
4 export function doLogin (data) {
5 return request({
6 method: 'post',
7 url: '/doLogin',
8 data
9 })
10 }
11
12 export function verifyCode () {
13 return request({
14 method: 'get',
15 url: '/verifyCode',
16 })
17 }
18 // 获取当前用户登录的信息
19 export function getCurrentUserInfo () {
20 return request({
21 method: 'get',
22 url: '/getSysUserDo',
23 })
24 }
25
26 // 忘记密码
27 export function forgetPassword (data) {
28 return request({
29 method: 'post',
30 url: '/system/sysUser/forgetPassword',
31 data
32 })
33 }
34
35 // 入驻
36 export function settle (data) {
37 return request({
38 method: 'post',
39 url: '/settle',
40 data: data
41 })
42 }
43
44 // 获取当前登录用户有权限的分店列表
45 export function getOrganizationUserList () {
46 return request({
47 url: '/getOrganizationUserList',
48 method: 'get'
49 })
50 }
51
52 // 重新设置当前登录用户信息
53 export function setOrganizationId (organizationId) {
54 return request({
55 url: '/setOrganizationId',
56 method: 'get',
57 params: {
58 organizationId: organizationId
59 }
60 })
61 }
1 import request from '@/utils/request'
2 export function login (data) {
3 return request({
4 url: '/doLogin',
5 method: 'post',
6 data
7 })
8 }
9
10 export function getMenuInfo () {
11 return request({
12 url: '/getWebMenuRole',
13 method: 'get',
14 })
15 }
16
17 export function logout () {
18 return request({
19 url: '/admin/logout',
20 method: 'post'
21 })
22 }
1 .dialogBox {
2 border-radius: 8px;
3 overflow: hidden;
4 background: #FFFFFF;
5 box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.10);
6
7 .dialog_title {
8 display: flex;
9 position: relative;
10 top: -2px;
11
12 b {
13 flex: 1;
14 width: 100%;
15 display: flex;
16 align-items: center;
17 justify-content: center;
18 }
19 }
20
21 .el-dialog__header {
22 height: 50px;
23 background: #FCFDFD;
24 border-radius: 4px 4px 0 0;
25 position: relative;
26 }
27
28 .dialog_full {
29 position: absolute;
30 top: 0;
31 right: 6%;
32 }
33
34 .el-dialog__body {
35 max-height: 88vh;
36 overflow-y: scroll;
37 overflow-x: hidden;
38 }
39
40 .dialog_footer {
41 flex-direction: column;
42
43 .dialog_button {
44 margin-top: 8px;
45 }
46 }
47 }
48
49 .el-dialog__wrapper {
50 overflow: hidden;
51 }
...\ No newline at end of file ...\ No newline at end of file
1 <template>
2 <el-dialog :visible.sync="dialogVisible" v-dialogDrag :width="width" @close="closeDialog('ruleForm', !showEnter)"
3 :fullscreen="fullscreen" top="0" :append-to-body="true" :lock-scroll="true" :close-on-click-modal="false"
4 custom-class="dialogBox" :destroy-on-close="true" :class="[customClass]" id="dialogBox" ref="dialogBox">
5 <div slot="title" class="dialog_title" ref="dialogTitle">
6 <b>{{ title }}</b>
7 <div v-if="isFullscreen" class="dialog_full">
8 <i class="el-icon-rank" v-if="fullscreen" @click="handleFullscreen"></i>
9 <i class="el-icon-full-screen" v-else @click="handleFullscreen" />
10 </div>
11 </div>
12 <div class="dialogBox-content" :style="{ height: scrollerHeight ? scrollerHeight : 'auto' }" :key="key">
13 <slot></slot>
14 </div>
15 <div slot="footer" class="dialog_footer" ref="dialogFooter" v-if="isButton">
16 <div class="dialog_button" v-if="normal">
17 <el-button @click="closeDialog('ruleForm',)" v-if="isReset && !isSave && showEnter">确定</el-button>
18 <el-button @click="closeDialog('ruleForm', showEnter)" v-if="isReset">取消</el-button>
19 <el-button type="primary" plain @click="submitForm('ruleForm')" v-if="isSave" :loading="saveloding">
20 {{ saveButton }}</el-button>
21
22 </div>
23 <div class="dialog_button" v-else>
24 <el-button @click="closeDiaActivity(true)">确定</el-button>
25 <el-button @click="closeDiaActivity(false)">取消</el-button>
26 </div>
27 </div>
28 </el-dialog>
29 </template>
30 <script>
31 export default {
32 props: {
33 activity: {
34 type: Boolean,
35 default: false,
36 },
37 normal: {
38 type: Boolean,
39 default: true,
40 },
41 showEnter: {
42 type: Boolean,
43 default: true,
44 },
45 isButton: {
46 type: Boolean,
47 default: true,
48 },
49 multiple: {
50 type: Boolean,
51 default: false,
52 },
53 width: {
54 type: String,
55 default: '70%',
56 },
57 title: {
58 type: String,
59 default: '',
60 },
61 customClass: {
62 type: String,
63 default: '',
64 },
65 topHeight: {
66 type: String,
67 default: '0',
68 },
69 isFullscreen: {
70 type: Boolean,
71 default: true,
72 },
73 isSave: {
74 type: Boolean,
75 default: true,
76 },
77 saveButton: {
78 type: String,
79 default: '提交',
80 },
81 isReset: {
82 type: Boolean,
83 default: true,
84 },
85 saveloding: {
86 type: Boolean,
87 default: false,
88 },
89 },
90 data () {
91 return {
92 key: 0,
93 dialogVisible: false,
94 fullscreen: false,
95 scrollerHeight: '',
96 }
97 },
98 methods: {
99 isShow () {
100 this.dialogVisible = true
101 },
102 isHide () {
103 this.dialogVisible = false
104 this.key++
105 },
106 handleFullscreen () {
107 this.fullscreen = !this.fullscreen
108 let height = document.getElementById('dialogBox').clientHeight
109 if (!this.fullscreen) {
110 this.scrollerHeight = false
111 } else {
112 this.scrollerHeight = (window.innerHeight - 180) + 'px'
113 }
114 },
115 submitForm (ruleForm) {
116 if (!this.multiple) {
117 this.$parent.submitForm(ruleForm)
118 } else {
119 this.$emit('submitForm', ruleForm);
120 }
121 },
122 closeDialog (ruleForm, flag) {
123 console.log(456789, this.multiple)
124 this.key++
125 if (!this.multiple) {
126 if (this.$parent.closeDialog) {
127 // console.log(1)
128 this.$parent.closeDialog(ruleForm)
129 } else {
130 // console.log(2)
131 this.dialogVisible = false;
132 }
133 } else {
134 this.$emit('closeDialog', ruleForm, flag);
135 }
136 },
137 closeDiaActivity (flag) {
138 this.$emit('closeDialog', flag);
139 }
140 },
141 }
142 </script>
143 <style rel="stylesheet/scss" lang="scss" >
144 @import "./index.scss";
145 </style>
...\ No newline at end of file ...\ No newline at end of file
1 ## 这个是弹框组件，对于element自带的组件进行封装，方便修改全局样式做统一操作
2 ### 使用时在组件中引用
3
4 ```
5 import dialogBox from '@/components/dialogBox/index'
6
7 <dialogBox ref="dialog" title="标题">
8 **在这里面写弹框内容**
9 </dialogBox>
10 *在父组件中使用 的按钮提交方法*
11 submitForm(ruleForm) {
12
13 }
14 ```
15 ##### 如果有多个弹框
16
17 ```
18 import dialogBox from '@/components/dialogBox/index'
19
20 <dialogBox ref="dialog" @submitForm="自定义方法" title="标题" :multiple="true">
21 **在这里面写弹框内容**
22 </dialogBox>
23 *在父组件中使用 的按钮提交方法*
24 自定义方法(ruleForm) {
25
26 }
27 ```
28
29 ## 打开该dialog：
30 this.$refs.dialog.isShow();
31 ## 隐藏该dialog：
32 this.$refs.dialog.isHide();
...\ No newline at end of file ...\ No newline at end of file
1 export default {
2 selection: {
3 renderHeader: (h, { store }) => {
4 return (
5 <el-checkbox
6 disabled={store.states.data && store.states.data.length === 0}
7 indeterminate={
8 store.states.selection.length > 0 && !store.states.isAllSelected
9 }
10 nativeOn-click={store.toggleAllSelection}
11 value={store.states.isAllSelected}
12 />
13 )
14 },
15 renderCell: (h, { row, column, store, $index }) => {
16 return (
17 <el-checkbox
18 nativeOn-click={event => event.stopPropagation()}
19 value={store.isSelected(row)}
20 disabled={
21 column.selectable
22 ? !column.selectable.call(null, row, $index)
23 : false
24 }
25 on-input={() => {
26 store.commit('rowSelectedChanged', row)
27 }}
28 />
29 )
30 },
31 sortable: false,
32 resizable: false
33 },
34 index: {
35 renderHeader: (h, scope) => {
36 return <span>{scope.column.label || '#'}</span>
37 },
38 renderCell: (h, { $index, column }) => {
39 let i = $index + 1
40 const index = column.index
41
42 if (typeof index === 'number') {
43 i = $index + index
44 } else if (typeof index === 'function') {
45 i = index($index)
46 }
47
48 return <div>{i}</div>
49 },
50 sortable: false
51 },
52 expand: {
53 renderHeader: (h, scope) => {
54 return <span>{scope.column.label || ''}</span>
55 },
56 renderCell: (h, { row, store }, proxy) => {
57 const expanded = store.states.expandRows.indexOf(row) > -1
58 return (
59 <div
60 class={
61 'el-table__expand-icon ' +
62 (expanded ? 'el-table__expand-icon--expanded' : '')
63 }
64 on-click={e => proxy.handleExpandClick(row, e)}
65 >
66 <i class='el-icon el-icon-arrow-right' />
67 </div>
68 )
69 },
70 sortable: false,
71 resizable: false,
72 className: 'el-table__expand-column'
73 }
74 }
1 import lbTable from './lb-table.vue'
2 export default {
3 install:(Vue) => {
4 Vue.component('lbTable',lbTable);
5 }
6 }
...\ No newline at end of file ...\ No newline at end of file
1 /*
2 * FileName: lb-column.vue
3 * Remark: element-column
4 * Project: lb-element-table
5 * Author: 任超
6 * File Created: Tuesday, 19th March 2019 9:58:23 am
7 * Last Modified: Tuesday, 19th March 2019 10:14:42 am
8 * Modified By: 任超
9 */
10
11 <template>
12 <el-table-column v-bind="$attrs"
13 v-on="$listeners"
14 :prop="column.prop"
15 :label="column.label"
16 :type="column.type"
17 :index="column.index"
18 :column-key="column.columnKey"
19 :width="column.width"
20 :min-width="setColumnWidth(column.label)"
21 :fixed="column.fixed"
22 :scoped-slot="column.renderHeader"
23 :sortable="column.sortable || false"
24 :sort-method="column.sortMethod"
25 :sort-by="column.sortBy"
26 :sort-orders="column.sortOrders"
27 :resizable="column.resizable || true"
28 :formatter="column.formatter"
29 :show-overflow-tooltip="column.showOverflowTooltip != null ? column.showOverflowTooltip : true"
30 :align="column.align!=null ? column.align : 'left'"
31 :header-align="column.headerAlign || headerAlign || column.align || align || 'left'"
32 :class-name="column.className"
33 :label-class-name="column.labelClassName"
34 :selectable="column.selectable"
35 :reserve-selection="column.reserveSelection || false"
36 :filters="column.filters"
37 :filter-placement="column.filterPlacement"
38 :filter-multiple="column.filterMultiple"
39 :filter-method="column.filterMethod"
40 :filtered-value="column.filteredValue">
41 <template slot="header"
42 slot-scope="scope">
43 <lb-render v-if="column.renderHeader"
44 :scope="scope"
45 :render="column.renderHeader">
46 </lb-render>
47 <span v-else>{{ scope.column.label }}</span>
48 </template>
49
50 <template slot-scope="scope">
51 <lb-render :scope="scope"
52 :render="column.render">
53 </lb-render>
54 </template>
55
56 <template v-if="column.children">
57 <lb-column v-for="(col, index) in column.children"
58 :key="index"
59 :column="col">
60 </lb-column>
61 </template>
62 </el-table-column>
63 </template>
64
65 <script>
66 import LbRender from './lb-render'
67 import forced from './forced.js'
68 export default {
69 name: 'LbColumn',
70 props: {
71 column: Object,
72 headerAlign: String,
73 align: String
74 },
75 components: {
76 LbRender
77 },
78 methods: {
79
80 setColumnWidth(str) {
81 let columnWidth = 0;
82 for (let char of str) {
83 if ((char >= 'A' && char <= 'Z') || (char >= 'a' && char <= 'z')) {
84 // 如果是英文字符，为字符分配10个单位宽度，单位宽度可根据字体大小调整
85 columnWidth += 10
86 } else if (char >= '\u4e00' && char <= '\u9fa5') {
87 // 如果是中文字符，为字符分配14个单位宽度，单位宽度可根据字体大小调整
88 columnWidth += 14
89 } else {
90 // 其他种类字符，为字符分配10个单位宽度，单位宽度可根据字体大小调整
91 columnWidth += 10
92 }
93 }
94 if (columnWidth < 120) {
95 // 设置最小宽度
96 columnWidth = 120
97 }
98 return columnWidth + 'px'
99 },
100 setColumn () {
101 if (this.column.type) {
102 this.column.renderHeader = forced[this.column.type].renderHeader
103 this.column.render = this.column.render || forced[this.column.type].renderCell
104 }
105 if (this.column.formatter) {
106 this.column.render = (h, scope) => {
107 return <span>{ scope.column.formatter(scope.row, scope.column, scope.row, scope.$index) }</span>
108 }
109 }
110 if (!this.column.render) {
111 this.column.render = (h, scope) => {
112 return <span>{ scope.row[scope.column.property] }</span>
113 }
114 }
115 }
116 },
117 watch: {
118 column: {
119 handler () {
120 this.setColumn()
121 },
122 immediate: true
123 }
124 }
125 }
126 </script>
1 /*
2 * FileName: lb-render.vue
3 * Remark: 自定义render
4 * Project: lb-element-table
5 * Author: 任超
6 * File Created: Tuesday, 19th March 2019 10:15:30 am
7 * Last Modified: Tuesday, 19th March 2019 10:15:32 am
8 * Modified By: 任超
9 */
10 <script>
11 export default {
12 name: 'LbRender',
13 functional: true,
14 props: {
15 scope: Object,
16 render: Function
17 },
18 render: (h, ctx) => {
19 return ctx.props.render ? ctx.props.render(h, ctx.props.scope) : ''
20 }
21 }
22 </script>
1 /*
2 * FileName: lb-table.vue
3 * Remark: element table
4 * Project: lb-element-table
5 * Author: 任超
6 * File Created: Tuesday, 19th March 2019 9:55:27 am
7 * Last Modified: Tuesday, 19th March 2019 9:55:34 am
8 * Modified By: 任超
9 */
10
11 <template>
12 <div :class="['lb-table', customClass]">
13 <el-table ref="elTable" :row-class-name="tableRowClassName" :show-header='showHeader'
14 :header-cell-style="{ background: '#F8FAFA' }" v-bind="$attrs" :height="tableHeight" v-on="$listeners" :data="data"
15 style="width: 100%" :span-method="this.merge ? this.mergeMethod : this.spanMethod">
16 <lb-column v-bind="$attrs" v-for="(item, index) in column" :key="index" :column="item">
17 </lb-column>
18 </el-table>
19 <br>
20 <el-pagination class="lb-table-pagination" v-if="pagination" v-bind="$attrs" v-on="$listeners" background
21 :page-sizes="[10, 15, 20, 50]" layout="total, sizes, prev, pager, next" @current-change="paginationCurrentChange"
22 :style="{ 'margin-top': paginationTop, 'text-align': paginationAlign }">
23 </el-pagination>
24 </div>
25 </template>
26
27 <script>
28 import LbColumn from './lb-column'
29 export default {
30 props: {
31 column: Array,
32 data: Array,
33 spanMethod: Function,
34 pagination: {
35 type: Boolean,
36 default: true,
37 },
38 border: {
39 type: Boolean,
40 default: true,
41 },
42 showHeader: {
43 type: Boolean,
44 default: true,
45 },
46 paginationTop: {
47 type: String,
48 default: '0',
49 },
50 heightNum: {
51 type: Number,
52 default: 405,
53 },
54 heightNumSetting: {
55 type: Boolean,
56 default: false,
57 },
58 customClass: {
59 type: String,
60 default: '',
61 },
62 paginationAlign: {
63 type: String,
64 default: 'left',
65 },
66 merge: Array,
67 },
68 components: {
69 LbColumn,
70 },
71 data () {
72 return {
73 tableHeight: '100%',
74 mergeLine: {},
75 mergeIndex: {},
76 }
77 },
78 created () {
79 this.getMergeArr(this.data, this.merge)
80 this.getHeight()
81
82 },
83 mounted () {
84 },
85 computed: {
86 dataLength () {
87 return [] || this.data.length
88 },
89 },
90 methods: {
91 tableRowClassName ({ row, rowIndex }) {
92 if (rowIndex % 2 === 1) {
93 return 'interlaced';
94 }
95 },
96 getHeight () {
97 if (this.heightNumSetting) {
98 this.tableHeight = this.heightNum + 'px'
99 } else {
100 this.tableHeight = window.innerHeight - this.heightNum + 'px'
101 }
102 },
103 changeHeight (heightNum) {
104 this.tableHeight = heightNum + 'px'
105 },
106 clearSelection () {
107 this.$refs.elTable.clearSelection()
108 },
109 toggleRowSelection (row, selected) {
110 this.$refs.elTable.toggleRowSelection(row, selected)
111 },
112 toggleAllSelection () {
113 this.$refs.elTable.toggleAllSelection()
114 },
115 toggleRowExpansion (row, expanded) {
116 this.$refs.elTable.toggleRowExpansion(row, expanded)
117 },
118 setCurrentRow (row) {
119 this.$refs.elTable.setCurrentRow(row)
120 },
121 clearSort () {
122 this.$refs.elTable.clearSort()
123 },
124 clearFilter (columnKey) {
125 this.$refs.elTable.clearFilter(columnKey)
126 },
127 doLayout () {
128 this.$refs.elTable.doLayout()
129 },
130 sort (prop, order) {
131 this.$refs.elTable.sort(prop, order)
132 },
133 paginationCurrentChange (val) {
134 this.$emit('p-current-change', val)
135 },
136 getMergeArr (tableData, merge) {
137 if (!merge) return
138 this.mergeLine = {}
139 this.mergeIndex = {}
140 merge.forEach((item, k) => {
141 tableData.forEach((data, i) => {
142 if (i === 0) {
143 this.mergeIndex[item] = this.mergeIndex[item] || []
144 this.mergeIndex[item].push(1)
145 this.mergeLine[item] = 0
146 } else {
147 if (data[item] === tableData[i - 1][item]) {
148 this.mergeIndex[item][this.mergeLine[item]] += 1
149 this.mergeIndex[item].push(0)
150 } else {
151 this.mergeIndex[item].push(1)
152 this.mergeLine[item] = i
153 }
154 }
155 })
156 })
157 },
158 mergeMethod ({ row, column, rowIndex, columnIndex }) {
159 const index = this.merge.indexOf(column.property)
160 if (index > -1) {
161 const _row = this.mergeIndex[this.merge[index]][rowIndex]
162 const _col = _row > 0 ? 1 : 0
163 return {
164 rowspan: _row,
165 colspan: _col,
166 }
167 }
168 },
169 },
170 watch: {
171 merge () {
172 this.getMergeArr(this.data, this.merge)
173 },
174 dataLength () {
175 this.getMergeArr(this.data, this.merge)
176 }
177 },
178 }
179 </script>
180 <style rel="stylesheet/scss" lang="scss" >
181 .lb-table {
182 .interlaced {
183 background: #FCFDFD;
184 ;
185 border: 1px solid #ECECEE;
186 }
187
188 .el-table {
189 border: 1px solid #ECECEE;
190 border-radius: 4px 4px 0 0;
191 }
192
193 .el-table::before {
194 display: none;
195 }
196
197 .el-table--enable-row-hover .el-table__body tr:hover>td {
198 background: #FBFCFD !important;
199 }
200 }
201
202 .el-table th>.cell {
203 padding-left: 20px;
204 }
205
206 .el-table .cell {
207 padding-left: 20px;
208 }
209 </style>
1 ## 这是对于element-table 进行的二次封装
2
3 ### 文档地址
4
5 <!-- table 已经全局注册不需要每个页面单独注册 -->
6
7 [Windows/Mac/Linux 全平台客户端](https://github.liubing.me/lb-element-table/zh/guide/)
1 import Vue from "vue";
2
3 /*
4
5 * 使用方法
6
7 * 将以下代码复制到一个js文件中，然后在入口文件main.js中import引入即可；
8
9 * 给elementUI的dialog上加上 v-dialogDrag 指令就可以实现弹窗的全屏和拉伸了。
10
11 * 给dialog设置 :close-on-click-modal="false" , 禁止点击遮罩层关闭弹出层
12
13 * 如果是form表单，不要将提交等按钮放置el-form-item，以免在上下拉伸时被隐藏
14
15 */
16
17 // v-dialogDrag: 弹窗拖拽+水平方向伸缩
18
19 Vue.directive('dialogDrag', {
20 bind(el, binding, vnode, oldVnode) {
21 const dialogHeaderEl = el.querySelector('.el-dialog__header');
22 const dragDom = el.querySelector('.el-dialog');
23 //dialogHeaderEl.style.cursor = 'move';
24 dialogHeaderEl.style.cssText += ';cursor:move;'
25 dragDom.style.cssText += ';top:0px;'
26
27 // 获取原有属性 ie dom元素.currentStyle 火狐谷歌 window.getComputedStyle(dom元素, null);
28 const sty = (function () {
29 if (window.document.currentStyle) {
30 return (dom, attr) => dom.currentStyle[attr];
31 } else {
32 return (dom, attr) => getComputedStyle(dom, false)[attr];
33 }
34 })()
35
36 dialogHeaderEl.onmousedown = (e) => {
37 // 鼠标按下，计算当前元素距离可视区的距离
38 const disX = e.clientX - dialogHeaderEl.offsetLeft;
39 const disY = e.clientY - dialogHeaderEl.offsetTop;
40
41 const screenWidth = document.body.clientWidth; // body当前宽度
42 const screenHeight = document.documentElement.clientHeight; // 可见区域高度(应为body高度，可某些环境下无法获取)
43
44 const dragDomWidth = dragDom.offsetWidth; // 对话框宽度
45 const dragDomheight = dragDom.offsetHeight; // 对话框高度
46
47 const minDragDomLeft = dragDom.offsetLeft;
48 const maxDragDomLeft = screenWidth - dragDom.offsetLeft - dragDomWidth;
49
50 const minDragDomTop = dragDom.offsetTop;
51 const maxDragDomTop = screenHeight - dragDom.offsetTop - dragDomheight;
52
53
54 // 获取到的值带px 正则匹配替换
55 let styL = sty(dragDom, 'left');
56 let styT = sty(dragDom, 'top');
57
58 // 注意在ie中 第一次获取到的值为组件自带50% 移动之后赋值为px
59 if (styL.includes('%')) {
60 styL = +document.body.clientWidth * (+styL.replace(/\%/g, '') / 100);
61 styT = +document.body.clientHeight * (+styT.replace(/\%/g, '') / 100);
62 } else {
63 styL = +styL.replace(/\px/g, '');
64 styT = +styT.replace(/\px/g, '');
65 };
66
67 document.onmousemove = function (e) {
68 // 通过事件委托，计算移动的距离
69 let left = e.clientX - disX;
70 let top = e.clientY - disY;
71
72 // 边界处理
73 if (-(left) > minDragDomLeft) {
74 left = -(minDragDomLeft);
75 } else if (left > maxDragDomLeft) {
76 left = maxDragDomLeft;
77 }
78
79 if (-(top) > minDragDomTop) {
80 top = -(minDragDomTop);
81 } else if (top > maxDragDomTop) {
82 top = maxDragDomTop;
83 }
84
85 // 移动当前元素
86 dragDom.style.cssText += `;left:${left + styL}px;top:${top + styT}px;`;
87 };
88
89 document.onmouseup = function (e) {
90 document.onmousemove = null;
91 document.onmouseup = null;
92 };
93 }
94 }
95 })
...\ No newline at end of file ...\ No newline at end of file
1
2 import onlyNumber from './onlyNumber'
3 const install = Vue => {
4 Vue.directive('onlyNumber', onlyNumber)
5 }
6 /*
7 Vue.use( plugin )
8 安装 Vue.js 插件。如果插件是一个对象，必须提供 install 方法。
9 如果插件是一个函数，它会被作为 install 方法。install 方法调用时，会将 Vue 作为参数传入。
10 该方法需要在调用 new Vue() 之前被调用。
11 当 install 方法被同一个插件多次调用，插件将只会被安装一次。
12 */
13
14 if (window.Vue) {
15 window['onlyNumber'] = onlyNumber
16 Vue.use(install); // eslint-disable-line
17 }
18
19 onlyNumber.install = install
20 export default onlyNumber
...\ No newline at end of file ...\ No newline at end of file
1 export default {
2 inserted (el, vDir, vNode) {
3 // vDir.value 有指令的参数
4 let content;
5 //按键按下=>只允许输入 数字/小数点
6 el.addEventListener("keypress", event => {
7 let e = event || window.event;
8 let inputKey = String.fromCharCode(typeof e.charCode === 'number' ? e.charCode : e.keyCode);
9 let re = /\d|\./;
10 content = e.target.value;
11 //定义方法,阻止输入
12 function preventInput () {
13 if (e.preventDefault) {
14 e.preventDefault();
15 } else {
16 e.returnValue = false;
17 }
18 }
19 if (!re.test(inputKey) && !e.ctrlKey) {
20 preventInput();
21 } else if (content.indexOf(".") > 0 && inputKey == ".") {
22 //已有小数点,再次输入小数点
23 preventInput();
24 }
25 });
26 //按键弹起=>并限制最大最小
27 el.addEventListener("keyup", event => {
28 let e = event || window.event;
29 content = parseFloat(e.target.value);
30 let arg_max = "";
31 let arg_min = "";
32 if (vDir.value) {
33 arg_max = parseFloat(vDir.value.max);
34 arg_min = parseFloat(vDir.value.min);
35 }
36 if (arg_max && content > arg_max) {
37 e.target.value = arg_max;
38 content = arg_max;
39 }
40 if (arg_min && content < arg_min) {
41 e.target.value = arg_min;
42 content = arg_min;
43 }
44 if (!content) {
45 content = '';
46 }
47 });
48 //失去焦点=>保留指定位小数
49 el.addEventListener("keydown", event => {//此处会在 el-input 的 @change 后执行
50 let e = event || window.event;
51 let key = e.key
52 if (vDir.value.precision == 0) {
53 // 不允许输入'e'和'.'
54 if (key === 'e' || key === '.') {
55 e.returnValue = false
56 return false
57 }
58 }else {
59 if (e.target.value != '') {
60 let arg_precision = 0;//默认保留至整数
61 if (vDir.value.precision) {
62 arg_precision = parseFloat(vDir.value.precision);
63 }
64 let reg = new RegExp(`^\\d*(\\.?\\d{0,${arg_precision-1}})`, 'g')
65 e.target.value = (e.target.value.match(reg)[0]) || null
66 }
67 }
68 // content = parseFloat(e.target.value);
69 // if (!content) {
70 // content = 0.00;
71 // }
72 // if (e.target.value != '') {
73 // let arg_precision = 0;//默认保留至整数
74 // if (vDir.value.precision) {
75 // arg_precision = parseFloat(vDir.value.precision);
76 // }
77 // e.target.value = content.toFixed(arg_precision);
78 // }
79 // -- callback写法1
80 // vNode.data.model.callback = ()=>{
81 // e.target.value = content.toFixed(arg_precision)
82 // }
83 // vNode.data.model.callback();
84 // -- callback 写法2
85 // vNode.data.model.callback(
86 // e.target.value = content.toFixed(arg_precision)
87 // )
88 })
89 }
90 }
...\ No newline at end of file ...\ No newline at end of file
1 import store from '@/store' 1 import store from '@/store'
2 import dictionaries from '@/api/dictionaries'
3
4 // 证件种类全局过滤器
5 export function cardTypeFilter (value) {
6 var name
7 if (store.getters.cardTypeOption.length == 0) {
8 dictionaries.getDdicByMC('证件种类').then((res) => {
9 store.dispatch('dictionaries/getCardType', res.result)
10 })
11 }
12 store.getters.cardTypeOption.map((item) => {
13 if (item.id == value) {
14 name = item.name
15 }
16 });
17 if (name) {
18 return name
19 } else {
20 return '暂无'
21 }
22 }
23
24 // 全部字典
25 export function stsInfo (value) {
26 if (store.getters.stsInfo.length == 0) {
27 dictionaries.getDictionary().then(res => {
28 store.dispatch('dictionariesAll/getDicData', res.result)
29 })
30 }
31 }
......
...@@ -3,14 +3,10 @@ import 'babel-polyfill' ...@@ -3,14 +3,10 @@ import 'babel-polyfill'
3 import Vue from 'vue' 3 import Vue from 'vue'
4 import App from './App' 4 import App from './App'
5 import 'normalize.css/normalize.css' // a modern alternative to CSS resets 5 import 'normalize.css/normalize.css' // a modern alternative to CSS resets
6 import './directive/dragDialog';
7 import Element from 'element-ui' 6 import Element from 'element-ui'
8 import './styles/element-variables.scss' 7 import './styles/element-variables.scss'
9 import '@/styles/index.scss' // global css 8 import '@/styles/index.scss' // global css
10 9
11 import onlyNumber from '@/directive/el-input'; //添加此行=>自定义全局指令
12
13 import lbTable from './components/lb-table/index';
14 10
15 import store from './store' 11 import store from './store'
16 import router from './router' 12 import router from './router'
...@@ -18,11 +14,8 @@ import _ from 'lodash' ...@@ -18,11 +14,8 @@ import _ from 'lodash'
18 14
19 import './icons' // icon 15 import './icons' // icon
20 import * as filters from './filters' // global filters 16 import * as filters from './filters' // global filters
21 Vue.use(lbTable);
22
23 Vue.use(onlyNumber);
24 Vue.use(Element, { 17 Vue.use(Element, {
25 size: 'small' // set element-ui default size 18 size: 'small'
26 }) 19 })
27 Object.keys(filters).forEach(key => { 20 Object.keys(filters).forEach(key => {
28 Vue.filter(key, filters[key]) 21 Vue.filter(key, filters[key])
......
1 import router from './router' 1 import router from './router'
2 import store from './store' 2 import store from './store'
3 import { getMenuInfo } from '@/api/user'
4 import NProgress from 'nprogress' // progress bar 3 import NProgress from 'nprogress' // progress bar
5 import 'nprogress/nprogress.css' // progress bar style 4 import 'nprogress/nprogress.css' // progress bar style
6 import getPageTitle from '@/utils/get-page-title' 5 import getPageTitle from '@/utils/get-page-title'
......
1 import { login } from '@/api/user'
2 import store from '../index' 1 import store from '../index'
3 import router, { resetRouter } from '@/router' 2 import router, { resetRouter } from '@/router'
4 import { Message } from "element-ui"; 3 import { Message } from "element-ui";
......