gyyg-components 0.1.13 → 0.1.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,82 +1,82 @@
1
- /** el-table组件 */
2
- <template>
3
- <el-table class='simpleTableClass' ref="simpleTableRef" :data="data" :row-key="rowKey" :row-style="selectedRowStyle" highlight-current-row element-loading-text="加载中" @selection-change="handleSelectionChange" :height='height' @row-click="clickOne" border style="width: 100%">
4
- <slot name="content" />
5
- </el-table>
6
- </template>
7
-
8
- <script>
9
- export default {
10
- name:'GyygTable',
11
- data() {
12
- return {
13
- simpleMultipleSelection:this.multipleSelection
14
- }
15
- },
16
- props: {
17
- //列表数据
18
- data: {
19
- type: Array,
20
- default: () =>{
21
- return []
22
- },
23
- },
24
- //行的唯一标识
25
- rowKey: {
26
- type: [String,Number],
27
- default: 'id',
28
- },
29
- //选择的行
30
- multipleSelection: {
31
- type: Array,
32
- default: () =>{
33
- return []
34
- },
35
- },
36
- // 高度
37
- height: {
38
- type: [String,Number],
39
- default: '100%',
40
- },
41
- // 点击单行,是否只选中当前行
42
- toggleRow: {
43
- type: Boolean,
44
- default: true,
45
- }
46
- },
47
- methods: {
48
- // 列表选中加粗
49
- selectedRowStyle({ row }) {
50
- const idArr = this.simpleMultipleSelection.map(row => row[this.rowKey])
51
- if (idArr.includes(row[this.rowKey])) {
52
- return { 'font-weight': '700' }
53
- }
54
- },
55
- // 列表选中的当前行
56
- handleSelectionChange(row) {
57
- this.simpleMultipleSelection = row
58
- this.$emit('update:multipleSelection',this.simpleMultipleSelection)
59
- this.$emit('selectionChange',row)
60
- this.$emit('selection-change',row)
61
- },
62
- // 选中单条数据
63
- clickOne(row) {
64
- if(this.toggleRow){
65
- this.$refs.simpleTableRef.clearSelection()
66
- this.$refs.simpleTableRef.toggleRowSelection(row)
67
- this.$emit('rowClick',row)
68
- this.$emit('row-click',row)
69
- }
70
- },
71
- },
72
- }
73
- </script>
74
-
75
- <style>
76
- .simpleTableClass thead tr th {
77
- background-color:#F5F7FA !important;
78
- }
79
- .simpleTableClass td.el-table__cell{
80
- border-right:none;
81
- }
82
- </style>
1
+ /** el-table组件 */
2
+ <template>
3
+ <el-table class='simpleTableClass' ref="simpleTableRef" :data="data" :row-key="rowKey" :row-style="selectedRowStyle" highlight-current-row element-loading-text="加载中" @selection-change="handleSelectionChange" :height='height' @row-click="clickOne" border style="width: 100%">
4
+ <slot name="content" />
5
+ </el-table>
6
+ </template>
7
+
8
+ <script>
9
+ export default {
10
+ name:'GyygTable',
11
+ data() {
12
+ return {
13
+ simpleMultipleSelection:this.multipleSelection
14
+ }
15
+ },
16
+ props: {
17
+ //列表数据
18
+ data: {
19
+ type: Array,
20
+ default: () =>{
21
+ return []
22
+ },
23
+ },
24
+ //行的唯一标识
25
+ rowKey: {
26
+ type: [String,Number],
27
+ default: 'id',
28
+ },
29
+ //选择的行
30
+ multipleSelection: {
31
+ type: Array,
32
+ default: () =>{
33
+ return []
34
+ },
35
+ },
36
+ // 高度
37
+ height: {
38
+ type: [String,Number],
39
+ default: '100%',
40
+ },
41
+ // 点击单行,是否只选中当前行
42
+ toggleRow: {
43
+ type: Boolean,
44
+ default: true,
45
+ }
46
+ },
47
+ methods: {
48
+ // 列表选中加粗
49
+ selectedRowStyle({ row }) {
50
+ const idArr = this.simpleMultipleSelection.map(row => row[this.rowKey])
51
+ if (idArr.includes(row[this.rowKey])) {
52
+ return { 'font-weight': '700' }
53
+ }
54
+ },
55
+ // 列表选中的当前行
56
+ handleSelectionChange(row) {
57
+ this.simpleMultipleSelection = row
58
+ this.$emit('update:multipleSelection',this.simpleMultipleSelection)
59
+ this.$emit('selectionChange',row)
60
+ this.$emit('selection-change',row)
61
+ },
62
+ // 选中单条数据
63
+ clickOne(row) {
64
+ if(this.toggleRow){
65
+ this.$refs.simpleTableRef.clearSelection()
66
+ this.$refs.simpleTableRef.toggleRowSelection(row)
67
+ this.$emit('rowClick',row)
68
+ this.$emit('row-click',row)
69
+ }
70
+ },
71
+ },
72
+ }
73
+ </script>
74
+
75
+ <style>
76
+ .simpleTableClass thead tr th {
77
+ background-color:#F5F7FA !important;
78
+ }
79
+ .simpleTableClass td.el-table__cell{
80
+ border-right:none;
81
+ }
82
+ </style>
package/src/main.js CHANGED
@@ -1,17 +1,17 @@
1
- import Vue from 'vue'
2
- import App from './App.vue'
3
-
4
- Vue.config.productionTip = false
5
- import { Dialog,Button,Pagination,Input,Table,TableColumn } from 'element-ui';
6
- Vue.use(Dialog)
7
- Vue.use(Button)
8
- Vue.use(Pagination)
9
- Vue.use(Input)
10
- Vue.use(Table)
11
- Vue.use(TableColumn)
12
- import zj from '@/index.js'
13
- Vue.use(zj)
14
- import "./icons"; // icon
15
- new Vue({
16
- render: h => h(App),
17
- }).$mount('#app')
1
+ import Vue from 'vue'
2
+ import App from './App.vue'
3
+
4
+ Vue.config.productionTip = false
5
+ import { Dialog,Button,Pagination,Input,Table,TableColumn } from 'element-ui';
6
+ Vue.use(Dialog)
7
+ Vue.use(Button)
8
+ Vue.use(Pagination)
9
+ Vue.use(Input)
10
+ Vue.use(Table)
11
+ Vue.use(TableColumn)
12
+ import zj from '@/index.js'
13
+ Vue.use(zj)
14
+ import "./icons"; // icon
15
+ new Vue({
16
+ render: h => h(App),
17
+ }).$mount('#app')
package/vue.config.js CHANGED
@@ -1,24 +1,24 @@
1
- const path = require("path");
2
- function resolve(dir) {
3
- return path.join(__dirname, dir);
4
- }
5
- module.exports = {
6
- lintOnSave: false,
7
- chainWebpack: (config) => {
8
- config.module
9
- .rule('svg')
10
- .exclude.add(resolve('src/icons'))
11
- .end();
12
- config.module
13
- .rule('icons')
14
- .test(/\.svg$/)
15
- .include.add(resolve('src/icons'))
16
- .end()
17
- .use('svg-sprite-loader')
18
- .loader('svg-sprite-loader')
19
- .options({
20
- symbolId: 'icon-[name]'
21
- })
22
- .end();
23
- },
24
- };
1
+ const path = require("path");
2
+ function resolve(dir) {
3
+ return path.join(__dirname, dir);
4
+ }
5
+ module.exports = {
6
+ lintOnSave: false,
7
+ chainWebpack: (config) => {
8
+ config.module
9
+ .rule('svg')
10
+ .exclude.add(resolve('src/icons'))
11
+ .end();
12
+ config.module
13
+ .rule('icons')
14
+ .test(/\.svg$/)
15
+ .include.add(resolve('src/icons'))
16
+ .end()
17
+ .use('svg-sprite-loader')
18
+ .loader('svg-sprite-loader')
19
+ .options({
20
+ symbolId: 'icon-[name]'
21
+ })
22
+ .end();
23
+ },
24
+ };