|
@@ -0,0 +1,330 @@
|
|
|
+<template>
|
|
|
+ <div class="resourceReview">
|
|
|
+ <ul class="detailUl">
|
|
|
+ <li class="topBox">
|
|
|
+ <div class="topTitle">会议室详情</div>
|
|
|
+ </li>
|
|
|
+ <li class="detailLi">
|
|
|
+ <span class="liName">当前企业</span>
|
|
|
+ <span class="liInfo">无锡XXXXX有限公司</span>
|
|
|
+ </li>
|
|
|
+ <li class="detailLi">
|
|
|
+ <span class="liName">位置</span>
|
|
|
+ <span class="liInfo">XXXXXXXXXXXXXXXXX</span>
|
|
|
+ </li>
|
|
|
+ <li class="detailLi">
|
|
|
+ <span class="liName">容纳人数</span>
|
|
|
+ <span class="liInfo">120</span>
|
|
|
+ </li>
|
|
|
+ <li class="detailLi">
|
|
|
+ <span class="liName">配套</span>
|
|
|
+ <span class="liInfo">XXXX</span>
|
|
|
+ </li>
|
|
|
+ <li class="detailLi" style="border-bottom: none">
|
|
|
+ <span class="liName">说明</span>
|
|
|
+ <span class="liInfo">XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX</span>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ <div class="resourceAddDetail">
|
|
|
+ <ul class="predetermineUl">
|
|
|
+ <li class="topBox">
|
|
|
+ <div class="topTitle" style="padding: 48rpx 0 24rpx 0">预约详情</div>
|
|
|
+ <div class="choosTimeBox">
|
|
|
+ <span class="msg">使用时间</span>
|
|
|
+ <input placeholder="请选择日期" class="choosIpt" disabled>
|
|
|
+ <input placeholder="请选择时间段" class="choosIpt" disabled>
|
|
|
+ </div>
|
|
|
+ </li>
|
|
|
+ <li class="detailLi">
|
|
|
+ <span class="liName">主题</span>
|
|
|
+ <span >
|
|
|
+ <input class="liInfo" placeholder="" v-model="theme" disabled>
|
|
|
+ </span>
|
|
|
+ </li>
|
|
|
+ <li class="detailLi">
|
|
|
+ <span class="liName">容纳人数</span>
|
|
|
+ <span >
|
|
|
+ <input class="liInfo" placeholder="请填写整数">
|
|
|
+ </span>
|
|
|
+ </li>
|
|
|
+ <li class="detailLi">
|
|
|
+ <span class="liName">联系人</span>
|
|
|
+ <span >
|
|
|
+ <input class="liInfo" placeholder="请填写">
|
|
|
+ </span>
|
|
|
+ </li>
|
|
|
+ <li class="detailLi">
|
|
|
+ <span class="liName">联系电话</span>
|
|
|
+ <span >
|
|
|
+ <input class="liInfo" placeholder="请填写">
|
|
|
+ </span>
|
|
|
+ </li>
|
|
|
+ <li class="detailLi2" style="border-bottom: none">
|
|
|
+ <div class="titleBox" >
|
|
|
+ <span class="liName">备注</span>
|
|
|
+ </div>
|
|
|
+ <van-field
|
|
|
+ :value="postData.constant"
|
|
|
+ autosize
|
|
|
+ type="textarea"
|
|
|
+ placeholder="请输入"
|
|
|
+ class="myField"
|
|
|
+ maxlength="2000"
|
|
|
+ show-word-limit
|
|
|
+ />
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ <ul class="predetermineUl">
|
|
|
+ <li class="detailLi">
|
|
|
+ <span class="liName">预约单位</span>
|
|
|
+ <span >
|
|
|
+ <input class="liInfo" placeholder="" v-model="unit">
|
|
|
+ </span>
|
|
|
+ </li>
|
|
|
+ <li class="detailLi">
|
|
|
+ <span class="liName">容纳人数</span>
|
|
|
+ <span >
|
|
|
+ <input class="liInfo" placeholder="请填写整数">
|
|
|
+ </span>
|
|
|
+ </li>
|
|
|
+ <li class="detailLi">
|
|
|
+ <span class="liName">预约人</span>
|
|
|
+ <span >
|
|
|
+ <input class="liInfo" placeholder="请填写" value="吴凯旋">
|
|
|
+ </span>
|
|
|
+ </li>
|
|
|
+ <li class="detailLi" style="border-bottom: none">
|
|
|
+ <span class="liName">预约时间</span>
|
|
|
+ <span >
|
|
|
+ <input class="liInfo" placeholder="请填写" value="YYYYY-MM-DD HH:MM ">
|
|
|
+ </span>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ <ul class="detailUl">
|
|
|
+ <li class="topBox">
|
|
|
+ <div class="topTitle">审核信息</div>
|
|
|
+ </li>
|
|
|
+ <li class="detailLi2">
|
|
|
+ <van-radio-group :value="radio" @change="onChange">
|
|
|
+ <van-radio name="1">通过</van-radio>
|
|
|
+ <van-radio name="2" style="margin-left: 48rpx">取消</van-radio>
|
|
|
+ </van-radio-group>
|
|
|
+ <van-field
|
|
|
+ :value="postData.constant"
|
|
|
+ autosize
|
|
|
+ type="textarea"
|
|
|
+ placeholder="请输入取消原因(必填)"
|
|
|
+ class="myField"
|
|
|
+ maxlength="200"
|
|
|
+ show-word-limit
|
|
|
+ />
|
|
|
+ </li>
|
|
|
+ <li class="detailLi">
|
|
|
+ <span class="liName">办理人</span>
|
|
|
+ <span class="liInfo">自动带出</span>
|
|
|
+ </li>
|
|
|
+ <li class="detailLi" style="border-bottom: none">
|
|
|
+ <span class="liName">办理时间</span>
|
|
|
+ <span class="liInfo">自动带出提交时间(年月日时分秒)</span>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ <div class="buttonBox" >
|
|
|
+ <button class="btn zcBtn">暂存</button>
|
|
|
+ <button class="btn tjBtn">提交</button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+export default {
|
|
|
+ name: "resoureceReview",
|
|
|
+ data() {
|
|
|
+ return{
|
|
|
+ theme:'XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX',
|
|
|
+ unit:'XXXXXXXXXXXXXX',
|
|
|
+ postData: {},
|
|
|
+ radio: '1'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods:{
|
|
|
+ onChange(){
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss">
|
|
|
+ .resourceReview{
|
|
|
+ .detailUl{
|
|
|
+ margin-top: 20rpx;
|
|
|
+ background: white;
|
|
|
+ padding: 24rpx 32rpx;
|
|
|
+ .detailLi{
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ padding: 32rpx 0;
|
|
|
+ border-bottom: 2rpx solid #E6E6E6;
|
|
|
+ .liInfo{
|
|
|
+ display: inline-block;
|
|
|
+ text-align: right;
|
|
|
+ max-width: 428rpx;
|
|
|
+ color: rgba(102, 102, 102, 1);
|
|
|
+ font-size: 32rpx;
|
|
|
+ line-height: 38rpx;
|
|
|
+ overflow: hidden;
|
|
|
+ word-wrap: break-word;
|
|
|
+ }
|
|
|
+ .liName{
|
|
|
+ font-size: 32rpx;
|
|
|
+ color: rgba(51, 51, 51, 1);
|
|
|
+ white-space: nowrap;
|
|
|
+ .callNumber{
|
|
|
+ color: rgba(24, 23, 42, 1);
|
|
|
+ font-size: 36rpx;
|
|
|
+ font-weight: 600;
|
|
|
+ }
|
|
|
+ .callName{
|
|
|
+ color: rgba(102, 102, 102, 1);
|
|
|
+ font-size: 28rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .topBox{
|
|
|
+ background: white;
|
|
|
+ margin: 24rpx 0;
|
|
|
+ .topTitle{
|
|
|
+ color: rgba(34, 34, 34, 1);
|
|
|
+ font-size: 36rpx;
|
|
|
+ font-weight: 600;
|
|
|
+ }
|
|
|
+ .choosTimeBox{
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ .msg{
|
|
|
+ color: rgba(51, 51, 51, 1);
|
|
|
+ font-size: 32rpx;
|
|
|
+ white-space: nowrap;
|
|
|
+ }
|
|
|
+ .choosIpt{
|
|
|
+ width: 260rpx;
|
|
|
+ height: 96rpx;
|
|
|
+ padding-left: 50rpx;
|
|
|
+ background: rgba(245, 247, 250, 1);
|
|
|
+ box-sizing: border-box;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .resourceAddDetail{
|
|
|
+ .predetermineUl{
|
|
|
+ margin: 24rpx 0;
|
|
|
+ background: white;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 0 32rpx;
|
|
|
+ .predetermineLi{
|
|
|
+ padding: 32rpx 0;
|
|
|
+ border-bottom: 1px solid rgba(230, 230, 230, 1);
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ }
|
|
|
+ .predetermineLi2{
|
|
|
+ padding: 32rpx 0;
|
|
|
+ border-bottom: 1px solid rgba(230, 230, 230, 1);
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ }
|
|
|
+ .liName{
|
|
|
+ color: rgba(51, 51, 51, 1);
|
|
|
+ font-size: 32rpx;
|
|
|
+ }
|
|
|
+ .liIpt{
|
|
|
+ color: rgba(102, 102, 102, 1);
|
|
|
+ font-size: 32rpx;
|
|
|
+ text-align: right;
|
|
|
+ }
|
|
|
+ .detailLi{
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ padding: 32rpx 0;
|
|
|
+ border-bottom: 2rpx solid #E6E6E6;
|
|
|
+ .liInfo{
|
|
|
+ display: inline-block;
|
|
|
+ text-align: right;
|
|
|
+ max-width: 488rpx;
|
|
|
+ width: 488rpx;
|
|
|
+ color: rgba(102, 102, 102, 1);
|
|
|
+ font-size: 32rpx;
|
|
|
+ line-height: 38rpx;
|
|
|
+ .radio{
|
|
|
+ margin-left: 64rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .detailLi2{
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ padding: 32rpx 0;
|
|
|
+ border-bottom: 2rpx solid #E6E6E6;
|
|
|
+ .detailLi2BoxTop{
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ justify-content: space-between;
|
|
|
+ margin: 12rpx 0;
|
|
|
+ .checkItem{
|
|
|
+ width: 128rpx;
|
|
|
+ height: 64rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #666666;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ background: #F5F7FA;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ margin: 12rpx 0;
|
|
|
+ }
|
|
|
+ .checked{
|
|
|
+ background: #0365F9;
|
|
|
+ color: white;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .van-radio-group{
|
|
|
+ display: flex;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .van-cell {
|
|
|
+ background: #F5F7FA !important;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
+ margin-top: 16rpx;
|
|
|
+ }
|
|
|
+ .buttonBox{
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ .btn{
|
|
|
+ width: 240rpx;
|
|
|
+ height: 80rpx;
|
|
|
+ display: flex;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ margin: 48rpx 16rpx 150rpx 16rpx;
|
|
|
+ color: white;
|
|
|
+ letter-spacing: 2rpx;
|
|
|
+ text-indent: 2rpx;
|
|
|
+ }
|
|
|
+ .zcBtn{
|
|
|
+ background: #FE8643;
|
|
|
+ }
|
|
|
+ .tjBtn{
|
|
|
+ background: #0365F9;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|