| | |
| | | <template> |
| | | <div class="title-container"> |
| | | <span class="title">{{ title }}</span> |
| | | |
| | | <div class="more-button" v-if="path" @click="toPath"> |
| | | <div class="icon"> |
| | | <!-- <img src="@/assets/icons/setting.png" alt=""> --> |
| | | </div> |
| | | <div class="button-text"> |
| | | |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </template> |
| | | |
| | |
| | | title: { |
| | | type: String, |
| | | required: true |
| | | }, |
| | | path: { |
| | | type: String, |
| | | default: '' |
| | | } |
| | | }, |
| | | methods: { |
| | | toPath() { |
| | | this.$router.push(this.path); |
| | | } |
| | | } |
| | | } |
| | |
| | | width: 100%; |
| | | position: relative; |
| | | display: flex; |
| | | justify-content: space-between; |
| | | align-items: center; |
| | | margin-bottom: 10px; |
| | | |
| | |
| | | font-size: 20px; |
| | | font-style: italic; |
| | | } |
| | | |
| | | .more-button { |
| | | height: 40px; |
| | | cursor: pointer; |
| | | display: flex; |
| | | align-items: center; |
| | | .icon { |
| | | width: 20px; |
| | | margin-top: 4px; |
| | | margin-right: 2px; |
| | | img { |
| | | width: 100%; |
| | | display: block; |
| | | } |
| | | } |
| | | |
| | | .button-text { |
| | | width: 100%; |
| | | height: 100%; |
| | | display: flex; |
| | | justify-content: center; |
| | | align-items: center; |
| | | color: #ffffff81; |
| | | font-size: 16px; |
| | | } |
| | | } |
| | | } |
| | | </style> |