jmash-diy-mp 0.1.3 → 0.1.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "jmash-diy-mp",
-  "version": "0.1.3",
+  "version": "0.1.4",
   "private": false,
   "main": "lib/index.js",
   "types": "lib/index.d.ts",

package/src/components/basic/basic-title-view.mpx

@@ -1,19 +1,16 @@
 <template>
     <view class="basic-title-main">
-        <!-- 标题 -->
+        <!-- 标题（style=0：原有左侧竖线，style=1：左侧自定义图标） -->
         <view class="main-left">
             <!-- 标题前面竖线 -->
-            <image wx:if="{{ !leftIcon }}" class="main-left-image"
-                src="{{ resourceUrl + 'rectangle2x_' + themeColor + '.png' }}" mode="aspectFit" />
-            <slot wx:else name="leftIcon"></slot>
+            <image wx:if="{{ titleStyle === '0' }}" class="main-left-image"
+                src="{{ resourceUrl + 'images/icon_image/rectangle2x_' + themeColor + '.png' }}" mode="aspectFit" />
+            <image wx:if="{{ titleStyle === '1' }}" class="title-left-icon" src="{{ resourceUrl + titleImage }}"
+                mode="aspectFit" />
             {{ title }}
         </view>
         <!-- 查看更多 -->
-        <view class="main-right" wx:if="{{ showMore }}" bind:tap="handleClickMore">
-            <view>查看更多</view>
-            <view wx:if="{{ !rightIcon }}">></view>
-            <slot wx:else name="rightIcon"></slot>
-        </view>
+        <view class="main-right" wx:if="{{ showMore }}" bind:tap="handleClickMore">查看更多 ></view>
     </view>
 </template>
 
@@ -53,28 +50,30 @@ createComponent({
             type: Boolean,
             value: false
         },
-        // 是否自定义左侧图标
-        leftIcon: {
-            type: Boolean,
-            default: false
-        },
-        // 是否自定义右侧图标
-        rightIcon: {
-            type: Boolean,
-            default: false
-        },
     },
     setup(props) {
         // 资源路径
-        let resourceUrl = config.resourceUrl + "/images/icon_image/";
+        let resourceUrl = config.resourceUrl + '/';
         // 主题色
         let themeColor = ref(props.pageModel.pageData.theme);
+        // 样式（0：原有左侧竖线，1：自定义图标两侧）
+        let titleStyle = ref(props.compModel?.compData?.titleStyle ?? "0");
+        // 标题图标
+        let titleImage = ref(props.compModel?.compData?.titleImage ?? "");
 
         // 主题变化
         const { pageModel } = toRefs(props)
         watch(pageModel, (newVal) => {
             themeColor.value = newVal.pageData.theme;
-        })
+        });
+        // 监听 titleStyle 变化
+        watch(() => props.compModel?.compData?.titleStyle, (newVal) => {
+            titleStyle.value = newVal ?? "0";
+        });
+        // 监听 titleImage 变化
+        watch(() => props.compModel?.compData?.titleImage, (newVal) => {
+            titleImage.value = newVal ?? "";
+        });
 
         return {
             resourceUrl,
@@ -121,9 +120,6 @@ createComponent({
     }
 
     .main-right {
-        display: flex;
-        align-items: center;
-        gap: 10rpx;
         height: 80rpx;
         color: #999999;
         font-size: 24rpx;
@@ -131,6 +127,11 @@ createComponent({
         line-height: 80rpx;
     }
 }
+
+.title-left-icon {
+    width: 36rpx;
+    height: 41rpx;
+}
 </style>
 
 <script type="application/json">