Commit 7a87dd1e authored by 刘殿昕's avatar 刘殿昕

订单详情,服务cell

parent 429d9da0
<template> <template>
<div class="com_cell"> <div class="com_cell">
<div class="com_cell_img_box"> <div class="com_cell_img_box">
<img <img :src="cellData.cover" class="com_cell_img" />
:src="cellData.cover"
class="com_cell_img"
/>
</div> </div>
<div class="com_cell_message"> <div class="com_cell_message">
<div class="com_cell_msg_title"> <div class="com_cell_msg_title">
{{ cellData.name }} {{ cellData.name }}
<span v-if="cellData.data_service_type1 == 6" class="tags map_service">mapService</span> <span
v-if="cellData.data_service_type1 == 6"
class="tags map_service"
>mapService</span>
<span v-if="cellData.openness == 1" class="tags shared">共享</span> <span v-if="cellData.openness == 1" class="tags shared">共享</span>
<span v-else-if="cellData.openness == 2" class="tags restricted">受限</span> <span v-else-if="cellData.openness == 2" class="tags restricted">受限</span>
<span v-else class="tags sensitive">敏感</span> <span v-else class="tags sensitive">敏感</span>
</div> </div>
<div class="com_cell_item"> <div class="message_block">
<span class="com_cell_item_title">资源摘要:</span> <div class="com_cell_item">
<span class="com_cell_data">{{ cellData.descript }}</span> <div class="com_cell_data_detail">
</div> <span class="detail_span">{{ cellData.descript }}</span>
<div class="com_cell_item"> </div>
<span class="com_cell_item_title">提供机构:</span> </div>
<span class="com_cell_data">{{ cellData.organization_name }}</span> <div class="com_cell_item">
</div> <span class="com_cell_item_title">服务类型:</span>
<div class="com_cell_item"> <span
<span class="com_cell_item_title">数据领域:</span> class="com_cell_data"
<span class="com_cell_data">{{ cellData.sectors_name }}</span> >{{ cellData.data_service_type1_name }}&nbsp;&nbsp;{{ cellData.data_service_type2_name }}&nbsp;&nbsp;{{ cellData.data_service_type3_name }}</span>
</div> <span class="com_cell_item_title left_blank">数据领域:</span>
<div class="com_cell_item"> <span class="com_cell_data">{{ cellData.sectors_name }}</span>
<span class="com_cell_item_title">服务类型:</span> </div>
<span <div class="com_cell_item">
class="com_cell_data" <span class="com_cell_item_title">更新时间:</span>
>{{ cellData.data_service_type1_name }}&nbsp;&nbsp;{{ cellData.data_service_type2_name }}&nbsp;&nbsp;{{ cellData.data_service_type3_name }}</span> <span class="com_cell_data">{{ helper.dateStringTransform(cellData.update_date) }}</span>
</div> </div>
<div class="com_cell_item">
<span class="com_cell_item_title">更新时间:</span>
<span class="com_cell_data">{{ helper.dateStringTransform(cellData.update_date) }}</span>
</div> </div>
</div> </div>
<div class="com_cell_right"> <div class="com_cell_right">
...@@ -61,7 +58,7 @@ export default { ...@@ -61,7 +58,7 @@ export default {
components: {}, components: {},
props: { props: {
url: { type: String, default: "" }, url: { type: String, default: "" },
cellData: { type: Object, default: {} } cellData: { type: Object, default: {} },
}, },
data: () => ({ helper: helper }), data: () => ({ helper: helper }),
computed: {}, computed: {},
...@@ -71,9 +68,9 @@ export default { ...@@ -71,9 +68,9 @@ export default {
if (this.url != "") { if (this.url != "") {
this.$router.push(this.url + "/" + parame); this.$router.push(this.url + "/" + parame);
} }
} },
}, },
mounted() {} mounted() {},
}; };
</script> </script>
...@@ -85,8 +82,8 @@ export default { ...@@ -85,8 +82,8 @@ export default {
border-bottom: 2px #f4f7fc solid; border-bottom: 2px #f4f7fc solid;
} }
.com_cell_img_box { .com_cell_img_box {
width: 166px; width: 200px;
height: 166px; height: 200px;
border-radius: 12px; border-radius: 12px;
overflow: hidden; overflow: hidden;
border: 4px #f4f7fc solid; border: 4px #f4f7fc solid;
...@@ -97,34 +94,44 @@ export default { ...@@ -97,34 +94,44 @@ export default {
} }
.com_cell_message { .com_cell_message {
padding-left: 20px; padding-left: 20px;
width: calc(100% - 470px); width: calc(100% - 500px);
} }
.com_cell_msg_title { .com_cell_msg_title {
color: #0d1847; color: #0d1847;
font-size: 18px; font-size: 18px;
line-height: 30px; line-height: 30px;
font-weight: 700; font-weight: 700;
margin-bottom: 6px; margin-bottom: 10px;
} }
.com_cell_item { .com_cell_item {
font-size: 14px; font-size: 14px;
line-height: 26px; line-height: 28px;
margin-top: 1px; margin-top: 1px;
color: #8890a7; color: #8890a7;
display: flex; display: flex;
align-self: start; align-self: start;
} }
.com_cell_item_title { .com_cell_item_title {
width: 80px; /* width: 80px; */
} }
.com_cell_data { .com_cell_data {
display: inline-block; display: inline-block;
width: calc(100% - 90px);
color: #242c43; color: #242c43;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
} }
.com_cell_data_detail {
color: #242c43;
height: 78px;
font-size: 16px;
}
.detail_span {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
}
.com_cell_right { .com_cell_right {
width: 300px; width: 300px;
padding: 25px 0 0 50px; padding: 25px 0 0 50px;
...@@ -150,13 +157,13 @@ export default { ...@@ -150,13 +157,13 @@ export default {
.tags { .tags {
display: inline-block; display: inline-block;
margin-left: 10px; margin-left: 10px;
padding: 1px 8px 2px; padding: 2px 10px 3px;
font-size: 12px; font-size: 12px;
font-weight: 500; font-weight: 500;
line-height: 12px; line-height: 12px;
border-radius: 4px; border-radius: 4px;
position: relative; position: relative;
top: -2px; top: -1px;
} }
.map_service { .map_service {
background-color: #626de9; background-color: #626de9;
...@@ -178,6 +185,15 @@ export default { ...@@ -178,6 +185,15 @@ export default {
border: solid 1px #d7a4a9; border: solid 1px #d7a4a9;
color: #e15260; color: #e15260;
} }
.message_block {
width: 80%;
padding: 10px 20px;
background-color: #f8f9fd;
border-radius: 10px;
}
.left_blank {
margin-left: 20px;
}
</style> </style>
<style> <style>
.com_cell_right .el-rate__text { .com_cell_right .el-rate__text {
......
...@@ -172,13 +172,13 @@ ...@@ -172,13 +172,13 @@
<div v-else-if="orderDetail.order_type == 2"> <div v-else-if="orderDetail.order_type == 2">
<div> <div>
<span class="detail_service_specification_gg">规格:</span> <span class="detail_service_specification_gg">规格:</span>
<span class="detail_service_specification_val">申请获取应用镜像部署权限</span> <span class="detail_service_specification_val">{{ orderDetail.spec_app == 0 ? "申请获取应用镜像部署权限" : "申请获取应用镜像开发权限" }}</span>
</div> </div>
</div> </div>
<div v-else-if="orderDetail.order_type == 3"> <div v-else-if="orderDetail.order_type == 3">
<div> <div>
<span class="detail_service_specification_gg">类型:</span> <span class="detail_service_specification_gg">类型:</span>
<span class="detail_service_specification_val">申请新的工作区域</span> <span class="detail_service_specification_val">{{ orderDetail.apply_type == 0 ? "申请新的工作区域" : "升级现有工作区域" }}</span>
</div> </div>
</div> </div>
</el-col> </el-col>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment