qingyiay
2023-09-07 491249bdf736a5f7d50417c889ad2db734b12383
components/combined-title/combined-title.vue
@@ -3,17 +3,17 @@
      <view class="title_wrapper">
         <!-- 开始 -->
         <view class="title_start">
            <view class="icon">
            </view>
            <view class="text">
               {{title}}
            </view>
            <view class="icon"></view>
            <view class="text">{{ title }}</view>
         </view>
         <!-- 结尾 -->
         <view class="title_end" v-if="$slots.rightText">
            <view class="title_end_text" @click="rightTextClick">
               <image src="../../static/image/无人值守/联合 1.png" mode=""></image>
         <view class="title_end"
            v-if="$slots.rightText">
            <view class="title_end_text"
               @click="rightTextClick">
               <image :src="`${onlineurl}/appimg/image/banner/add.png`"
                  mode=""></image>
               <text>
                  <slot name="rightText"></slot>
               </text>
@@ -24,65 +24,74 @@
</template>
<script>
   import { onlineurl } from '@/api/request.js'
   export default {
      name:"combined-title",
      name: 'combined-title',
      data() {
         return {
            onlineurl,
         };
      },
      props:{
         title:{
            type:String,
            default:''
      props: {
         title: {
            type: String,
            default: ''
         }
      },
      methods:{
         rightTextClick(){
            this.$emit('rightText')
         }
      methods: {
         rightTextClick() {
            this.$emit('rightText');
         },
      }
   }
   };
</script>
<style lang="scss" scope>
   .title{
      width:100%;
      margin:vww(16) auto ;
      .title_wrapper{
         height:vww(14);
         display:flex;
<style lang="scss"
   scope>
   .title {
      width: 100%;
      margin: vww(16) auto;
      .title_wrapper {
         height: vww(14);
         display: flex;
         justify-content: space-between;
         align-items: center;
         box-sizing: border-box;
          .title_start{
             .icon{
                display:inline-block;
                width:vww(4);
                height:vww(12);
                background-color: #007AFF;
                border-radius: vww(2);
             }
             .text{
                 display:inline-block;
                  margin-left:vww(8);
         .title_start {
            .icon {
               display: inline-block;
               width: vww(4);
               height: vww(12);
               background-color: #007aff;
               border-radius: vww(2);
            }
            .text {
               display: inline-block;
               margin-left: vww(8);
               font-size: vww(16);
            }
         }
         .title_end {
            .title_end_text {
               display: flex;
               align-items: center;
               image {
                  margin-right: vww(8);
                  width: vww(21);
                  height: vww(21);
               }
               text {
                  font-size: vww(16);
             }
          }
          .title_end{
             .title_end_text{
                display: flex;
                align-items: center;
                image{
                   margin-right:vww(8);
                   width:vww(21);
                   height:vww(21);
                }
                text{
                   font-size: vww(16);
                }
             }
          }
               }
            }
         }
      }
   }
</style>
</style>