hookehuyr

fix 详情页显示调整

1 <!-- 1 <!--
2 * @Date: 2024-09-29 14:26:41 2 * @Date: 2024-09-29 14:26:41
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2024-10-23 18:45:31 4 + * @LastEditTime: 2024-10-24 12:27:34
5 * @FilePath: /hager/src/views/product/detail.vue 5 * @FilePath: /hager/src/views/product/detail.vue
6 * @Description: 文件描述 6 * @Description: 文件描述
7 --> 7 -->
...@@ -87,8 +87,15 @@ ...@@ -87,8 +87,15 @@
87 <i v-else @click="checkItem(item)" class="el-icon-folder download-unchecked"></i>&nbsp; 87 <i v-else @click="checkItem(item)" class="el-icon-folder download-unchecked"></i>&nbsp;
88 </el-col> 88 </el-col>
89 <el-col :span="is_xs ? 20 : 22"> 89 <el-col :span="is_xs ? 20 : 22">
90 - <i class="el-icon-document" style="font-size: 1.5rem;"></i> 90 + <div style="display: flex; justify-content: space-between; align-items: center;">
91 - {{ item.name }}{{ item.size }} 91 + <div>
92 + <i class="el-icon-document" style="font-size: 1.35rem;"></i>
93 + {{ item.name }}
94 + </div>
95 + <div>
96 + &nbsp;{{ item.size }}
97 + </div>
98 + </div>
92 </el-col> 99 </el-col>
93 </el-row> 100 </el-row>
94 <!-- <i v-if="item.checked" @click="checkItem(item)" class="el-icon-folder-checked download-checked"></i> 101 <!-- <i v-if="item.checked" @click="checkItem(item)" class="el-icon-folder-checked download-checked"></i>
...@@ -166,7 +173,7 @@ export default { ...@@ -166,7 +173,7 @@ export default {
166 this.info_images = this.info.file.img.map(item => item.value); 173 this.info_images = this.info.file.img.map(item => item.value);
167 } 174 }
168 // 175 //
169 - this.product_advantages = this.splitArrayIntoChunks(this.info.product_advantages); 176 + this.product_advantages = this.splitIntoEqualChunks(this.info.product_advantages);
170 // 177 //
171 this.product_sample = this.info.file?.yangben?.map(item => ({ ...item, checked: false }));// 产品样本 178 this.product_sample = this.info.file?.yangben?.map(item => ({ ...item, checked: false }));// 产品样本
172 this.technical_parameter = this.info.file?.canshu?.map(item => ({ ...item, checked: false })); // 技术参数 179 this.technical_parameter = this.info.file?.canshu?.map(item => ({ ...item, checked: false })); // 技术参数
...@@ -224,6 +231,18 @@ export default { ...@@ -224,6 +231,18 @@ export default {
224 231
225 return result; 232 return result;
226 }, 233 },
234 + splitIntoEqualChunks(list) {
235 + const middle = Math.ceil(list.length / 2); // 计算数组的一半,向上取整
236 + const result = [];
237 +
238 + // 第一个子数组是从 0 到 middle 的部分
239 + result[0] = list.slice(0, middle);
240 +
241 + // 第二个子数组是从 middle 到末尾的部分
242 + result[1] = list.slice(middle);
243 +
244 + return result;
245 + },
227 checkItem (item) { 246 checkItem (item) {
228 item.checked = !item.checked; 247 item.checked = !item.checked;
229 // this.$forceUpdate(); 248 // this.$forceUpdate();
......