From 9a5ad4f42f936fa5b36cd039a670d36e6f70a568 Mon Sep 17 00:00:00 2001 From: ZhangXianQiang <1135831638@qq.com> Date: 星期五, 15 三月 2024 11:48:04 +0800 Subject: [PATCH] feat:交通事故指数接口对接 --- src/components/item-wrap/item-wrap.vue | 92 ++++++++++++++++++++++++++++++++++++++++++--- 1 files changed, 85 insertions(+), 7 deletions(-) diff --git a/src/components/item-wrap/item-wrap.vue b/src/components/item-wrap/item-wrap.vue index d8c1dd3..e587200 100644 --- a/src/components/item-wrap/item-wrap.vue +++ b/src/components/item-wrap/item-wrap.vue @@ -1,15 +1,93 @@ -<script setup lang='ts'> +<script setup lang="ts"> +import BorderBox13 from "@/components/datav/border-box-13"; +const props = withDefaults( + defineProps<{ + // 鏍囬 + title: number | string, + }>(), + { + title: "", + } +); </script> <template> - <div class='item-wrap'> - </div> + <div class="item_title" v-if="title !== ''"> + <span class="title-inner">{{ title }} </span> + </div> + <div + :class="title !== '' ? 'item_title_content' : 'item_title_content_def'" + > + + <!-- 鍐呭鎻掓Ы --> + <slot></slot></div> + </template> -<style scoped lang='scss'> -.item-wrap{ - border: red dashed 1px; +<style scoped lang="scss"> +$item-title-height: 38px; +//$item_title_content-height: calc(100% - 38px); + +.item_title { + background-image: url("@/assets/img/candantop.png") ; + background-size: 231px 100%; + background-repeat: no-repeat; + height: $item-title-height; + line-height: $item-title-height; + width: 100%; + color: #31abe3; + text-align: center; + // background: linear-gradient(to right, transparent, #0f0756, transparent); + position: relative; + display: flex; + align-items: center; + //justify-content: center; + + .zuo, + .you { + width: 58px; + height: 14px; + background-image: url("@/assets/img/titles/zuo.png"); + } + + .you { + transform: rotate(180deg); + } + .title-inner { + margin-left: 25px; + margin-top: 4px; + color: #fff; + font-weight: 400; + letter-spacing: 2px; + font-size: 20px; + font-style: italic; + font-family: '200-SSBoYaTi'; + //background: linear-gradient( + // 92deg, + // #0072ff 0%, + // #00eaff 48.8525390625%, + // #01aaff 100% + //); + //-webkit-background-clip: text; + //-webkit-text-fill-color: transparent; + } } -</style> \ No newline at end of file + +:deep(.dv-border-box-content) { + box-sizing: border-box; + padding: 6px 16px 0px; + } + +.item_title_content { + //height: $item_title_content-height; + margin: 20px 0; + +} + +.item_title_content_def { + width: 100%; + height: 100%; +} +</style> -- Gitblit v1.8.0