@jx3box/jx3box-common-ui 5.4.8 → 5.5.2

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,14 +1,14 @@
1
1
  .c-header-jx3box {
2
2
  background-color: @bg-black;
3
3
  .z(800);
4
- overflow-y:auto;
4
+ overflow-y: auto;
5
5
  .w(100%);
6
- box-shadow: 0 5px 5px rgba(0,0,0,.2);
7
- transition:0.5s ease-in-out;
6
+ box-shadow: 0 5px 5px rgba(0, 0, 0, 0.2);
7
+ transition: 0.5s ease-in-out;
8
8
  .clearfix;
9
9
 
10
10
  .none;
11
- &.on{
11
+ &.on {
12
12
  .db;
13
13
  }
14
14
 
@@ -46,7 +46,7 @@
46
46
  background-color: @bg-light;
47
47
  .pr;
48
48
  overflow: hidden;
49
- .u-pic-hover{
49
+ .u-pic-hover {
50
50
  .none;
51
51
  }
52
52
  }
@@ -61,7 +61,8 @@
61
61
  // }
62
62
  }
63
63
  }
64
- .u-pic,.u-pic-hover {
64
+ .u-pic,
65
+ .u-pic-hover {
65
66
  .size(32px);
66
67
  .db;
67
68
  .auto(x);
@@ -101,21 +102,23 @@
101
102
  }
102
103
 
103
104
  .pr;
104
- .u-close{
105
+ .u-close {
105
106
  // .pa;.rb(0);
106
107
  .fr;
107
- background-color:@color;
108
+ background-color: @color;
108
109
  .fz(13px);
109
- padding:5px 10px;
110
- i{.mr(3px);}
110
+ padding: 5px 10px;
111
+ i {
112
+ .mr(3px);
113
+ }
111
114
  .pointer;
112
115
  }
113
116
  }
114
- .c-header-jx3box.isOverlay{
115
- background-color:rgba(0,0,0,.85);
117
+ .c-header-jx3box.isOverlay {
118
+ background-color: rgba(0, 0, 0, 0.85);
116
119
  }
117
120
  @media screen and (max-width: @ipad) {
118
- .c-jx3box{
121
+ .c-jx3box {
119
122
  .u-app-start {
120
123
  clear: none;
121
124
  }
@@ -123,42 +126,50 @@
123
126
  }
124
127
  }
125
128
 
126
- @media screen and (max-width:@phone){
127
- .c-jx3box{
128
- .u-list{
129
- display: flex;
130
- flex-wrap: wrap;
131
- padding-right:10px;
132
- li{
133
- .w(25%);
134
- .mr(0);
135
- // flex:1;
129
+ @media screen and (max-width: @phone) {
130
+ .c-jx3box {
131
+ .u-list {
132
+ padding-right: 20px;
133
+ // display: flex;
134
+ // flex-wrap: wrap;
135
+ li {
136
+ // flex: 1;
137
+ margin-right: 15px;
138
+ margin-bottom: 15px;
139
+ &:nth-child(4n) {
140
+ .mr(0) !important;
141
+ }
136
142
  }
137
143
  }
138
- .u-item{
139
- .mr(20px);
140
- .u-txt{
144
+ .u-item {
145
+ .size(68px);
146
+ .u-txt {
141
147
  .fz(10px);
142
148
  }
143
- .u-pic{
149
+ .u-pic {
144
150
  .size(28px);
145
151
  }
146
152
  }
147
- li:nth-child(4n) .u-item{
148
- .mr(0) !important;
149
- }
150
153
  }
151
154
  }
152
- @media screen and (max-width:320px){
153
- .c-jx3box{
154
- .u-item{
155
- .size(60px);
156
- .u-txt{
157
- .fz(10px);
155
+ @media screen and (max-width: 320px) {
156
+ .c-jx3box {
157
+ .u-list{
158
+ li{
159
+ .mr(12px);
160
+ .mb(12px);
158
161
  }
159
- .u-pic{
162
+ }
163
+ .u-item {
164
+ .size(60px);
165
+ // .u-txt {
166
+ // .pr;
167
+ // left:-3px;
168
+ // transform: scale(0.8);
169
+ // }
170
+ .u-pic {
160
171
  .size(28px);
161
172
  }
162
173
  }
163
174
  }
164
- }
175
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@jx3box/jx3box-common-ui",
3
- "version": "5.4.8",
3
+ "version": "5.5.2",
4
4
  "description": "JX3BOX UI",
5
5
  "main": "index.js",
6
6
  "scripts": {
@@ -33,7 +33,7 @@
33
33
  "@jx3box/jx3box-comment-ui": "^1.6.6",
34
34
  "@jx3box/jx3box-common": "^6.7.8",
35
35
  "@jx3box/jx3box-data": "^1.8.3",
36
- "@jx3box/jx3box-editor": "^1.1.1",
36
+ "@jx3box/jx3box-editor": "^1.1.2",
37
37
  "axios": "^0.19.2",
38
38
  "element-ui": "^2.13.2",
39
39
  "jquery": "^3.5.1",
package/src/Box.vue CHANGED
@@ -12,11 +12,11 @@
12
12
  <span class="u-txt">首页</span>
13
13
  </a>
14
14
  </li>
15
- <li v-for="(item,i) in data" :key="i" :class="{'u-app-start':item.lf}" v-show="item.status && matchedClient(item.client)">
15
+ <li v-for="(item,i) in list" :key="i" :class="{'u-app-start':item.lf}">
16
16
  <a class="u-item" :href="item.href" :target="item.href | getTarget">
17
- <img class="u-pic" svg-inline :src="item.img | getBoxIcon" />
18
- <img class="u-pic-hover" svg-inline :src="item.hover | getBoxIcon" />
19
- <span class="u-txt">{{item.name}}</span>
17
+ <img class="u-pic" :src="item.img | getBoxIcon" />
18
+ <!-- <img class="u-pic-hover" svg-inline :src="item.hover | getBoxIcon" /> -->
19
+ <span class="u-txt">{{item.abbr}}</span>
20
20
  </a>
21
21
  </li>
22
22
  </ul>
@@ -55,6 +55,11 @@ export default {
55
55
  originicon: function () {
56
56
  return __imgPath + "image/box/origin.svg";
57
57
  },
58
+ list : function (){
59
+ return this.data.filter((item,i) => {
60
+ return item.status && (item.client == this.client || item.client == 'all')
61
+ })
62
+ }
58
63
  },
59
64
  methods: {
60
65
  closeBox: function () {
@@ -95,7 +100,7 @@ export default {
95
100
  return __imgPath + "image/box/" + val;
96
101
  },
97
102
  getTarget: function (val) {
98
- if (window.innerWidth < 768 || val.startsWith("/")) {
103
+ if (window.innerWidth < 768 || val?.startsWith("/")) {
99
104
  return "_self";
100
105
  } else {
101
106
  return "_blank";
@@ -73,6 +73,9 @@ export default {
73
73
  };
74
74
  },
75
75
  computed: {
76
+ post_keys : function (){
77
+ return [this.postType,this.postId]
78
+ },
76
79
  params: function () {
77
80
  return {
78
81
  pageSize: this.per,
@@ -81,6 +84,13 @@ export default {
81
84
  },
82
85
  },
83
86
  watch: {
87
+ post_keys : {
88
+ immediate : true,
89
+ deep : true,
90
+ handler : function (){
91
+ this.postType && !!~~this.postId && this.loadData();
92
+ }
93
+ },
84
94
  params: {
85
95
  deep: true,
86
96
  handler: function () {
@@ -99,9 +109,6 @@ export default {
99
109
  }
100
110
  },
101
111
  methods: {
102
- init: function () {
103
- this.loadData();
104
- },
105
112
  loadData: function () {
106
113
  getPostBoxcoinRecords(this.postType, this.postId, this.params).then(
107
114
  (res) => {
@@ -138,9 +145,5 @@ export default {
138
145
  return showAvatar(val, 24);
139
146
  },
140
147
  },
141
- created: function () {},
142
- mounted: function () {
143
- this.init();
144
- },
145
148
  };
146
149
  </script>
@@ -52,8 +52,20 @@ export default {
52
52
  boxcoin_enable : 0
53
53
  };
54
54
  },
55
- computed: {},
56
- watch: {},
55
+ computed: {
56
+ post_keys : function (){
57
+ return [this.postId,this.postType]
58
+ }
59
+ },
60
+ watch: {
61
+ post_keys : {
62
+ immediate : true,
63
+ deep:true,
64
+ handler : function (){
65
+ this.postType && !!~~this.postId && this.loadBoxcoinConfig()
66
+ }
67
+ }
68
+ },
57
69
  methods: {
58
70
  loadBoxcoinConfig : function (){
59
71
  User.isLogin() && getPostBoxcoinConfig(this.postType).then((res) => {
@@ -80,15 +92,9 @@ export default {
80
92
  },
81
93
  }
82
94
  },
83
- init : function (){
84
- this.loadBoxcoinConfig()
85
- }
86
95
  },
87
96
  filters: {},
88
97
  created: function () {},
89
- mounted: function () {
90
- this.init()
91
- },
92
98
  };
93
99
  </script>
94
100