UI 调整

src/views/modules/communityService/dqfwzx/cpts/edit.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <div>
+    <div class="dialog-h-content scroll-h">
       <el-form ref="ref_form"
                :inline="true"
                :model="dataForm"

src/views/modules/communityService/dqfwzx/cpts/order.vue

@@ -1,36 +1,28 @@
 <template>
   <div>
-    <div>
+    <div class="dialog-h-content scroll-h">
-      <el-form
+      <el-form ref="ref_form"
-        ref="ref_form"
                :inline="true"
                :model="dataForm"
                :rules="dataRule"
                :disabled="formType === 'detail'"
-        class="form"
+               class="form">
-      >
+        <el-form-item label="事项名称"
-        <el-form-item
-          label="事项名称"
                       prop="matterName"
                       label-width="150px"
-          style="display: block"
+                      style="display: block">
-        >
+          <el-input class="item_width_1"
-          <el-input
-            class="item_width_1"
                     maxlength="50"
                     show-word-limit
                     v-model="info.matterName"
-            disabled
+                    disabled>
-          >
           </el-input>
         </el-form-item>
 
-        <el-form-item
+        <el-form-item label="预约日期"
-          label="预约日期"
                       prop="appointmentDate"
                       label-width="150px"
-          style="display: block"
+                      style="display: block">
-        >
           <!-- <el-date-picker
             v-model="dataForm.appointmentDate"
             placeholder="预约日期"
@@ -38,98 +30,77 @@
             :picker-options="dateOptions"
           >
           </el-date-picker> -->
-          <el-select v-model="dataForm.appointmentDate" placeholder="请选择">
+          <el-select v-model="dataForm.appointmentDate"
-            <el-option
+                     placeholder="请选择">
-              v-for="item in dateList"
+            <el-option v-for="item in dateList"
                        :key="item"
                        :label="item"
-              :value="item"
+                       :value="item">
-            >
+            </el-option>
-            </el-option
+          </el-select>
-          ></el-select>
         </el-form-item>
 
-        <el-form-item
+        <el-form-item v-if="timeList.length > 0"
-          v-if="timeList.length > 0"
                       label="预约时段"
                       prop="timeId"
                       label-width="150px"
-          style="display: block"
+                      style="display: block">
-        >
           <div style="margin-left: auto; width: 600px">
-            <el-checkbox
+            <el-checkbox :label="item.timeId"
-              :label="item.timeId"
                          :key="item.timeId"
                          :disabled="!item.isAppointment"
                          v-for="(item, index) in timeList"
                          :checked="item.selected"
                          :value="item.selected"
                          @change="selectTime(index)"
-              @onChange="selectTime(index)"
+                         @onChange="selectTime(index)">{{ item.time }}</el-checkbox>
-              >{{ item.time }}</el-checkbox
-            >
           </div>
         </el-form-item>
 
-        <el-form-item
+        <el-form-item label="预约人"
-          label="预约人"
                       prop="appointmentName"
                       label-width="150px"
-          style="display: block"
+                      style="display: block">
-        >
+          <el-input class="item_width_1"
-          <el-input
-            class="item_width_1"
                     maxlength="50"
                     show-word-limit
                     placeholder="请输入预约人"
-            v-model="dataForm.appointmentName"
+                    v-model="dataForm.appointmentName">
-          >
           </el-input>
         </el-form-item>
 
-        <el-form-item
+        <el-form-item label="联系方式"
-          label="联系方式"
                       prop="appointmentPhone"
                       label-width="150px"
-          style="display: block"
+                      style="display: block">
-        >
+          <el-input class="item_width_1"
-          <el-input
-            class="item_width_1"
                     maxlength="50"
                     show-word-limit
                     placeholder="请输入联系方式"
-            v-model="dataForm.appointmentPhone"
+                    v-model="dataForm.appointmentPhone">
-          >
           </el-input>
         </el-form-item>
 
-        <el-form-item
+        <el-form-item label="备注"
-          label="备注"
                       prop="remark"
                       label-width="150px"
-          style="display: block"
+                      style="display: block">
-        >
+          <el-input class="item_width_1"
-          <el-input
-            class="item_width_1"
                     type="textarea"
                     maxlength="1000"
                     show-word-limit
                     :rows="3"
                     placeholder="请输入备注，不超过1000字"
