gy-webcode2 1.1.8 → 1.2.1

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.
Files changed (13) hide show
  1. package/components/breadcrumb.vue +31 -26
  2. package/components/themeConfig.vue +189 -142
  3. package/css/layout.scss +1 -1
  4. package/css/modules/elementUI.scss +2 -0
  5. package/css/modules/table.scss +50 -9
  6. package/css/modules/tree_check.scss +28 -1
  7. package/framework/App.vue +30 -0
  8. package/framework/index.vue +49 -0
  9. package/framework/login.vue +227 -0
  10. package/framework/main.vue +362 -0
  11. package/framework/refresh.vue +18 -0
  12. package/index.js +3 -2
  13. package/package.json +1 -1
package/components/breadcrumb.vue CHANGED
@@ -2,7 +2,7 @@
2
2
  <div class="breadcrumb">
3
3
  <div class="row1" v-if="showRow1">
4
4
  <div class="title ">
5
- <span class="">{{$route.meta.headerMenuName}}</span>
5
+ <span class="">{{menuPath.meta.headerMenuName}}</span>
6
6
  <!-- <span class="breadcrumb_iconBox">
7
7
  <i class="el-icon-arrow-right"></i>
8
8
  </span>
@@ -10,8 +10,9 @@
10
10
  {{$route.meta.name}}
11
11
  </span> -->
12
12
  <template v-for="item,index in routerBreadcrumb">
13
- <span class="breadcrumb_iconBox">
14
- <i class="el-icon-arrow-right"></i>
13
+ <span class="breadcrumb_iconBox flex aic jcc">
14
+ <i class="common_iconfont common_icon-xiexian fs_12"></i>
15
+ <!-- <i class="el-icon-arrow-right"></i> -->
15
16
  </span>
16
17
  <span :class="{hover2:index < routerBreadcrumb.length -1,s1:index == routerBreadcrumb.length -1}" @click="itemClick(item,index)">
17
18
  {{item.name}}
@@ -28,7 +29,7 @@
28
29
  {{routerBreadcrumb[routerBreadcrumb.length -1].name}}
29
30
  </template>
30
31
  <template v-else>
31
- {{$route.meta.name}}
32
+ {{menuPath.name}}
32
33
  </template>
33
34
  </span>
34
35
 
@@ -38,6 +39,9 @@
38
39
  <div class="other">
39
40
  <div class="otherContainer">
40
41
  <slot name="other"></slot>
42
+ <el-button title="返回" @click="backClick()" v-if="isBack" icon="" type="primary" class="btnIcon mar_l_10">
43
+ <i class="el-icon-arrow-left"></i>
44
+ </el-button>
41
45
  </div>
42
46
  </div>
43
47
  </div>
