feat: 修改图片显示问题
BIN
components/CommonPane/img/临时用电.png
Normal file
|
After Width: | Height: | Size: 208 B |
BIN
components/CommonPane/img/动土作业.png
Normal file
|
After Width: | Height: | Size: 8.4 KiB |
BIN
components/CommonPane/img/动火作业.png
Normal file
|
After Width: | Height: | Size: 1.3 KiB |
BIN
components/CommonPane/img/吊装作业.png
Normal file
|
After Width: | Height: | Size: 1.3 KiB |
BIN
components/CommonPane/img/有限空间.png
Normal file
|
After Width: | Height: | Size: 1.3 KiB |
BIN
components/CommonPane/img/高处作业.png
Normal file
|
After Width: | Height: | Size: 249 B |
@@ -12,13 +12,15 @@
|
||||
<!-- 遍历渲染业务图标 -->
|
||||
<view class="item u-flex-col" v-for="(item,index) in cardData" :key="index" @click="clickItem(item)">
|
||||
<view class="item-icon" :style="{ background: item.iconBackground || '#008cff' }">
|
||||
|
||||
<image class="item-img" :src="`/static/image/${item.name}.png`"></image>
|
||||
<!-- 使用 iconify-icon 渲染 ep 系列图标 -->
|
||||
<iconify-icon
|
||||
<!-- <iconify-icon
|
||||
:icon="item.icon"
|
||||
color="#ffffff"
|
||||
width="24"
|
||||
height="24"
|
||||
></iconify-icon>
|
||||
></iconify-icon> -->
|
||||
</view>
|
||||
<view class="item-title u-m-t-8">{{item.name}}</view>
|
||||
</view>
|
||||
@@ -184,6 +186,10 @@
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
.item-img {
|
||||
width: 60%;
|
||||
height: 60%;
|
||||
}
|
||||
|
||||
.more {
|
||||
background: #ececec;
|
||||
|
||||
13
index.html
@@ -13,19 +13,6 @@
|
||||
'<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' +
|
||||
(coverSupport ? ', viewport-fit=cover' : '') + '" />')
|
||||
</script>
|
||||
<!-- 引入 Iconify 核心库(新增) -->
|
||||
<script src="https://cdn.jsdelivr.net/npm/iconify-icon@1.0.8/dist/iconify-icon.min.js"></script>
|
||||
<!-- 引入 Element Plus 图标集(ep 系列,新增) -->
|
||||
<script src="https://cdn.jsdelivr.net/npm/@iconify/icons-ep@1.2.4/es/ep.min.js"></script>
|
||||
<!-- 全局注册 iconify-icon 组件(新增) -->
|
||||
<script>
|
||||
// 确保 DOM 加载完成后注册组件,避免兼容性问题
|
||||
window.onload = function() {
|
||||
if (window.customElements && !window.customElements.get('iconify-icon')) {
|
||||
customElements.define('iconify-icon', IconifyIcon);
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<!-- <title>
|
||||
<%= htmlWebpackPlugin.options.title %>
|
||||
</title> -->
|
||||
|
||||
@@ -16,13 +16,14 @@
|
||||
@click="handelClick(item)">
|
||||
<!-- 渲染图标 -->
|
||||
<view class="item-icon" :style="{ background: item.iconBackground || '#008cff' }">
|
||||
<image class="item-img" :src="`/static/image/${item.name}.png`"></image>
|
||||
<!-- 使用 iconify-icon 渲染 ep 系列图标 -->
|
||||
<iconify-icon
|
||||
<!-- <iconify-icon
|
||||
:icon="item.icon"
|
||||
color="#ffffff"
|
||||
width="24"
|
||||
height="24"
|
||||
></iconify-icon>
|
||||
></iconify-icon> -->
|
||||
</view>
|
||||
<!-- 渲染名称 -->
|
||||
<text class="u-font-24 u-line-1 item-text">{{item.name}}</text>
|
||||
@@ -272,7 +273,6 @@
|
||||
}
|
||||
|
||||
.menu-v {
|
||||
// 原有样式...
|
||||
|
||||
.workFlow-list {
|
||||
background-color: #fff;
|
||||
@@ -311,6 +311,11 @@
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.item-img {
|
||||
width: 60%;
|
||||
height: 60%;
|
||||
}
|
||||
|
||||
// 文字样式
|
||||
.item-text {
|
||||
font-size: 24rpx;
|
||||
|
||||
BIN
static/image/临时用电.png
Normal file
|
After Width: | Height: | Size: 208 B |
BIN
static/image/动土作业.png
Normal file
|
After Width: | Height: | Size: 8.4 KiB |
BIN
static/image/动火作业.png
Normal file
|
After Width: | Height: | Size: 1.3 KiB |
BIN
static/image/吊装作业.png
Normal file
|
After Width: | Height: | Size: 1.3 KiB |
BIN
static/image/有限空间.png
Normal file
|
After Width: | Height: | Size: 1.3 KiB |
BIN
static/image/高处作业.png
Normal file
|
After Width: | Height: | Size: 249 B |