-            v-model="dataForm.remark"
+                    v-model="dataForm.remark"></el-input>
-          ></el-input>
         </el-form-item>
       </el-form>
     </div>
     <div class="div_btn">
       <el-button @click="handleCancle">取 消</el-button>
-      <el-button
+      <el-button v-if="formType != 'detail'"
-        v-if="formType != 'detail'"
                  type="primary"
                  :disabled="btnDisable"
-        @click="handleComfirm"
+                 @click="handleComfirm">确 定</el-button>
-        >确 定</el-button
-      >
     </div>
   </div>
 </template>

src/views/modules/communityService/dqfwzx/cpts/orderList.vue

@@ -1,55 +1,55 @@
 <template>
   <div style="min-height: 400px">
-    <el-form ref="ref_form" :inline="true" class="form">
+    <el-form ref="ref_form"
-      <el-form-item
+             :inline="true"
-        label="选择预约日期"
+             class="form">
+      <el-form-item label="选择预约日期"
                     prop="appointmentDate"
                     label-width="110px"
-        style="display: block"
+                    style="display: block">
-      >
+        <el-date-picker v-model="appointmentDate"
-        <el-date-picker
-          v-model="appointmentDate"
                         placeholder="预约日期"
-          value-format="yyyy-MM-dd"
+                        value-format="yyyy-MM-dd">
-        >
         </el-date-picker>
       </el-form-item>
     </el-form>
 
-    <el-table
+    <el-table v-if="tableData.length > 0"
-      v-if="tableData.length > 0"
               :data="tableData"
               border
               style="width: 96%; margin: 0 auto"
               class="resi-table"
-      :max-height="maxTableHeight"
+              :max-height="maxTableHeight">
-    >
+      <el-table-column label="序号"
-      <el-table-column label="序号" type="index" align="center" width="50" />
+                       type="index"
-      <el-table-column prop="matterName" label="预约事项"></el-table-column>
+                       align="center"
-      <el-table-column
+                       width="50" />
-        prop="appointmentTime"
+      <el-table-column prop="matterName"
-        label="预约时间"
+                       label="预约事项"></el-table-column>
-      ></el-table-column>
+      <el-table-column prop="appointmentTime"
-      <el-table-column prop="appointmentName" label="预约人"></el-table-column>
+                       label="预约时间"></el-table-column>
-      <el-table-column
+      <el-table-column prop="appointmentName"
-        prop="appointmentPhone"
+                       label="预约人"></el-table-column>
-        label="联系方式"
+      <el-table-column prop="appointmentPhone"
-      ></el-table-column>
+                       label="联系方式"></el-table-column>
-      <el-table-column prop="remark" label="备注"></el-table-column>
+      <el-table-column prop="remark"
-      <el-table-column fixed="right" label="操作" align="center" width="120">
+                       label="备注"></el-table-column>
+      <el-table-column fixed="right"
+                       label="操作"
+                       align="center"
+                       width="120">
         <template slot-scope="scope">
-          <el-button
+          <el-button @click="handleCancel(scope.$index)"
-            @click="handleCancel(scope.$index)"
                      type="text"
-            size="small"
+                     size="small">取消</el-button>
-            >取消</el-button
-          >
         </template>
       </el-table-column>
     </el-table>
 
-    <div class="m-hint" v-else>
+    <div class="m-hint"
-      <el-empty description="暂无内容" :image-size="200"></el-empty>
+         v-else>
+      <el-empty description="暂无内容"
+                :image-size="200"></el-empty>
     </div>
   </div>
 </template>

src/views/modules/communityService/dqfwzx/index.vue

@@ -98,6 +98,7 @@
                :title="formTitle"
                width="850px"
                top="5vh"
+               class="dialog-h"
                @closed="handleClose">
       <edit-form ref="eleEditForm"
                  @dialogCancle="handleClose"
@@ -111,6 +112,7 @@
                title="预约"
                width="850px"
                top="5vh"
+               class="dialog-h"
                @closed="handleCloseForm2">
       <order-form ref="eleOrderForm"
                   @dialogCancle="handleCloseForm2"
@@ -124,6 +126,7 @@
                title="预约记录"
                width="850px"
                top="5vh"
+               class="dialog-h"
                @closed="handleCloseOrderList">
       <order-list ref="eleOrderList"
                   @dialogCancle="handleCloseOrderList"></order-list>