¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <div class="page-container"> |
| | | <a-row> |
| | | <h1>车é´å¸å±çæ¿</h1> |
| | | <a-list :grid="{gutter: 16, column:4}"> |
| | | <a-list-item v-for="item in workshopList" :key="item.id"> |
| | | <div class="workshop-name" @click="navigateToWorkshopSignage(item.id)">{{item.workshopName}}</div> |
| | | </a-list-item> |
| | | </a-list> |
| | | </a-row> |
| | | |
| | | |
| | | <a-row> |
| | | <h1>åçº§çæ¿</h1> |
| | | <a-list :grid="{gutter: 16, column:4}"> |
| | | <a-list-item> |
| | | <div class="workshop-name" @click="navigateToWorkshopSignageByUrl('/GradeWorkshopSignage')">åçº§çæ¿</div> |
| | | </a-list-item> |
| | | <a-list-item> |
| | | <div class="workshop-name" @click="navigateToWorkshopSignageByUrl('/RepairWorkshopSignage')">ç»´ä¿®çæ¿</div> |
| | | </a-list-item> |
| | | </a-list> |
| | | </a-row> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import api from '@/api/mdc' |
| | | |
| | | export default { |
| | | name: 'WorkshopSignageEntrance', |
| | | data() { |
| | | return { |
| | | indexStyle: 1, |
| | | workshopList: [] |
| | | } |
| | | }, |
| | | created() { |
| | | this.getWorkshopListByApi() |
| | | }, |
| | | methods: { |
| | | /** |
| | | * éè¿è½¦é´Id跳转è³ç¸åºè½¦é´å¤§å±çæ¿ |
| | | * @param id 车é´Id |
| | | */ |
| | | navigateToWorkshopSignage(id) { |
| | | const url = this.$router.resolve(`/MdcWorkshopSignage/${id}`).href |
| | | window.open(url, '_blank') |
| | | }, |
| | | |
| | | /** |
| | | * éè¿è½¦é´Urlå°å跳转è³å¯¹åºå¤§å±çæ¿ |
| | | * @param httpUrl 车é´Urlå°å |
| | | */ |
| | | navigateToWorkshopSignageByUrl(httpUrl) { |
| | | const url = this.$router.resolve(httpUrl).href |
| | | window.open(url, '_blank') |
| | | }, |
| | | |
| | | /** |
| | | * è·å车é´å表 |
| | | */ |
| | | getWorkshopListByApi() { |
| | | api.getWorkshopListInHomePageApi().then(res => { |
| | | console.log('res', res) |
| | | if (res.result && res.result.length > 0) { |
| | | this.workshopList = res.result |
| | | } |
| | | }) |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style lang="less" scoped> |
| | | .page-container { |
| | | padding: 30px 30px 0; |
| | | |
| | | .workshop-name { |
| | | /*width: 100%;*/ |
| | | background: #fff; |
| | | padding: 55px 0; |
| | | border-radius: 20px; |
| | | text-align: center; |
| | | white-space: nowrap; |
| | | overflow: hidden; |
| | | text-overflow: ellipsis; |
| | | font-size: 30px; |
| | | cursor: pointer; |
| | | margin: 0 8px; |
| | | } |
| | | } |
| | | |
| | | </style> |