Bläddra i källkod

feat: develop config page

wangyuan 2 år sedan
förälder
incheckning
462aad5ff6

+ 2 - 2
ittpc/src/views/modules/appointment/appointment.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="user-page-query" v-loading="loading" element-loading-text="加载中" element-loading-spinner="el-icon-loading">
+  <div class="appointment-page" v-loading="loading" element-loading-text="加载中" element-loading-spinner="el-icon-loading">
     <el-row>
       <el-col :span="24" class="padding20">
         <el-form :inline="true" :model="searchForm" class="demo-form-inline" size="small">
@@ -114,7 +114,7 @@ export default {
 </script>
 
 <style scoped lang="scss">
-.user-page-query {
+.appointment-page {
   width: 100%;
   height: 100%;
   .padding20 {

+ 110 - 13
ittpc/src/views/modules/config/config.vue

@@ -1,26 +1,123 @@
 <template>
-    <div>
-      config mansge
-    </div>
+  <div class="config-page" v-loading="loading" element-loading-text="加载中" element-loading-spinner="el-icon-loading">
+    <el-row>
+      <el-col :span="24" style="padding:0 20px;">
+        <h3>地区维护+预约次数配置</h3>
+      </el-col>
+    </el-row>
+    <el-row>
+      <el-col :span="24" style="padding:0 20px;">
+        <el-table :data="tableData" border stripe style="width: 100%" size="small" max-height="700">
+          <el-table-column prop="province" label="省"></el-table-column>
+          <el-table-column prop="city" label="市"></el-table-column>
+          <el-table-column prop="county" label="区"></el-table-column>
+          <el-table-column prop="status" label="状态"></el-table-column>
+          <el-table-column prop="times" label="预约次数配置">
+            <template slot-scope="scope">
+              <el-button type="text" size="small" @click="handleEdit(scope.row)">编辑</el-button>
+              <el-button type="text" size="small" @click="handleView(scope.row)">查看</el-button>
+            </template>
+          </el-table-column>
+          <el-table-column label="操作">
+            <template slot-scope="scope">
+              <el-button type="text" size="small" @click="handleOpen(scope.row)">开启</el-button>
+              <el-button type="text" size="small" @click="handleClose(scope.row)">关闭</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+      </el-col>
+    </el-row>
+    <el-dialog :title=" isEdit ? '编辑预约次数' : '查看预约次数'" :visible.sync="dialogVisible" width="35%">
+      <h3>浙江省杭州市上城区:</h3>
+      <div class="8-12 dialog-item">
+        <span>08:00-12:00,预约</span>
+        <el-input-number :disabled="!isEdit" v-model="firstVal" size="small" class="num-input" controls-position="right" :min="1" :max="1000"></el-input-number>
+        <span>次</span>
+      </div>
+      <div class="13-18 dialog-item">
+        <span>13:00-18:00,预约</span>
+        <el-input-number :disabled="!isEdit" v-model="secendVal" size="small" class="num-input" controls-position="right" :min="1" :max="1000"></el-input-number>
+        <span>次</span>
+      </div>
+      <div class="19-21 dialog-item">
+        <span>19:00-21:00,预约</span>
+        <el-input-number :disabled="!isEdit" v-model="threeVal" size="small" class="num-input" controls-position="right" :min="1" :max="1000"></el-input-number>
+        <span>次</span>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="dialogVisible = false" size="small" style="width:100px;">取 消</el-button>
+        <el-button type="primary" @click="dialogVisible = false" size="small" style="width:100px;">确 定</el-button>
+      </span>
+    </el-dialog>
+  </div>
 </template>
 
 <script>
 export default {
-    name: 'config',
-    data() {
-        return {
+  name: 'config',
+  data() {
+    return {
+      loading: false,
+      dialogVisible: false,
+      tableData: [
+        {
+          province: '河南省',
+          city: '信阳市',
+          county: '固始县'
+        }
+      ],
+      isEdit: false,
+      firstVal: '',
+      secendVal: '',
+      threeVal: ''
+    };
+  },
+  mounted() {
 
-        };
+  },
+  methods: {
+    handleOpen () {
+      this.$confirm('确定开启吗?').then( _=> {
+        console.log('ok')
+      }).catch(_ => {});
     },
-    mounted() {
-
+    handleClose () {
+      this.$confirm('确定关闭吗?').then( _=> {
+        console.log('ok')
+      }).catch(_ => {});
     },
-    methods: {
-
+    handleView () {
+      this.dialogVisible = true
+      this.isEdit = false
     },
+    handleEdit () {
+      this.dialogVisible = true
+      this.isEdit = true
+    }
+  },
 };
 </script>
 
-<style scoped>
-
+<style scoped lang="scss">
+.config-page {
+  width: 100%;
+  height: 100%;
+  .dialog-item {
+    width: 100%;
+    height: 50px;
+    display: flex;
+    align-items: center;
+    justify-content: flex-start;
+    .num-input {
+      width: 100px;
+      margin: 0 10px;
+    }
+  }
+  .dialog-footer {
+    width: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+}
 </style>

+ 2 - 2
ittpc/src/views/modules/main.vue

@@ -60,7 +60,7 @@ export default {
       sessionStorage.setItem('currentPath', index)
     },
     handleLogout () {
-      this.$confirm('确退出吗?').then( _=> {
+      this.$confirm('确退出吗?').then( _=> {
         sessionStorage.clear()
         this.$router.replace('/login')
       }).catch(_ => {});
@@ -76,7 +76,7 @@ export default {
   
 }
 .el-header {
-  background-color: #D3DCE6;
+  background-color:  #fff; //#D3DCE6;
   color: #333;
   display: flex;
   justify-content: space-between;