meixioacomponent 0.3.35 → 0.3.36

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 (5) hide show
  1. package/lib/meixioacomponent.common.js +60 -55
  2. package/lib/meixioacomponent.umd.js +60 -55
  3. package/lib/meixioacomponent.umd.min.js +6 -6
  4. package/package.json +1 -1
  5. package/packages/components/base/baseImg/baseImg.vue +53 -45
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "meixioacomponent",
3
- "version": "0.3.35",
3
+ "version": "0.3.36",
4
4
  "private": false,
5
5
  "author": "YuRi",
6
6
  "main": "lib/meixioacomponent.umd.min.js",
package/packages/components/base/baseImg/baseImg.vue CHANGED
@@ -1,5 +1,5 @@
1
1
  <template>
2
- <div class="base-img-wrap">
2
+ <div class="base-img-wrap" :class="[shape]">
3
3
  <img
4
4
  alt=""
5
5
  :src="src"
@@ -13,7 +13,7 @@
13
13
  <baseSkeletonVue
14
14
  v-if="loading"
15
15
  :lines="[1]"
16
- :shape="`rect`"
16
+ :shape="shape"
17
17
  ></baseSkeletonVue>
18
18
  <div class="img-error-wrap" v-if="isError">
19
19
  <base-icon
@@ -26,18 +26,18 @@
26
26
  </template>
27
27
 
28
28
  <script>
29
- import useImg from "../../../config/use/UseImg";
30
- import baseSkeletonVue from "../baseSkeleton/baseSkeleton.vue";
29
+ import useImg from '../../../config/use/UseImg'
30
+ import baseSkeletonVue from '../baseSkeleton/baseSkeleton.vue'
31
31
  export default {
32
- name: "baseImg",
32
+ name: 'baseImg',
33
33
  data() {
34
34
  return {
35
35
  isError: false,
36
36
  loading: true,
37
- };
37
+ }
38
38
  },
39
39
  created() {
40
- this.init();
40
+ this.init()
41
41
  },
42
42
  components: {
43
43
  baseSkeletonVue,
@@ -46,98 +46,103 @@ export default {
46
46
  // cover,fill,contain,
47
47
  fit: {
48
48
  type: String,
49
- default: "cover",
49
+ default: 'cover',
50
50
  },
51
51
  src: {
52
52
  type: String,
53
53
  },
54
54
  error: {
55
55
  type: String,
56
- default: "图片加载失败",
56
+ default: '图片加载失败',
57
57
  },
58
58
  event: {
59
59
  type: Boolean,
60
60
  default: false,
61
61
  },
62
+ shape: {
63
+ type: String,
64
+ default: 'rect',
65
+ },
62
66
  },
63
67
  computed: {
64
68
  imgStyle() {
65
69
  return {
66
70
  objectFit: this.$props.fit,
67
- cursor: this.$props.event ? "zoom-in" : "default",
68
- };
71
+ cursor: this.$props.event ? 'zoom-in' : 'default',
72
+ }
69
73
  },
70
74
  imgShow() {
71
75
  if (this.$props.src) {
72
- return true;
76
+ return true
73
77
  }
74
- return false;
78
+ this.loading = false
79
+ return false
75
80
  },
76
81
  },
77
82
  methods: {
78
83
  init() {
79
84
  if (!this.$props.src) {
80
- this.loading = true;
85
+ this.loading = true
81
86
  }
82
87
  },
83
88
  loadEd() {
84
- this.loading = false;
89
+ this.loading = false
85
90
  },
86
91
  errorEd() {
87
92
  //console.log(this.$props.src)
88
93
  //console.log("imgError");
89
- this.loading = false;
90
- this.isError = true;
94
+ this.loading = false
95
+ this.isError = true
91
96
  },
92
97
  viewImg() {
93
- if (!this.$props.event || this.loading || this.isError) return;
94
- let parent = this.$parent;
98
+ if (!this.$props.event || this.loading || this.isError) return
99
+ let parent = this.$parent
95
100
  if (!parent) {
96
- useImg.toView([this.$props.src]);
97
- return;
101
+ useImg.toView([this.$props.src])
102
+ return
98
103
  }
99
- let tags = parent.$options._componentTag;
100
- if (tags == "baseUploadItemVue") {
101
- useImg.toView([this.$props.src]);
104
+ let tags = parent.$options._componentTag
105
+ if (tags == 'baseUploadItemVue') {
106
+ useImg.toView([this.$props.src])
102
107
  } else {
103
- let parentChildrenList = parent.$children;
104
- let name = this.$options.name;
108
+ let parentChildrenList = parent.$children
109
+ let name = this.$options.name
105
110
  let filterList = parentChildrenList.filter((item) => {
106
- return item.$options.name == name;
107
- });
108
- let imgList = [];
109
- let thisIndex = null;
110
- let thisSrc = this.$props.src;
111
+ return item.$options.name == name
112
+ })
113
+ let imgList = []
114
+ let thisIndex = null
115
+ let thisSrc = this.$props.src
111
116
  filterList.forEach((item, index) => {
112
- let itemSrc = item.$props.src;
117
+ let itemSrc = item.$props.src
113
118
  if (itemSrc == thisSrc) {
114
- thisIndex = index;
119
+ thisIndex = index
115
120
  }
116
- imgList.push(itemSrc);
117
- });
118
- this.viewListImg(thisIndex, imgList);
121
+ imgList.push(itemSrc)
122
+ })
123
+ this.viewListImg(thisIndex, imgList)
119
124
  }
120
125
  },
121
126
 
122
127
  viewListImg(index, imgList) {
123
- let templateList = [...imgList];
128
+ let templateList = [...imgList]
124
129
  if (index == 0) {
125
- useImg.toView(templateList);
126
- return;
130
+ useImg.toView(templateList)
131
+ return
127
132
  }
128
- let start = templateList.splice(index);
129
- let remain = templateList.splice(0, index);
130
- useImg.toView(start.concat(remain));
133
+ let start = templateList.splice(index)
134
+ let remain = templateList.splice(0, index)
135
+ useImg.toView(start.concat(remain))
131
136
  },
132
137
  },
133
138
 
134
139
  watch: {
135
140
  src: function (newVal, oldVal) {
136
- this.isError = false;
137
- this.loading = true;
141
+ this.isError = false
142
+ this.loading = true
138
143
  },
139
144
  },
140
- };
145
+ }
141
146
  </script>
142
147
 
143
148
  <style lang="less" scoped>
@@ -157,4 +162,7 @@ export default {
157
162
  justify-content: center;
158
163
  }
159
164
  }
165
+ .cir {
166
+ border-radius: 50%;
167
+ }
160
168
  </style>