@@ -60,11 +64,21 @@ export default {
60
64
  data(){
61
65
  return {
62
66
  myID:"",
67
+ fullPath:"",
63
68
  }
64
69
  },
65
70
  watch:{
66
71
  },
67
72
  computed:{
73
+ menuPath(){
74
+ // return this.$store.state.menu.menuPath[this.$route.fullPath]
75
+ let menu = this.$store.state.menu.menuPath
76
+ let menuKey = Object.keys(menu).find(key => {
77
+ return this.fullPath.includes(key)
78
+ })
79
+ // let findMenu =
80
+ return menu[menuKey]
81
+ },
68
82
  names(){
69
83
  return this.name ? this.name.split(',') : []
70
84
  },
@@ -79,12 +93,9 @@ export default {
79
93
  return true;
80
94
  }
81
95
  },
82
- routeName(){
83
- return this.$route.name;
84
- },
85
96
  routerBreadcrumb(){
86
- if(this.breadcrumb_list[this.routeName]){
87
- return this.breadcrumb_list[this.routeName]
97
+ if(this.breadcrumb_list[this.fullPath]){
98
+ return this.breadcrumb_list[this.fullPath]
88
99
  }
89
100
  return []
90
101
  }
@@ -92,9 +103,10 @@ export default {
92
103
  },
93
104
  created(){
94
105
  let breadcrumb_list = this.breadcrumb_list;
95
- let routeName = this.$route.name;
96
- if(!breadcrumb_list[routeName]){
97
- this.$set(breadcrumb_list,routeName,[])
106
+ let fullPath = this.$route.fullPath;
107
+ this.fullPath = fullPath;
108
+ if(!breadcrumb_list[fullPath]){
109
+ this.$set(breadcrumb_list,fullPath,[])
98
110
  }
99
111
  let myID = uuid(10,16)
100
112
  this.myID = myID;
@@ -102,7 +114,7 @@ export default {
102
114
  if(this.names.length){
103
115
  this.names.forEach(item => {
104
116
 
105
- breadcrumb_list[routeName].push({
117
+ breadcrumb_list[fullPath].push({
106
118
  name:item,
107
119
  id:myID,
108
120
  click:this.backClick
@@ -110,8 +122,8 @@ export default {
110
122
  })
111
123
  }
112
124
  else{
113
- breadcrumb_list[routeName].push({
114
- name:this.$route.meta.name,
125
+ breadcrumb_list[fullPath].push({
126
+ name:this.menuPath.name,
115
127
  id:myID,
116
128
  click:this.backClick
117
129
  })
@@ -119,11 +131,6 @@ export default {
119
131
  },
120
132
  methods:{
121
133
  backClick(){
122
- let routeName = this.$route.name;
123
- let rIndex = this.breadcrumb_list[routeName].findIndex(i => i.id == this.myID)
124
- this.breadcrumb_list[routeName] = this.breadcrumb_list[routeName].slice(0,rIndex)
125
-
126
-
127
134
  this.$emit('goBack');
128
135
  },
129
136
  itemClick(data,index){
@@ -138,13 +145,11 @@ export default {
138
145
  }
139
146
  },
140
147
  beforeDestroy(){
141
- if(this.routerBreadcrumb[0] && this.routerBreadcrumb[0].id == this.myID){
142
- let routeName = this.$route.name;
143
- this.breadcrumb_list[routeName] = []
148
+ if(this.breadcrumb_list[this.fullPath]){
149
+ let rIndex = this.breadcrumb_list[this.fullPath].findIndex(i => i.id == this.myID)
150
+ this.breadcrumb_list[this.fullPath].splice(rIndex,1)
144
151
  }
145
- // let routeName = this.$route.name;
146
- // let rIndex = this.routerBreadcrumb.findIndex(i => i.id == this.myID)
147
- // this.breadcrumb_list[routeName] = this.routerBreadcrumb.splice(0,rIndex);
152
+
148
153
  }
149
154
  }
150
155
  </script>
package/components/themeConfig.vue CHANGED
@@ -1,22 +1,39 @@
1
1
  <template>
2
2
  <scrollBar left="24px" top="10px" right="24px">
3
3
  <div class="pageStyle">
4
- <div class="row1">
5
- 整体风格设置
6
- </div>
4
+ <div class="row1">整体风格设置</div>
7
5
  <div class="stylPreview">
8
- <div class="item" @click="changeTheme(item.value)" :class="[`item_${item.id}`,{active:themeName == item.value}]" v-for="item,index in themeList" :key="item.id">
6
+ <div
7
+ class="item"
8
+ @click="changeTheme(item.value)"
9
+ :class="[
10
+ `item_${item.id}`,
11
+ { active: themeName == item.value },
12
+ ]"
13
+ v-for="(item, index) in themeList"
14
+ :key="item.id"
15
+ >
9
16
  <div class="iconBox">
10
17
  <i class="el-icon-check"></i>
11
18
  </div>
12
19
  </div>
13
20
  </div>
14
- <div class="row1 mar_t_10">
15
- 主题色
16
- </div>
21
+ <div class="row1 mar_t_10">主题色</div>
17
22
  <div class="themeColors">
18
- <el-tooltip v-for="item,index in themeColorList" :key="item.id" :open-delay="200" effect="dark" :content="item.name" placement="top">
19
- <div class="item" @click="changeThemeColor(item.value)" :class="{active:themeColor == item.value}" :style="`background-color:${item.color}`">
23
+ <el-tooltip
24
+ v-for="(item, index) in themeColorList"
25
+ :key="item.id"
26
+ :open-delay="200"
27
+ effect="dark"
28
+ :content="item.name"
29
+ placement="top"
30
+ >
31
+ <div
32
+ class="item"
33
+ @click="changeThemeColor(item.value)"
34
+ :class="{ active: themeColor == item.value }"
35
+ :style="`background-color:${item.color}`"
36
+ >
20
37
  <div class="iconBox">
21
38
  <i class="el-icon-check"></i>
22
39
  </div>
@@ -24,9 +41,7 @@
24
41
  </el-tooltip>
25
42
  </div>
26
43
  <el-divider></el-divider>
27
- <div class="row1 mar_t_10">
28
- 内容区域
29
- </div>
44
+ <div class="row1 mar_t_10">内容区域</div>
30
45
  <!-- <div class="flex aic jcb pad_t_10 pad_b_10">
31
46
  <div>水印</div>
32
47
  <div>
@@ -36,154 +51,187 @@
36
51
  <div class="flex aic jcb pad_t_10 pad_b_10">
37
52
  <div>面包屑</div>
38
53
  <div>
39
- <el-switch @change="(value)=>{setPageStyle('breadcrumbShow',value)}" v-model="$store.state.vuex_breadcrumbShow"></el-switch>
54
+ <el-switch
55
+ @change="
56
+ (value) => {
57
+ setPageStyle('breadcrumbShow', value);
58
+ }
59
+ "
60
+ v-model="$store.state.vuex_breadcrumbShow"
61
+ ></el-switch>
62
+ </div>
63
+ </div>
64
+ <div class="flex aic jcb pad_t_10 pad_b_10">
65
+ <div>页面选项卡</div>
66
+ <div>
67
+ <el-switch
68
+ v-model="routeTabsShow"
69
+ @change="tabsChange"
70
+ ></el-switch>
40
71
  </div>
41
72
  </div>
42
73
  </div>
43
-
44
74
  </scrollBar>
45
75
  </template>
46
76
 
47
77
  <script>
48
- export default {
49
- props:['wrapStyle_dialog'],
50
- data(){
51
- return {
52
- themeList:[
53
- {
54
- name:"默认",
55
- id:"1",
56
- value:"default",
57
- img:"pageStyle_1.png"
58
- },
59
- {
60
- name:"深蓝",
61
- id:"2",
62
- value:"shenlan",
63
- img:"pageStyle_2.png"
64
- },
65
- {
66
- name:"海蓝",
67
- id:"3",
68
- value:"hailan",
69
- img:"pageStyle_3.png"
70
- },
71
- // {
72
- // name:"绿",
73
- // id:"4",
74
- // value:"lv"
75
- // },
76
- ],
78
+ export default {
79
+ props: ["wrapStyle_dialog"],
80
+ data() {
81
+ return {
82
+ themeList: [
83
+ {
84
+ name: "默认",
85
+ id: "1",
86
+ value: "default",
87
+ img: "pageStyle_1.png",
88
+ },
89
+ {
90
+ name: "深蓝",
91
+ id: "2",
92
+ value: "shenlan",
93
+ img: "pageStyle_2.png",
94
+ },
95
+ {
96
+ name: "海蓝",
97
+ id: "3",
98
+ value: "hailan",
99
+ img: "pageStyle_3.png",
100
+ },
101
+ // {
102
+ // name:"绿",
103
+ // id:"4",
104
+ // value:"lv"
105
+ // },
106
+ ],
77
107
 
78
- themeColorList:[
79
- {
80
- name:"拂晓蓝（默认）",
81
- value:"lan",
82
- id:1,
83
- color:"#1890ff"
84
- },
85
- {
86
- name:"薄暮",
87
- value:"hong",
88
- id:2,
89
- color:"#f5222d"
90
- },
91
- {
92
- name:"火山",
93
- value:"cheng",
94
- id:3,
95
- color:"#fb551b"
96
- },
97
- {
98
- name:"日暮",
99
- value:"huang",
100
- id:4,
101
- color:"#fa8c16"
102
- },
103
- {
104
- name:"明青",
105
- value:"qing",
106
- id:5,
107
- color:"#15c3c1"
108
- },
109
- {
110
- name:"极光绿",
111
- value:"lv",
112
- id:6,
113
- color:"#52c41a"
114
- },
115
- {
116
- name:"极客蓝",
117
- value:"shenaln",
118
- id:7,
119
- color:"#2f54eb"
120
- },
121
- {
122
- name:"酱紫",
123
- value:"zi",
124
- id:8,
125
- color:"#722ed1"
126
- },
127
- ],
128
- }
108
+ themeColorList: [
109
+ {
110
+ name: "拂晓蓝（默认）",
111
+ value: "lan",
112
+ id: 1,
113
+ color: "#1890ff",
114
+ },
115
+ {
116
+ name: "薄暮",
117
+ value: "hong",
118
+ id: 2,
119
+ color: "#f5222d",
120
+ },
121
+ {
122
+ name: "火山",
123
+ value: "cheng",
124
+ id: 3,
125
+ color: "#fb551b",
126
+ },
127
+ {
128
+ name: "日暮",
129
+ value: "huang",
130
+ id: 4,
131
+ color: "#fa8c16",
132
+ },
133
+ {
134
+ name: "明青",
135
+ value: "qing",
136
+ id: 5,
137
+ color: "#15c3c1",
138
+ },
139
+ {
140
+ name: "极光绿",
141
+ value: "lv",
142
+ id: 6,
143
+ color: "#52c41a",
144
+ },
145
+ {
146
+ name: "极客蓝",
147
+ value: "shenaln",
148
+ id: 7,
149
+ color: "#2f54eb",
150
+ },
151
+ {
152
+ name: "酱紫",
153
+ value: "zi",
154
+ id: 8,
155
+ color: "#722ed1",
156
+ },
157
+ ],
158
+ routeTabsShow:false,
159
+ };
160
+ },
161
+ computed: {
162
+ themeName() {
163
+ return this.$store.state.vuex_themeName;
129
164
  },
130
- computed:{
131
- themeName(){
132
- return this.$store.state.vuex_themeName
133
- },
134
- themeColor(){
135
- return this.$store.state.vuex_themeColor
136
- },
165
+ themeColor() {
166
+ return this.$store.state.vuex_themeColor;
137
167
  },
138
- methods:{
139
- changeTheme(value){
140
- this.$store.state.vuex_themeName = value;
141
- window.document.body.setAttribute('data-theme', value)
142
- this.setPageStyle('themeName',value)
143
- },
144
- changeThemeColor(value){
145
- this.$store.state.vuex_themeColor = value;
146
- window.document.body.setAttribute('data-theme-color', value)
147
- this.setPageStyle('themeColor',value)
148
- },
149
- setPageStyle(key,val){
150
- let gyPageStyle = localStorage.getItem('gy_pageStyle');
151
- if(gyPageStyle){
152
- gyPageStyle =JSON.parse(gyPageStyle)
153
- }
154
- else{
155
- gyPageStyle = {}
156
- }
157
- // console.log(gyPageStyle);
158
- // console.log(key,val);
159
- gyPageStyle[key] = val;
160
- localStorage.setItem('gy_pageStyle',JSON.stringify(gyPageStyle))
168
+ },
169
+ created(){
170
+ this.routeTabsShow = this.$store.state.vuex_routeTabsShow
171
+ },
172
+ methods: {
173
+ tabsChange(value){
174
+ this.$confirm('修改后需要刷新浏览器，确定修改吗?', '提示', {
175
+ confirmButtonText: '确定',
176
+ cancelButtonText: '取消',
177
+ type: 'warning'
178
+ }).then(() => {
179
+ window.location.reload()
180
+ // this.themeStore.setTheme('routeTabsShow',val)
181
+ // this.$store.state.vuex_themeName = value;
182
+ this.setPageStyle("routeTabsShow", value);
183
+
184
+ }).catch(() => {
185
+ this.routeTabsShow = !value;
186
+ });
187
+ },
188
+ changeTheme(value) {
189
+ this.$store.state.vuex_themeName = value;
190
+ window.document.body.setAttribute("data-theme", value);
191
+ this.setPageStyle("themeName", value);
192
+ },
193
+ changeThemeColor(value) {
194
+ this.$store.state.vuex_themeColor = value;
195
+ window.document.body.setAttribute("data-theme-color", value);
196
+ this.setPageStyle("themeColor", value);
197
+ },
198
+ setPageStyle(key, val) {
199
+ let gyPageStyle = localStorage.getItem("gy_pageStyle");
200
+ if (gyPageStyle) {
201
+ gyPageStyle = JSON.parse(gyPageStyle);
202
+ } else {
203
+ gyPageStyle = {};
161
204
  }
162
- }
163
- }
205
+ // console.log(gyPageStyle);
206
+ // console.log(key,val);
207
+ gyPageStyle[key] = val;
208
+ localStorage.setItem("gy_pageStyle", JSON.stringify(gyPageStyle));
209
+ },
210
+ },
211
+ };
164
212
  </script>
165
213
 
166
214
  <style lang="scss" scoped>
167
- .pageStyle{
215
+ .pageStyle {
168
216
  position: relative;
169
- .row1{
217
+ .row1 {
170
218
  padding: 10px 0;
171
219
  // padding: 10px 0 5px 0;
172
220
  font-weight: bold;
173
221
  }
174
- .stylPreview{
222
+ .stylPreview {
175
223
  display: flex;
176
224
  padding: 10px 0;
177
- .item{
225
+ .item {
178
226
  position: relative;
179
227
  width: 64px;
180
228
  height: 48px;
181
229
  margin-right: 16px;
182
230
  box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.1);
183
231
  cursor: pointer;
184
- .iconBox{
232
+ .iconBox {
185
233
  display: none;
186
- color: #1890ff ;
234
+ color: #1890ff;
187
235
  font-size: 20px;
188
236
  width: 20px;
189
237
  height: 20px;
@@ -191,24 +239,24 @@
191
239
  left: 30px;
192
240
  top: 22px;
193
241
  }
194
- &.active .iconBox{
242
+ &.active .iconBox {
195
243
  display: block;
196
244
  }
197
- &.item_1{
245
+ &.item_1 {
198
246
  background-image: url("~gy-webcode2/img/theme/pageStyle_1.png");
199
247
  }
200
- &.item_2{
248
+ &.item_2 {
201
249
  background-image: url("~gy-webcode2/img/theme/pageStyle_2.png");
202
250
  }
203
- &.item_3{
251
+ &.item_3 {
204
252
  background-image: url("~gy-webcode2/img/theme/pageStyle_3.png");
205
253
  }
206
254
  }
207
255
  }
208
- .themeColors{
256
+ .themeColors {
209
257
  display: flex;
210
258
  padding: 10px 0;
211
- .item{
259
+ .item {
212
260
  width: 20px;
213
261
  height: 20px;
214
262
  background: #000;
@@ -222,14 +270,13 @@
222
270
  color: #fff;
223
271
  font-size: 12px;
224
272
  cursor: pointer;
225
- .iconBox{
226
- display: none;
273
+ .iconBox {
274
+ display: none;
227
275
  }
228
- &.active .iconBox{
276
+ &.active .iconBox {
229
277
  display: block;
230
278
  }
231
279
  }
232
280
  }
233
-
234
281
  }
235
282
  </style>
package/css/layout.scss CHANGED
@@ -339,7 +339,7 @@
339
339
  top: 0;
340
340
  right: 0;
341
341
  bottom: 0;
342
- z-index: 10;
342
+ z-index: 99999;
343
343
  }
344
344
 
345
345
  .routerTabs{
package/css/modules/elementUI.scss CHANGED
@@ -5,6 +5,7 @@
5
5
  // align-items: center;
6
6
  line-height: normal;
7
7
  transition: all 0.2s ease;
8
+
8
9
  // color: #262626;
9
10
  &.lan{
10
11
  @include themeColor("color",'color');
@@ -76,6 +77,7 @@
76
77
  font-size: 14px;
77
78
  padding: 5px 10px;
78
79
  min-width: 72px;
80
+ height: 32px;
79
81
  border-radius: 6px;
80
82
  // padding: 0;
81
83
  }
package/css/modules/table.scss CHANGED
@@ -12,17 +12,48 @@
12
12
  font-weight: initial;
13
13
  font-size: 14px;
14
14
  }
15
- &:nth-of-type(1){
16
- border-radius: 8px 0 0 0 ;
15
+ // &:nth-of-type(1){
16
+ // border-radius: 8px 0 0 0 ;
17
+ // }
18
+ // &:nth-last-child(2){
19
+ // border-radius:0 ;
20
+ // // border-right: none;
21
+ // }
22
+ // &:nth-last-child(1){
23
+ // border-radius:0 8px 0 0 ;
24
+ // }
25
+ }
26
+
27
+ thead.is-group th.el-table__cell,th{
28
+ // --el-fill-color-light:var(#fafafa);
29
+ background: #f0f0f0 !important;
30
+ // @include themeColor("-el-fill-color-light",'hover');
31
+ border-right: 1px solid #d9d9d9 !important;
32
+
33
+ >.cell{
34
+ color:$color;
35
+ font-weight: initial;
36
+ font-size: 14px;
17
37
  }
18
- &:nth-last-child(2){
19
- border-radius:0 ;
20
- // border-right: none;
38
+
39
+ // &:nth-last-child(1){
40
+ // border-radius:0 8px 0 0 ;
41
+ // border-right: none !important;
42
+ // }
43
+ }
44
+
45
+ thead tr:nth-of-type(1){
46
+ th:nth-of-type(1){
47
+ border-radius: 8px 0 0 0 ;
21
48
  }
22
- &:nth-last-child(1){
49
+ th:nth-last-child(1){
23
50
  border-radius:0 8px 0 0 ;
51
+ border-right: none !important;
24
52
  }
25
53
  }
54
+
55
+
56
+
26
57
  .cell{
27
58
  line-height: 20px;
28
59
  padding-left:10px;
@@ -42,16 +73,26 @@
42
73
  @include themeColor("background-color",'hover',0.1)
43
74
  }
44
75
 
45
- .el-table td.el-table__cell, .el-table th.el-table__cell.is-leaf{
46
- border-bottom: 1px solid #d9d9d9;
76
+ .el-table td.el-table__cell{
77
+ border-bottom: 1px solid #ebebeb;
47
78
  }
48
79
  .el-table--border .el-table__cell, .el-table__body-wrapper .el-table--border.is-scrolling-left~.el-table__fixed{
49
80
  border-right: 1px solid #d9d9d9;
50
81
  }
82
+ .el-table--border th.el-table__cell{
83
+ border-bottom: 1px solid #d9d9d9;
84
+ }
85
+
86
+ .el-table th.el-table__cell.is-leaf{
87
+ border-bottom: 1px solid #d9d9d9;
88
+ }
89
+
51
90
 
52
91
  .el-table--border, .el-table--group{
53
92
  // border: none;
54
- border: 1px solid #d9d9d9;
93
+ border: 1px solid #ebebeb;
94
+ border-radius: 8px 8px 0 0;
95
+
55
96
  }
56
97
  .el-table--border {
57
98
  border-right: none;