|
@@ -10,7 +10,8 @@
|
|
</el-breadcrumb>
|
|
</el-breadcrumb>
|
|
</div>
|
|
</div>
|
|
<div class="bread_right">
|
|
<div class="bread_right">
|
|
- <el-button class="apply" type="danger" @click="apply">立即申请</el-button>
|
|
|
|
|
|
+ <el-button type="danger" @click="orderOrg">机构预约</el-button>
|
|
|
|
+ <el-button type="danger" @click="search">查询结果</el-button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="center_box">
|
|
<div class="center_box">
|
|
@@ -56,10 +57,12 @@
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
<div>
|
|
<div>
|
|
- 如果您选择了外区(非户籍区)的养老机构,需要提供人户分离证明。 (温馨提示:如果您的居住地址与户籍地址一致,则不需要提供人户分离证明 引用《上海市人民政府关于印发《上海市户籍人户分离人员居住登记办法》的通知》中第九条“本市户籍人户分离人员办理居住登记时,应当提供以下材料:
|
|
|
|
|
|
+ 如果您选择了外区(非户籍区)的养老机构,需要提供人户分离证明。 (温馨提示:如果您的居住地址与户籍地址一致,则不需要提供人户分离证明
|
|
|
|
+ 引用《上海市人民政府关于印发《上海市户籍人户分离人员居住登记办法》的通知》中第九条“本市户籍人户分离人员办理居住登记时,应当提供以下材料:
|
|
(一)《本市户籍人户分离人员居住登记申请表》 (二)本人居民身份证、《居民户口簿》、《个人户口卡》或加盖单位人事(或保卫)部门印章的《集体户口个人信息页》复印件等有效身份证明
|
|
(一)《本市户籍人户分离人员居住登记申请表》 (二)本人居民身份证、《居民户口簿》、《个人户口卡》或加盖单位人事(或保卫)部门印章的《集体户口个人信息页》复印件等有效身份证明
|
|
(三)居住房屋产权证明、租用公房凭证、由房屋行政管理部门出具的房屋租赁登记备案证明或单位人事(或保卫)部门出具的集体宿舍证明
|
|
(三)居住房屋产权证明、租用公房凭证、由房屋行政管理部门出具的房屋租赁登记备案证明或单位人事(或保卫)部门出具的集体宿舍证明
|
|
- 本市户籍人户分离人员申请办理居住登记时提供的各类材料应当真实有效,对弄虚作假的不予办理登记。能够通过数据互认共享获取的材料,不得要求本市户籍人户分离人员申请办理居住登记时重复提供。” 文件详情可点击 前往了解
|
|
|
|
|
|
+ 本市户籍人户分离人员申请办理居住登记时提供的各类材料应当真实有效,对弄虚作假的不予办理登记。能够通过数据互认共享获取的材料,不得要求本市户籍人户分离人员申请办理居住登记时重复提供。” 文件详情可点击
|
|
|
|
+ 前往了解
|
|
</div>
|
|
</div>
|
|
</el-collapse-item>
|
|
</el-collapse-item>
|
|
</el-collapse>
|
|
</el-collapse>
|
|
@@ -71,23 +74,100 @@
|
|
</el-tabs>
|
|
</el-tabs>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
+ <el-dialog v-model="showSearch" title="查询结果" @close="resetDialog" append-to-body :lock-scroll="false">
|
|
|
|
+ <el-form class="searchForm" ref="formRef" :model="form" :rules="rules" size="large" :inline="true">
|
|
|
|
+ <el-form-item label="姓名" label-width="80px" prop="xm">
|
|
|
|
+ <el-input v-model="form.xm" placeholder="请输入姓名" clearable></el-input>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item label="身份证号码" label-width="100px" prop="zjhm">
|
|
|
|
+ <el-input v-model="form.zjhm" placeholder="请输入身份证号码" maxlength="18" clearable></el-input>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item class="btn-group">
|
|
|
|
+ <el-button class="submitBtn" type="danger" @click="onSubmit(formRef)">查 询</el-button>
|
|
|
|
+ <el-button class="submitBtn" type="danger" plain @click="resetForm(formRef)">重 置</el-button>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ </el-form>
|
|
|
|
+ <el-table class="result" v-if="showResult === 1" :data="searchResult">
|
|
|
|
+ <el-table-column label="预约人姓名" align="center" prop="xm" />
|
|
|
|
+ <el-table-column label="预约人身份证号码" align="center" prop="zjhm" width="200" />
|
|
|
|
+ <!-- <el-table-column label="预约时间" align="center" prop="jgmc" /> -->
|
|
|
|
+ <el-table-column label="预约机构" align="center" prop="jgmc" width="200" />
|
|
|
|
+ <el-table-column label="预约状态" align="center" prop="yyzt" />
|
|
|
|
+ </el-table>
|
|
|
|
+ <div class="noResult" v-else-if="showResult === 0">暂无查询结果</div>
|
|
|
|
+ </el-dialog>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
<script setup>
|
|
-import {ref} from 'vue'
|
|
|
|
-import {useRouter} from 'vue-router'
|
|
|
|
|
|
+import { reactive, ref } from 'vue'
|
|
|
|
+import { useRouter } from 'vue-router'
|
|
|
|
+import { getOrderOrgResult } from '@/api/home'
|
|
|
|
|
|
let router = useRouter()
|
|
let router = useRouter()
|
|
-const handleClick = () => {}
|
|
|
|
|
|
+const handleClick = () => { }
|
|
const activeName = ref('1')
|
|
const activeName = ref('1')
|
|
const tabActive = ref('first')
|
|
const tabActive = ref('first')
|
|
const src = new URL('../../assets/images/zxsq/waitingStepsSmall.00f899e2.png', import.meta.url).href
|
|
const src = new URL('../../assets/images/zxsq/waitingStepsSmall.00f899e2.png', import.meta.url).href
|
|
const srcList = ref([new URL('../../assets/images/zxsq/waitingStepsSmall.00f899e2.png', import.meta.url).href])
|
|
const srcList = ref([new URL('../../assets/images/zxsq/waitingStepsSmall.00f899e2.png', import.meta.url).href])
|
|
-const apply = () => {router.push('rzyljgsq/sqzltx')}
|
|
|
|
|
|
+
|
|
|
|
+// 查询结果弹出框是否显示
|
|
|
|
+const showSearch = ref(false)
|
|
|
|
+// 是否查询到数据
|
|
|
|
+const showResult = ref()
|
|
|
|
+// 表格数据
|
|
|
|
+const searchResult = ref([])
|
|
|
|
+
|
|
|
|
+// 机构预约按钮
|
|
|
|
+const orderOrg = () => router.push('rzyljgsq/sqzltx')
|
|
|
|
+// 查询结果按钮
|
|
|
|
+const search = () => showSearch.value = true
|
|
|
|
+
|
|
|
|
+// 查询结果表单相关
|
|
|
|
+const formRef = ref()
|
|
|
|
+const form = reactive({
|
|
|
|
+ xm: '夏洛',
|
|
|
|
+ zjhm: '220123194808291226',
|
|
|
|
+})
|
|
|
|
+const rules = reactive({
|
|
|
|
+ xm: [
|
|
|
|
+ { required: true, message: '请输入老人姓名', trigger: 'blur' },
|
|
|
|
+ ],
|
|
|
|
+ zjhm: [
|
|
|
|
+ { required: true, message: '请输入老人身份证号码', trigger: 'blur' },
|
|
|
|
+ ],
|
|
|
|
+})
|
|
|
|
+async function onSubmit(formEl) {
|
|
|
|
+ if (!formEl) return
|
|
|
|
+ await formEl.validate((valid, fields) => {
|
|
|
|
+ if (valid) {
|
|
|
|
+ getOrderOrgResult(form).then((res) => {
|
|
|
|
+ console.log(res);
|
|
|
|
+ if (res.rows.length > 0) {
|
|
|
|
+ showResult.value = 1
|
|
|
|
+ searchResult.value = res.rows
|
|
|
|
+ console.log(res.rows);
|
|
|
|
+ } else {
|
|
|
|
+ showResult.value = 0
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ } else {
|
|
|
|
+ console.log('submit error', fields);
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+}
|
|
|
|
+function resetForm(formEl) {
|
|
|
|
+ if (!formEl) return
|
|
|
|
+ formEl.resetFields()
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+// 关闭dialog时的回调
|
|
|
|
+function resetDialog(){
|
|
|
|
+ showResult.value = ''
|
|
|
|
+}
|
|
</script>
|
|
</script>
|
|
|
|
|
|
-<style scoped>
|
|
|
|
|
|
+<style lang="scss" scoped>
|
|
.main_box2 {
|
|
.main_box2 {
|
|
background: #ffffff;
|
|
background: #ffffff;
|
|
border: 1px solid #dedede;
|
|
border: 1px solid #dedede;
|
|
@@ -145,12 +225,14 @@ const apply = () => {router.push('rzyljgsq/sqzltx')}
|
|
font-weight: 600;
|
|
font-weight: 600;
|
|
color: #bf242a;
|
|
color: #bf242a;
|
|
}
|
|
}
|
|
|
|
+
|
|
.shoufengqinBox {
|
|
.shoufengqinBox {
|
|
width: 80%;
|
|
width: 80%;
|
|
height: 464px;
|
|
height: 464px;
|
|
margin: 40px auto;
|
|
margin: 40px auto;
|
|
border: 1px solid #e6e6e6;
|
|
border: 1px solid #e6e6e6;
|
|
}
|
|
}
|
|
|
|
+
|
|
:deep(.el-tabs .el-tabs__header .el-tabs__nav-wrap .el-tabs__nav-scroll .el-tabs__nav .el-tabs__item) {
|
|
:deep(.el-tabs .el-tabs__header .el-tabs__nav-wrap .el-tabs__nav-scroll .el-tabs__nav .el-tabs__item) {
|
|
width: 457px;
|
|
width: 457px;
|
|
height: 40px;
|
|
height: 40px;
|
|
@@ -160,36 +242,70 @@ const apply = () => {router.push('rzyljgsq/sqzltx')}
|
|
font-weight: 600;
|
|
font-weight: 600;
|
|
background-color: #fcd3d3;
|
|
background-color: #fcd3d3;
|
|
}
|
|
}
|
|
|
|
+
|
|
:deep(.el-tabs--card > .el-tabs__header .el-tabs__item.is-active) {
|
|
:deep(.el-tabs--card > .el-tabs__header .el-tabs__item.is-active) {
|
|
border-bottom-color: #c53131;
|
|
border-bottom-color: #c53131;
|
|
}
|
|
}
|
|
|
|
+
|
|
:deep(.el-collapse-item__header) {
|
|
:deep(.el-collapse-item__header) {
|
|
background-color: #fcd3d3;
|
|
background-color: #fcd3d3;
|
|
margin-bottom: 5px;
|
|
margin-bottom: 5px;
|
|
color: #c83f43;
|
|
color: #c83f43;
|
|
}
|
|
}
|
|
|
|
+
|
|
.el-collapse {
|
|
.el-collapse {
|
|
width: 98%;
|
|
width: 98%;
|
|
margin: 0 auto;
|
|
margin: 0 auto;
|
|
}
|
|
}
|
|
|
|
+
|
|
.el-collapse-item__content div {
|
|
.el-collapse-item__content div {
|
|
text-align: start;
|
|
text-align: start;
|
|
color: #c0292e;
|
|
color: #c0292e;
|
|
margin-left: 10px;
|
|
margin-left: 10px;
|
|
}
|
|
}
|
|
|
|
+
|
|
.el-collapse-item__content div a {
|
|
.el-collapse-item__content div a {
|
|
color: #004893;
|
|
color: #004893;
|
|
}
|
|
}
|
|
|
|
+
|
|
.el-tab-pane img {
|
|
.el-tab-pane img {
|
|
width: 90%;
|
|
width: 90%;
|
|
}
|
|
}
|
|
|
|
+
|
|
.collapse-title {
|
|
.collapse-title {
|
|
display: flex;
|
|
display: flex;
|
|
justify-content: center;
|
|
justify-content: center;
|
|
align-items: center;
|
|
align-items: center;
|
|
color: #c0292e;
|
|
color: #c0292e;
|
|
}
|
|
}
|
|
|
|
+
|
|
.collapse-title span {
|
|
.collapse-title span {
|
|
margin-left: 10px;
|
|
margin-left: 10px;
|
|
}
|
|
}
|
|
|
|
+
|
|
|
|
+.searchForm {
|
|
|
|
+ :deep(.el-form-item) {
|
|
|
|
+ width: 45%;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .btn-group {
|
|
|
|
+ margin: 0 auto;
|
|
|
|
+ width: 100%;
|
|
|
|
+
|
|
|
|
+ :deep(.el-form-item__content) {
|
|
|
|
+ justify-content: center;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+.result {
|
|
|
|
+ margin: 25px 0;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+.noResult {
|
|
|
|
+ font-size: 18px;
|
|
|
|
+ text-align: center;
|
|
|
|
+ color: #c0292e;
|
|
|
|
+ margin: 25px 0;
|
|
|
|
+}
|
|
</style>
|
|
</style>
|