huangxw 1 month ago
parent
commit
4fe27e493d

+ 4 - 4
src/components/ut-tabs/ut-tabs.vue

@@ -1,7 +1,7 @@
 <template>
     <template v-if="mode == 'scroll-x'">
         <scroll-view scroll-x class="ut-tabs-scroll" show-scrollbar="false" :scroll-into-view-offset="SCROLL_OFFSET" :scroll-into-view="scrollIntoView" ref="scrollViewRef" scroll-with-animation>
-            <view class="ut-tabs-row gap-30">
+            <view class="ut-tabs-row gap-20">
                 <view v-for="(tab, idx) in tabs" :key="tab.value" :id="'tab-' + idx" class="ut-tab-item p-rtv" :class="{ active: idx === activeIndex }" @click="selectTab(idx)" ref="tabRefs">
                     <view
                         class="tab-label"
@@ -28,8 +28,8 @@
     </template>
     <template v-if="mode == 'scroll-x-card'">
         <scroll-view scroll-x class="ut-tabs-scroll" show-scrollbar="false" :scroll-into-view-offset="SCROLL_OFFSET" :scroll-into-view="scrollIntoView" ref="scrollViewCardRef" scroll-with-animation>
-            <view class="ut-tabs-row gap-30">
-                <view v-for="(tab, idx) in tabs" :key="tab.value" :id="'tab-' + idx" class="ut-tab-item-card gap-30 p-rtv" :class="{ active: idx === activeIndex }" @click="selectTab(idx)" ref="tabCardRefs">
+            <view class="ut-tabs-row gap-20">
+                <view v-for="(tab, idx) in tabs" :key="tab.value" :id="'tab-' + idx" class="ut-tab-item-card gap-20 p-rtv" :class="{ active: idx === activeIndex }" @click="selectTab(idx)" ref="tabCardRefs">
                     <view
                         class="tab-label-card d-flex j-c a-c pd2-0-24 min-w-150"
                         :style="{
@@ -45,7 +45,7 @@
         </scroll-view>
     </template>
     <template v-if="mode == 'btw'">
-        <view class="ut-tabs-row gap-30" :style="{ justifyContent: 'space-between' }">
+        <view class="ut-tabs-row gap-20" :style="{ justifyContent: 'space-between' }">
             <view v-for="(tab, idx) in tabs" :key="tab.value" class="ut-tab-item p-rtv" :class="{ active: idx === activeIndex }" @click="selectTab(idx)" ref="tabRefs">
                 <view
                     class="tab-label"

+ 74 - 0
src/components/ut-tag-dict/ut-tag-dict.vue

@@ -0,0 +1,74 @@
+<template>
+    <view class="ut-tag-dict-wrap">
+        <template v-for="(item, index) in list" :key="item.value">
+            <view class="dict-item-tab" :style="itemStyle(item?.elTagClass as string)">{{ item?.label }}</view>
+        </template>
+    </view>
+</template>
+<script setup lang="ts">
+const props = defineProps({
+    value: {
+        type: [String, Array],
+        default: '',
+    },
+    options: {
+        type: Array as () => Array<DictDataOption>,
+        default: () => [],
+    },
+});
+const list = computed(() => {
+    const val = props.value;
+    let arr: Array<DictDataOption> = [];
+    if (Array.isArray(val)) {
+        val.forEach((v) => {
+            const item = props.options.find((item) => item.value === v);
+            if (item) {
+                arr.push(item);
+            }
+        });
+        return arr;
+    } else {
+        // 值是string也可能是多个‘,’分隔
+        const vals = String(val).split(',');
+        vals.forEach((v) => {
+            const item = props.options.find((item) => item.value === v);
+            if (item) {
+                arr.push(item);
+            }
+        });
+        return arr;
+    }
+});
+const itemStyle = (elTagClass: string) => {
+    if (elTagClass) {
+        const num = Number(elTagClass);
+        if (!isNaN(num)) {
+            return {};
+        } else {
+            try {
+                const obj = JSON.parse(elTagClass);
+                return obj;
+            } catch (e) {
+                // do nothing
+            }
+        }
+    }
+    return {};
+};
+</script>
+<style lang="scss" scoped>
+.ut-tag-dict-wrap {
+    display: inline-flex;
+    flex-wrap: wrap;
+    gap: 24rpx;
+
+    .dict-item-tab {
+        padding: 6rpx 16rpx;
+        font-size: 20rpx;
+        color: #333;
+        background-color: #f7f7f7;
+        border-radius: 18rpx;
+        font-weight: 500;
+    }
+}
+</style>

+ 1 - 1
src/plant/contact-unit/unit-list/index.vue

@@ -36,7 +36,7 @@
                                 <span class="c-#666">联系电话:</span>
                                 <span class="c-#333 f-w-600">{{ item?.contactTel }}</span>
                             </view>
-
+                            <ut-tag-dict :options="pt_cpy_type" :value="item?.cpyType"></ut-tag-dict>
                         </view>
                     </up-swipe-action-item>
                 </up-swipe-action>