Skip to content

P
pet-business-web
Commit f23f4e8b authored by 王飞龙's avatar 王飞龙
Browse files
Options

Merge remote-tracking branch 'origin/master'

parents a13cd662 d5a2e595
Show whitespace changes
Inline Side-by-side
Showing with 657 additions and 141 deletions
src/router/index.js
View file @ f23f4e8b
...@@ -225,12 +225,36 @@ export const constantRoutes = [ ...@@ -225,12 +225,36 @@ export const constantRoutes = [
path: '/check-detail', path: '/check-detail',
props: true, props: true,
hidden: true, hidden: true,
component: () => import('@/views/service-management/medical-record-management/check-detail'), component: () => import('@/views/service-management/medical-record-management/check-detail.vue'),
name: 'CheckDetail', name: 'CheckDetail',
meta: { meta: {
title: '检查详情', title: '检查详情',
icon: 'component' icon: 'component'
} }
},
// 检查管理-立即预约
{
path: '/check-subscribe',
props: true,
hidden: true,
component: () => import('@/views/service-management/medical-record-management/check-subscribe.vue'),
name: 'CheckSubscribe',
meta: {
title: '立即预约',
icon: 'component'
}
},
// 检查管理-检查影像
{
path: '/check-item',
props: true,
hidden: true,
component: () => import('@/views/service-management/medical-record-management/check-item.vue'),
name: 'CheckItem',
meta: {
title: '检查项目',
icon: 'component'
}
} }
] ]
}, },
......
src/views/service-management/medical-record-management/check-detail.vue
View file @ f23f4e8b
<template> <template>
<div>检查详情1123</div> <div class="app-container">
<!-- 头部标题-->
<div style="padding-top:5px;text-align: center;">
<span
style="font-size: 24px;
font-family: Microsoft YaHei-Bold, Microsoft YaHei,serif;
font-weight: bold;
color: #333333;"
>详情</span>
</div>
<el-form ref="form" :model="checkDetail" label-width="100px">
<div class="title-paragraph">
<span class="title-text">宠物信息</span>
</div>
<!-- 1 -->
<el-row>
<el-col :span="8">
<el-form-item label="宠物昵称">
<span>1</span>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="宠物ID">
<span>2</span>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="宠物品种">
<span>3</span>
</el-form-item>
</el-col>
</el-row>
<!-- 2 -->
<el-row>
<el-col :span="8">
<el-form-item label="宠物性别">
<span>1</span>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="宠物年龄">
<span>2</span>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="宠物体重">
<span>3</span>
</el-form-item>
</el-col>
</el-row>
<!-- 3 -->
<el-row>
<el-col :span="8">
<el-form-item label="宠物毛色">
<span>1</span>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="绝育情况">
<span>2</span>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="疫苗情况">
<span>3</span>
</el-form-item>
</el-col>
</el-row>
<!-- 4 -->
<el-row>
<el-col :span="8">
<el-form-item label="宠物保险">
<span>1</span>
</el-form-item>
</el-col>
</el-row>
<div class="title-paragraph">
<span class="title-text">宠主信息</span>
</div>
<!-- 1 -->
<el-row>
<el-col :span="8">
<el-form-item label="宠主姓名">
<span>1</span>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="用户ID">
<span>2</span>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="手机号">
<span>3</span>
</el-form-item>
</el-col>
</el-row>
<div class="title-paragraph">
<span class="title-text">检查进度</span>
</div>
<!-- 步骤条 -->
<div>
<el-steps :active="2" align-center>
<el-step title="开具处方单" description="这是一段很长很长很长的描述性文字"></el-step>
<el-step title="缴费开票" description="这是一段很长很长很长的描述性文字"></el-step>
<el-step title="预约检查" description="这段就没那么长了"></el-step>
<el-step title="步骤 4" description="这段就没那么长了！！！"></el-step>
</el-steps>
</div>
<div class="title-paragraph">
<span class="title-text">缴费信息</span>
</div>
<!-- 缴费信息 -->
<el-row>
<el-col :span="8">
<el-form-item label="缴费金额">
<span>1</span>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="缴费方式">
<span>2</span>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="缴费时间">
<span>3</span>
</el-form-item>
</el-col>
</el-row>
<div class="title-paragraph">
<span class="title-text">预约信息</span>
</div>
<el-button @click="bookNow">立即预约</el-button>
<el-row>
<el-col :span="8">
<el-form-item label="检查类型">
<span>1</span>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="设备服务器">
<span>2</span>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="下单时间">
<span>3</span>
</el-form-item>
</el-col>
</el-row>
<div class="title-paragraph">
<span class="title-text">检查信息</span>
</div>
<!-- 1 -->
<el-row>
<el-col :span="8">
<el-form-item label="检查类型">
<span>1</span>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="设备服务器">
<span>2</span>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="下单时间">
<span>3</span>
</el-form-item>
</el-col>
</el-row>
<!-- 2 -->
<el-row>
<el-col :span="8">
<el-form-item label="检查日期">
<span>1</span>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="检查时段">
<span>2</span>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="报告上传时间">
<span>3</span>
</el-form-item>
</el-col>
</el-row>
<!-- 3 -->
<el-row>
<el-col :span="8">
<el-form-item label="影像报告">
<span>1</span>
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
</template> </template>
<script> <script>
export default { export default {
name: 'CheckDetail' name: 'CheckDetail',
data() {
return {
checkDetail: ''
}
},
methods: {
// 点击 预约信息-立即预约
bookNow() {
this.$router.push({
path: '/check-subscribe'
})
}
}
} }
</script> </script>
<style scoped> <style lang="scss">
.title-paragraph {
margin-bottom: 20px;
border-left: 5px solid #5FB54B;
.title-text {
margin-left: 10px;
}
}
</style>
<style scoped lang="scss">
.app-container {
background-color: #FFFFFF;
}
</style> </style>
src/views/service-management/medical-record-management/check-item.vue 0 → 100644
View file @ f23f4e8b
<template>
<div class="app-container">
检查项目
</div>
</template>
<script>
export default {
name: 'CheckItem'
}
</script>
<style scoped lang="scss">
.app-container {
background-color: #FFFFFF;
}
</style>
src/views/service-management/medical-record-management/check-subscribe.vue 0 → 100644
View file @ f23f4e8b
<template>
<div class="app-container">
<!-- 头部标题-->
<div style="padding-top:5px;text-align: center;">
<span
style="font-size: 24px;
font-family: Microsoft YaHei-Bold, Microsoft YaHei,serif;
font-weight: bold;
color: #333333;"
>立即预约</span>
</div>
<el-form ref="form" :model="checkDetail" label-width="100px">
<div class="title-paragraph">
<span class="title-text">宠物信息</span>
</div>
<!-- 1 -->
<el-row>
<el-col :span="8">
<el-form-item label="宠物昵称">
<span>1</span>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="宠物ID">
<span>2</span>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="宠物品种">
<span>3</span>
</el-form-item>
</el-col>
</el-row>
<!-- 2 -->
<el-row>
<el-col :span="8">
<el-form-item label="宠物性别">
<span>1</span>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="宠物年龄">
<span>2</span>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="宠物体重">
<span>3</span>
</el-form-item>
</el-col>
</el-row>
<!-- 3 -->
<el-row>
<el-col :span="8">
<el-form-item label="宠物毛色">
<span>1</span>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="绝育情况">
<span>2</span>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="疫苗情况">
<span>3</span>
</el-form-item>
</el-col>
</el-row>
<!-- 4 -->
<el-row>
<el-col :span="8">
<el-form-item label="宠物保险">
<span>1</span>
</el-form-item>
</el-col>
</el-row>
<div class="title-paragraph">
<span class="title-text">参考信息</span>
</div>
<!-- 1 -->
<el-row>
<el-col :span="8">
<el-form-item label="检查类型">
<span>1</span>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="检查项目">
<span>2</span>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="缴费金额">
<span>3</span>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div class="title-paragraph">
<span class="title-text">设备预约</span>
</div>
<el-form ref="formDevice" :model="queryParams" label-width="100px">
<el-row>
<el-col :span="8">
<el-form-item label="设备">
<el-select v-model="queryParams.device" clearable multiple collapse-tags placeholder="请选择设备">
<el-option
v-for="item in dict.type.exam_type"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="检查日期">
<el-select v-model="queryParams.data" clearable multiple collapse-tags placeholder="请选择检查日期">
<el-option
v-for="item in dict.type.exam_type"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
<!-- 设备表格 -->
<el-table >
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="设备名称" align="center" prop="petNickname" />
<el-table-column label="检查日期" align="center" prop="petBreed" />
<el-table-column label="检查时段" align="center" prop="petSex" />
<el-table-column label="剩余可预约" align="center" prop="petAge" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="180">
<template slot-scope="scope">
<el-button
class="bookNow"
size="mini"
icon="el-icon-check"
@click="handleDelete(scope.row)"
>立即预约</el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
</div>
</template>
<script>
export default {
name: 'CheckSubscribe',
dicts: ['exam_type'],
data() {
return {
checkDetail: {},
queryParams: {},
total: 0
}
},
methods: {
handleDelete() {
},
getList() {}
}
}
</script>
<style lang="scss">
.title-paragraph {
margin-bottom: 20px;
border-left: 5px solid #5FB54B;
.title-text {
margin-left: 10px;
}
}
</style>
<style scoped lang="scss">
.app-container {
background-color: #FFFFFF;
}
</style>
src/views/service-management/medical-record-management/medical-record-management.vue
View file @ f23f4e8b
...@@ -61,25 +61,22 @@ ...@@ -61,25 +61,22 @@
class="fourWordsBtn" class="fourWordsBtn"
icon="el-icon-plus" icon="el-icon-plus"
size="mini" size="mini"
@click="handleAdd"
>选择全部</el-button> >选择全部</el-button>
<el-button <el-button
class="fourWordsBtn" class="fourWordsBtn"
icon="el-icon-edit" icon="el-icon-edit"
size="mini" size="mini"
@click="handleUpdate"
>反向选择</el-button> >反向选择</el-button>
<el-button <el-button
class="fourWordsBtn" class="fourWordsBtn"
icon="el-icon-delete" icon="el-icon-delete"
size="mini" size="mini"
@click="handleDelete"
>批量导出</el-button> >批量导出</el-button>
<el-button <el-button
class="fourWordsBtn" class="fourWordsBtn"
icon="el-icon-download" icon="el-icon-download"
size="mini" size="mini"
@click="handleExport" @click="checkItem()"
>检查项目</el-button> >检查项目</el-button>
<el-button style="position: relative; float: right;" class="resetBtn" icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> <el-button style="position: relative; float: right;" class="resetBtn" icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
<el-button style="position: relative; float: right;" class="queryBtn" icon="el-icon-search" size="mini" @click="handleQuery">查询</el-button> <el-button style="position: relative; float: right;" class="queryBtn" icon="el-icon-search" size="mini" @click="handleQuery">查询</el-button>
...@@ -198,7 +195,7 @@ export default { ...@@ -198,7 +195,7 @@ export default {
} }
}, },
created() { created() {
// this.getList() this.getList()
}, },
methods: { methods: {
/** 查询业务管理-检查管理列表 */ /** 查询业务管理-检查管理列表 */
...@@ -216,6 +213,12 @@ export default { ...@@ -216,6 +213,12 @@ export default {
this.open = false this.open = false
this.reset() this.reset()
}, },
// 点击检查项目
checkItem() {
this.$router.push({
path: '/check-item'
})
},
// 表单重置 // 表单重置
reset() { reset() {
this.form = { this.form = {
......
src/views/service-management/registration-queue/components/doctor-card.vue
View file @ f23f4e8b
...@@ -52,20 +52,19 @@ ...@@ -52,20 +52,19 @@
<!--分割线--> <!--分割线-->
<div class="divider" /> <div class="divider" />
<!--卡片中间部分--> <!--卡片中间部分-->
<div> <div class="mid-bottom-framework">
<el-image <div
v-for=" progressi in 2" v-for=" progressi in 2"
:key="progressi" :key="progressi"
class="mid-bottom"
>
<el-image
class="mid-bottom-inner"
fit="cover" fit="cover"
src="http://114.67.241.140:8090/profile/upload/2023/05/10/dog1_20230510063813A013.png" src="http://114.67.241.140:8090/profile/upload/2023/05/10/dog1_20230510063813A013.png"
style="width: 32px;
height: 32px;
background: #EEEEEE;
margin-right: 12px;
margin-bottom: 15px;
border-radius: 2px 2px 2px 2px;"
/> />
</div> </div>
</div>
<!--卡片下半部分--> <!--卡片下半部分-->
<div class="bottom"> <div class="bottom">
<div class="inner"> <div class="inner">
...@@ -107,19 +106,27 @@ border-radius: 2px 2px 2px 2px;" ...@@ -107,19 +106,27 @@ border-radius: 2px 2px 2px 2px;"
<div <div
class="content-bottom" class="content-bottom"
> >
<div class="detail"> <div class="detail" @click="doctorDetail(1)">
<div class="detail-img">
<el-image :src="require('@/assets/register/xinzengguahao_xiangqing@2x.png')" />
</div>
<el-button <el-button
icon="el-icon-document-copy"
type="text" type="text"
@click="doctorDetail(1)"
>详情 >详情
</el-button> </el-button>
</div> </div>
<div class="register">
<el-button icon="el-icon-phone-outline" type="text" @click="registration(1)">挂号</el-button> <div class="register" @click="registration(1)">
<div class="register-img">
<el-image :src="require('@/assets/register/xinzengguahao_guahaohui@2x.png')" />
</div>
<el-button type="text">挂号</el-button>
</div>
<div class="add" @click="registration(1)">
<div class="add-img">
<el-image :src="require('@/assets/register/xinzengguahao_jiahao@2x.png')" />
</div> </div>
<div class="add"> <el-button type="text">加号</el-button>
<el-button icon="el-icon-date" type="text" @click="registration(1)">加号</el-button>
</div> </div>
</div> </div>
</div> </div>
...@@ -249,6 +256,25 @@ export default { ...@@ -249,6 +256,25 @@ export default {
margin: 17px 0 20px 0; margin: 17px 0 20px 0;
} }
//卡片中间头像部分--框架
.mid-bottom-framework {
display: flex;
//卡片中间头像部分
.mid-bottom {
width: 32px;
height: 32px;
background: #EEEEEE;
margin-right: 12px;
margin-bottom: 15px;
border-radius: 2px 2px 2px 2px;
.mid-bottom-inner {
width: 100%;
height: 100%;
}
}
}
//卡片下半部分 //卡片下半部分
.bottom { .bottom {
height: fit-content; height: fit-content;
...@@ -329,26 +355,57 @@ export default { ...@@ -329,26 +355,57 @@ export default {
border-radius: 0px 0px 3px 3px; border-radius: 0px 0px 3px 3px;
//详情 //详情
.detail { .detail {
display: flex;
.detail-img {
width: 13px;
height: 13px;
margin-top: 11px;
}
::v-deep .el-button--text {
font-size: 12px; font-size: 12px;
font-family: Microsoft YaHei-Regular, Microsoft YaHei; font-family: Microsoft YaHei-Regular, Microsoft YaHei;
font-weight: 400; font-weight: 400;
color: #5FB54B; color: #5FB54B;
} }
}
//挂号 //挂号
.register { .register {
display: flex;
.register-img {
width: 13px;
height: 13px;
margin-top: 11px;
}
::v-deep .el-button--text {
font-size: 12px; font-size: 12px;
font-family: Microsoft YaHei-Regular, Microsoft YaHei; font-family: Microsoft YaHei-Regular, Microsoft YaHei;
font-weight: 400; font-weight: 400;
color: #5FB54B; color: #C9C9C9;
}
} }
//加号 //加号
.add { .add {
display: flex;
.add-img {
width: 13px;
height: 13px;
margin-top: 11px;
}
::v-deep .el-button--text {
font-size: 12px; font-size: 12px;
font-family: Microsoft YaHei-Regular, Microsoft YaHei; font-family: Microsoft YaHei-Regular, Microsoft YaHei;
font-weight: 400; font-weight: 400;
color: #5FB54B; color: #3490CE;
}
} }
} }
...@@ -360,4 +417,5 @@ export default { ...@@ -360,4 +417,5 @@ export default {
::v-deep .el-card__body { ::v-deep .el-card__body {
padding: unset !important; padding: unset !important;
} }
</style> </style>
src/views/service-management/registration-queue/components/schedule-info.vue
View file @ f23f4e8b
<template> <template>
<!--进度信息模块封装--> <!--进度信息模块封装-->
<div class="schedule-info"> <div class="schedule-info">
<!-- 1--tip样式-->
<div class="progress-tip"> <div class="progress-tip">
<div class="tip-green" /> <div class="tip-green" />
<div <div
...@@ -8,179 +9,107 @@ ...@@ -8,179 +9,107 @@
>进度信息 >进度信息
</div> </div>
</div> </div>
<!-- 2--内容样式-->
<div class="progress-base"> <div class="progress-base">
<!-- 原型--样式1--> <div class="display-base">
<!-- <el-steps :active="2" align-center>--> <!-- 1--单个的背景,,后面按状态位切换样式-->
<!-- <el-step description="2023-05-05 13:05" title="现场挂号" />--> <div class="bkg-on">
<!-- <el-step description="暂未诊断" title="录入诊断信息" />-->
<!-- <el-step description="暂未生成" title="生成病历" />-->
<!-- <el-step description="暂未开具" title="开具处方单" />-->
<!-- </el-steps>-->
<!-- 蓝湖==样式2-->
<div style="display: flex;">
<!-- 单个的背景,,后面按状态位切换样式-->
<div
style="width: 260px;
height: 143px;
background: #F1F9EF;
border-radius: 4px 4px 4px 4px;
opacity: 1;
"
>
<!--1.预约/现场挂号--> <!--1.预约/现场挂号-->
<div <div
style="display: flex; class="content-inner"
align-items: center;
flex-direction: column;
padding-top: 18px;"
> >
<div <div
style="width: 44px; class="avatar"
height: 44px;margin-bottom:14px; "
> >
<el-image :src="require('@/assets/register/xinzengguahao_yuyue@2x.png')" /> <el-image :src="require('@/assets/register/xinzengguahao_yuyue@2x.png')" />
</div> </div>
<div <div
style="font-size: 14px; class="title"
font-family: Microsoft YaHei-Bold, Microsoft YaHei;
font-weight: bold;
color: #333333;margin-bottom:14px;"
>1.预约/现场挂号 >1.预约/现场挂号
</div> </div>
<div <div
style="font-size: 12px; class="status-on"
font-family: Microsoft YaHei-Regular, Microsoft YaHei;
font-weight: 400;
color: #5FB54B;"
>进行中 >进行中
</div> </div>
</div> </div>
</div> </div>
<!-- 箭头指示--> <!-- 箭头指示-->
<div style="height: 13px;width: 104px;margin: 65px 22px 65px 22px ;"> <div class="arrow">
<el-image :src="require('@/assets/register/xinzengguahao_jaintou@2x.png')" /> <el-image :src="require('@/assets/register/xinzengguahao_jaintou@2x.png')" />
</div> </div>
<!-- 单个的背景,,后面按状态位切换样式--> <!-- 2--单个的背景,,后面按状态位切换样式-->
<div <div
style="width: 260px; class="bkg-off"
height: 143px;
background: #FFFFFF;
border-radius: 4px 4px 4px 4px;
opacity: 1;
border: 1px solid #5FB54B;
"
> >
<!--2.录入诊断信息--> <!--2.录入诊断信息-->
<div <div
style="display: flex; class="content-inner"
align-items: center;
flex-direction: column;
padding-top: 18px;"
> >
<div <div
style="width: 44px; class="avatar"
height: 44px;margin-bottom:14px; "
> >
<el-image :src="require('@/assets/register/xinzengguahao_luru@2x.png')" /> <el-image :src="require('@/assets/register/xinzengguahao_luru@2x.png')" />
</div> </div>
<div <div
style="font-size: 14px; class="title"
font-family: Microsoft YaHei-Bold, Microsoft YaHei;
font-weight: bold;
color: #333333;margin-bottom:14px;"
>2.录入诊断信息 >2.录入诊断信息
</div> </div>
<div <div
style="font-size: 12px; class="status-off"
font-family: Microsoft YaHei-Regular, Microsoft YaHei;
font-weight: 400;
color: #AFAFAF;"
>暂未录入 >暂未录入
</div> </div>
</div> </div>
</div> </div>
<!-- 箭头指示--> <!-- 箭头指示-->
<div style="height: 13px;width: 104px;margin: 65px 22px 65px 22px ;"> <div class="arrow">
<el-image :src="require('@/assets/register/xinzengguahao_jaintou@2x.png')" /> <el-image :src="require('@/assets/register/xinzengguahao_jaintou@2x.png')" />
</div> </div>
<!-- 单个的背景,,后面按状态位切换样式--> <!-- 3--单个的背景,,后面按状态位切换样式-->
<div <div
style="width: 260px; class="bkg-off"
height: 143px;
background: #FFFFFF;
border-radius: 4px 4px 4px 4px;
opacity: 1;
border: 1px solid #5FB54B;
"
> >
<!--3.开具处方单--> <!--3.开具处方单-->
<div <div
style="display: flex; class="content-inner"
align-items: center;
flex-direction: column;
padding-top: 18px;"
> >
<div <div
style="width: 44px; class="avatar"
height: 44px;margin-bottom:14px; "
> >
<el-image :src="require('@/assets/register/xinzengguahao_kaichuangfdan@2x.png')" /> <el-image :src="require('@/assets/register/xinzengguahao_kaichuangfdan@2x.png')" />
</div> </div>
<div <div
style="font-size: 14px; class="title"
font-family: Microsoft YaHei-Bold, Microsoft YaHei;
font-weight: bold;
color: #333333;margin-bottom:14px;"
>3.开具处方单 >3.开具处方单
</div> </div>
<div <div
style="font-size: 12px; class="status-off"
font-family: Microsoft YaHei-Regular, Microsoft YaHei;
font-weight: 400;
color: #AFAFAF;"
>暂未开具 >暂未开具
</div> </div>
</div> </div>
</div> </div>
<!-- 箭头指示--> <!-- 箭头指示-->
<div style="height: 13px;width: 104px;margin: 65px 22px 65px 22px ;"> <div class="arrow">
<el-image :src="require('@/assets/register/xinzengguahao_jaintou@2x.png')" /> <el-image :src="require('@/assets/register/xinzengguahao_jaintou@2x.png')" />
</div> </div>
<!-- 单个的背景,,后面按状态位切换样式--> <!-- 4--单个的背景,,后面按状态位切换样式-->
<div <div
style="width: 260px; class="bkg-off"
height: 143px;
background: #FFFFFF;
border-radius: 4px 4px 4px 4px;
opacity: 1;
border: 1px solid #5FB54B;
"
> >
<!--4.生成病例报告--> <!--4.生成病例报告-->
<div <div
style="display: flex; class="content-inner"
align-items: center;
flex-direction: column;
padding-top: 18px;"
> >
<div <div
style="width: 44px; class="avatar"
height: 44px;margin-bottom:14px; "
> >
<el-image :src="require('@/assets/register/xinzengguahao_shengchengbaogao@2x.png')" /> <el-image :src="require('@/assets/register/xinzengguahao_shengchengbaogao@2x.png')" />
</div> </div>
<div <div
style="font-size: 14px; class="title"
font-family: Microsoft YaHei-Bold, Microsoft YaHei;
font-weight: bold;
color: #333333;margin-bottom:14px;"
>4.生成病例报告 >4.生成病例报告
</div> </div>
<div <div
style="font-size: 12px; class="status-off"
font-family: Microsoft YaHei-Regular, Microsoft YaHei;
font-weight: 400;
color: #AFAFAF;"
>暂未生成 >暂未生成
</div> </div>
</div> </div>
...@@ -222,10 +151,76 @@ export default { ...@@ -222,10 +151,76 @@ export default {
} }
} }
/*进度条内容主题样式*/ //进度条整体框架边距
.progress-base { .progress-base {
padding-top: 50px; padding-top: 50px;
padding-bottom: 50px; padding-bottom: 50px;
//进度条排列方向及顺序布局
.display-base {
display: flex;
//当前触发的背景样式
.bkg-on {
width: 260px;
height: 143px;
background: #F1F9EF;
border-radius: 4px 4px 4px 4px;
opacity: 1;
}
//当前未触发的背景样式
.bkg-off {
width: 260px;
height: 143px;
background: #FFFFFF;
border-radius: 4px 4px 4px 4px;
opacity: 1;
border: 1px solid #5FB54B;
}
//箭头样式
.arrow {
height: 13px;
width: 104px;
margin: 65px 22px 65px 22px;
}
//状态触发状态
.status-on {
font-size: 12px;
font-family: Microsoft YaHei-Regular, Microsoft YaHei;
font-weight: 400;
color: #5FB54B;
}
//状态未触发状态
.status-off {
font-size: 12px;
font-family: Microsoft YaHei-Regular, Microsoft YaHei;
font-weight: 400;
color: #AFAFAF;
}
//头像
.avatar {
width: 44px;
height: 44px;
margin-bottom: 14px;
}
//标题
.title {
font-size: 14px;
font-family: Microsoft YaHei-Bold, Microsoft YaHei;
font-weight: bold;
color: #333333;
margin-bottom: 14px;
}
//预约/挂号
.content-inner {
display: flex;
align-items: center;
flex-direction: column;
padding-top: 18px;
}
}
} }
} }
......
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