| | |
| | | <div class="right"> |
| | | <div class="name">{{ data.productName }}</div> |
| | | <div class="tagList"> |
| | | <span class="tag" v-for="(name, index) in labels" :key="index">{{ |
| | | name |
| | | }}</span> |
| | | <span |
| | | class="tag" |
| | | v-for="(name, index) in labels" |
| | | :key="index" |
| | | :class="{ |
| | | red: name === '软件', |
| | | orange: name === '应用', |
| | | lightBlue: name === 'SDK', |
| | | blue: name === '产品密钥', |
| | | }" |
| | | >{{ name }}</span |
| | | > |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | name: this.data.productName, |
| | | }, |
| | | }); |
| | | }, |
| | | getColor(name) { |
| | | switch (name) { |
| | | case "算法": |
| | | return "red"; |
| | | case "应用": |
| | | return "orange"; |
| | | case "云服务": |
| | | return "lightBlue"; |
| | | case "边缘计算设备": |
| | | return "blue"; |
| | | } |
| | | }, |
| | | }, |
| | | }; |
| | |
| | | padding: 2px 5px; |
| | | border: 1px solid #ff5033; |
| | | color: #ff5033; |
| | | |
| | | &.red { |
| | | color: #ff4f32; |
| | | border-color: #ff4f32; |
| | | } |
| | | |
| | | &.orange { |
| | | color: #ff9500; |
| | | border-color: #ff9500; |
| | | } |
| | | |
| | | &.lightBlue { |
| | | color: #00bee7; |
| | | border-color: #00bee7; |
| | | } |
| | | |
| | | &.blue { |
| | | color: #0064ff; |
| | | border-color: #0064ff; |
| | | } |
| | | } |
| | | } |
| | | } |