guhongwei há 4 anos atrás
pai
commit
05a89d9ef7

+ 0 - 397
src/views/superAdminCenter/user copy/index.vue

@@ -1,397 +0,0 @@
-<template>
-  <div id="index">
-    <el-row>
-      <el-col :span="24">
-        <el-col :span="24" class="main">
-          <el-tabs v-model="activeName" type="card">
-            <el-tab-pane label="待审核" name="first">
-              <one :oneList="oneList" :total="onetotal" @handleDelete="handleDelete" @handleEdit="handleEdit1"></one>
-            </el-tab-pane>
-            <el-tab-pane label="审核成功" name="second">
-              <two :oneList="twoList" :total="twototal" @handleDelete="handleDelete" @handleEdit="handleEdit1"></two>
-            </el-tab-pane>
-            <el-tab-pane label="审核失败" name="third">
-              <three :oneList="threeList" :total="threetotal" @handleDelete="handleDelete" @handleEdit="handleEdit1"></three>
-            </el-tab-pane>
-          </el-tabs>
-        </el-col>
-        <el-dialog :title="theme" width="60%" :visible.sync="dialog" @closed="handleClose" :destroy-on-close="true">
-          <el-form ref="form" :model="form" label-width="100px">
-            <el-form-item label="用户状态" v-if="form.role !== '1'">
-              <el-radio-group v-model="form.status">
-                <el-radio label="0" disabled>已注册</el-radio>
-                <el-radio label="1">审核成功</el-radio>
-                <el-radio label="2">审核未通过</el-radio>
-              </el-radio-group>
-            </el-form-item>
-            <el-form-item label="用户名称" prop="name">
-              <el-input v-model="form.name" placeholder="请输入用户名称"></el-input>
-            </el-form-item>
-            <el-form-item label="用户ID" prop="phone">
-              <el-input v-model="form.phone" placeholder="请输入手机号" :minlength="11" :maxlength="11" disabled></el-input>
-            </el-form-item>
-            <el-form-item label="用户类别" prop="role">
-              <el-radio-group v-model="form.role" disabled>
-                <el-radio label="4">个人</el-radio>
-                <el-radio label="5">机构管理员</el-radio>
-                <el-radio label="6">专家</el-radio>
-              </el-radio-group>
-            </el-form-item>
-            <span v-if="form.role == '4' || form.role == '5'">
-              <el-form-item label="电子邮箱" prop="email">
-                <el-input v-model="form.email" placeholder="请输入电子邮箱"></el-input>
-              </el-form-item>
-              <el-form-item label="联系地址" prop="addr">
-                <el-input v-model="form.addr" placeholder="请输入联系地址"></el-input>
-              </el-form-item>
-              <el-form-item label="办公电话" prop="office_phone">
-                <el-input v-model="form.office_phone" placeholder="请输入办公电话"></el-input>
-              </el-form-item>
-              <el-form-item label="所属行业" prop="profession">
-                <el-input v-model="form.profession" placeholder="请输入所属行业"></el-input>
-              </el-form-item>
-            </span>
-            <!-- <span v-if="form.role == '4'">
-              <el-form-item label="个人简历" v-if="form.role == '4'">
-                <el-input type="textarea" v-model="form.resume" placeholder="请输入个人简介"></el-input>
-              </el-form-item>
-            </span> -->
-            <span v-if="form.role == '5'">
-              <el-form-item label="注册类型">
-                <el-input v-model="form.companytype" placeholder="请输入注册类型"></el-input>
-              </el-form-item>
-              <el-form-item label="注册时间">
-                <el-date-picker v-model="form.companydate" placeholder="请选择" value-format="yyyy-MM-dd" format="yyyy-MM-dd" type="date"> </el-date-picker>
-              </el-form-item>
-              <el-form-item label="统一社会信用代码">
-                <el-input v-model="form.institution_code" placeholder="请输入统一社会信用代码" disabled></el-input>
-              </el-form-item>
-              <el-form-item label="注册资金">
-                <el-input v-model="form.companycapital" placeholder="请输入注册资金"></el-input>
-              </el-form-item>
-              <el-form-item label="企业法人">
-                <el-input v-model="form.companyperson" placeholder="请输入企业法人"></el-input>
-              </el-form-item>
-              <el-form-item label="上年度企业总收入">
-                <el-input v-model="form.sndqyzsr" placeholder="请输入上年度企业总收入"></el-input>
-              </el-form-item>
-              <el-form-item label="上年度研发费用">
-                <el-input v-model="form.sndyffy" placeholder="请输入上年度研发费用"></el-input>
-              </el-form-item>
-              <el-form-item label="企业总人数">
-                <el-input v-model="form.companytotal" placeholder="请输入企业总人数"></el-input>
-              </el-form-item>
-              <el-form-item label="企业简介">
-                <el-input
-                  v-model="form.companybrief"
-                  type="textarea"
-                  maxlength="300"
-                  show-word-limit
-                  :autosize="{ minRows: 4, maxRows: 5 }"
-                  placeholder="请输入企业简介"
-                ></el-input>
-              </el-form-item>
-              <el-form-item label="主要产品">
-                <el-input
-                  v-model="form.mainproduct"
-                  type="textarea"
-                  maxlength="300"
-                  show-word-limit
-                  :autosize="{ minRows: 4, maxRows: 5 }"
-                  placeholder="请输入主要产品"
-                ></el-input>
-              </el-form-item>
-              <el-form-item label="企业资质/荣誉">
-                <el-input
-                  v-model="form.qualifications"
-                  type="textarea"
-                  maxlength="300"
-                  show-word-limit
-                  :autosize="{ minRows: 4, maxRows: 5 }"
-                  placeholder="请输入企业资质/荣誉"
-                ></el-input>
-              </el-form-item>
-            </span>
-            <span v-else-if="form.role == '6'">
-              <el-form-item label="头像">
-                <upload :limit="1" :data="form.expertimage" type="expertimage" :url="'/files/imgpath/upload'" @upload="uploadSuccess"></upload>
-              </el-form-item>
-              <el-form-item label="最高学历">
-                <el-input v-model="form.education" placeholder="请输入最高学历"></el-input>
-              </el-form-item>
-              <el-form-item label="毕业院校">
-                <el-input v-model="form.school" placeholder="请输入毕业院校"></el-input>
-              </el-form-item>
-              <el-form-item label="出生日期">
-                <el-date-picker v-model="form.birthDate" type="date" placeholder="选择日期" value-format="yyyy-MM-dd"> </el-date-picker>
-              </el-form-item>
-              <el-form-item label="QQ/微信">
-                <el-input v-model="form.qqwx" placeholder="请输入QQ/微信"></el-input>
-              </el-form-item>
-              <el-form-item label="电子邮箱">
-                <el-input v-model="form.email" placeholder="请输入电子邮箱"></el-input>
-              </el-form-item>
-              <el-form-item label="工作单位">
-                <el-input v-model="form.company" placeholder="请输入工作单位"></el-input>
-              </el-form-item>
-              <el-form-item label="职务职称">
-                <el-input v-model="form.zwzc" placeholder="请输入职务职称"></el-input>
-              </el-form-item>
-              <el-form-item label="擅长领域">
-                <el-input v-model="form.expertise" placeholder="请输入擅长领域"></el-input>
-              </el-form-item>
-              <el-form-item label="工作经历">
-                <el-input
-                  v-model="form.workexperience"
-                  type="textarea"
-                  maxlength="300"
-                  show-word-limit
-                  :autosize="{ minRows: 2, maxRows: 5 }"
-                  placeholder="请输入工作经历"
-                ></el-input>
-              </el-form-item>
-              <el-form-item label="科研综述">
-                <el-input
-                  v-model="form.scientific"
-                  type="textarea"
-                  maxlength="300"
-                  show-word-limit
-                  :autosize="{ minRows: 2, maxRows: 5 }"
-                  placeholder="请输入科研综述"
-                ></el-input>
-              </el-form-item>
-              <el-form-item label="承担项目">
-                <el-input
-                  v-model="form.undertakingproject"
-                  type="textarea"
-                  maxlength="300"
-                  show-word-limit
-                  :autosize="{ minRows: 2, maxRows: 5 }"
-                  placeholder="请输入承担项目"
-                ></el-input>
-              </el-form-item>
-              <el-form-item label="科技奖励">
-                <el-input
-                  v-model="form.scienceaward"
-                  type="textarea"
-                  maxlength="300"
-                  show-word-limit
-                  :autosize="{ minRows: 2, maxRows: 5 }"
-                  placeholder="请输入科技奖励"
-                ></el-input>
-              </el-form-item>
-              <el-form-item label="社会任职">
-                <el-input
-                  v-model="form.social"
-                  type="textarea"
-                  maxlength="300"
-                  show-word-limit
-                  :autosize="{ minRows: 2, maxRows: 5 }"
-                  placeholder="请输入社会任职"
-                ></el-input>
-              </el-form-item>
-            </span>
-            <el-form-item>
-              <el-button @click="handleClose">返回</el-button>
-              <el-button type="primary" @click="handleSave()">提交</el-button>
-            </el-form-item>
-          </el-form>
-        </el-dialog>
-      </el-col>
-    </el-row>
-  </div>
-</template>
-
-<script>
-import one from './parts/one.vue';
-import two from './parts/two.vue';
-import three from './parts/three.vue';
-import upload from '@/components/uploadone.vue';
-import dataTable from '@/components/data-table.vue';
-import { mapState, createNamespacedHelpers } from 'vuex';
-const { mapActions: users } = createNamespacedHelpers('users');
-const { mapActions: authUser } = createNamespacedHelpers('authUser');
-const { mapActions: expertsuser } = createNamespacedHelpers('expertsuser');
-export default {
-  name: 'index',
-  props: {},
-  components: {
-    // dataTable,
-    upload,
-    one,
-    two,
-    three,
-  },
-  data: function() {
-    return {
-      theme: '用戶',
-      activeName: 'first',
-      dialog: false,
-      // 个人,机构,专家信息
-      form: {},
-      // 提交时,需要的uid
-      editData: {},
-      // 待审核
-      oneList: [],
-      onetotal: 0,
-      // 审核成功
-      twoList: [],
-      twototal: 0,
-      // 审核失败
-      threeList: [],
-      threetotal: 0,
-    };
-  },
-  created() {
-    this.search();
-  },
-  methods: {
-    ...authUser({ authdelete: 'delete' }),
-    ...users(['fetch', 'create', 'query', 'update', 'delete', 'userquery']),
-    ...expertsuser({ exportuserFetch: 'fetch', exportuserCreate: 'create', exportuserUpdate: 'update', exportuserDelete: 'delete' }),
-    async search({ skip = 0, limit = 10, pid = '', ...info } = {}) {
-      if (this.user.code == 'JLCJGLY') {
-        const res = await this.userquery({ skip, limit: 20, ...info });
-        if (this.$checkRes(res)) {
-          let one = res.data.filter(i => i.status == '0' && i.isdel == '0');
-          if (one) {
-            this.$set(this, `oneList`, one);
-            this.$set(this, `onetotal`, one.length);
-          }
-          let two = res.data.filter(i => i.status == '1' && i.isdel == '0');
-          if (two) {
-            this.$set(this, `twototal`, two.length);
-            this.$set(this, `twoList`, two);
-          }
-          let three = res.data.filter(i => i.status == '2' && i.isdel == '0');
-          if (three) {
-            this.$set(this, `threeList`, three);
-            this.$set(this, `threetotal`, three.length);
-          }
-        }
-      } else {
-        const res = await this.userquery({ skip, pid, code: this.user.code, ...info });
-        if (this.$checkRes(res)) {
-          let one = res.data.filter(i => i.status == '0' && i.isdel == '0');
-          if (one) {
-            this.$set(this, `oneList`, one);
-            this.$set(this, `onetotal`, one.length);
-          }
-          let two = res.data.filter(i => i.status == '1' && i.isdel == '0');
-          if (two) {
-            this.$set(this, `twototal`, two.length);
-            this.$set(this, `twoList`, two);
-          }
-          let three = res.data.filter(i => i.status == '2' && i.isdel == '0');
-          if (three) {
-            this.$set(this, `threeList`, three);
-            this.$set(this, `threetotal`, three.length);
-          }
-        }
-      }
-    },
-    // 审核打开
-    async handleEdit1(data) {
-      if (data.role == '4' || data.role == '5') {
-        let res = await this.fetch(data.uid);
-        if (this.$checkRes(res)) {
-          this.$set(this, `form`, res.data);
-        }
-      } else {
-        let res = await this.exportuserFetch(data.uid);
-        if (this.$checkRes(res)) {
-          this.$set(this, `form`, res.data);
-        }
-      }
-      this.$set(this, `editData`, data);
-      this.dialog = true;
-    },
-    // 提交
-    async handleSave() {
-      let data = this.form;
-      if (data.role == '4' || data.role == '5') {
-        data.id = this.editData.uid;
-        let res = await this.update(data);
-        if (this.$checkRes(res)) {
-          this.$message({
-            message: '审核信息成功',
-            type: 'success',
-          });
-          this.handleClose();
-        }
-      } else if (data.role == '6') {
-        data.id = this.editData.uid;
-        let res = await this.exportuserUpdate(data);
-        if (this.$checkRes(res)) {
-          this.$message({
-            message: '审核信息成功',
-            type: 'success',
-          });
-          this.handleClose();
-        }
-      }
-    },
-    // 刪除
-    async handleDelete(data) {
-      this.$confirm('您确定要删除此信息吗?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning',
-      })
-        .then(async () => {
-          if (data.role == '4' || data.role == '5') {
-            let res = await this.delete(data.uid);
-            if (this.$checkRes(res)) {
-              res = await this.authdelete(data.id);
-              if (this.$checkRes(res)) {
-                this.$message({
-                  message: '删除信息成功',
-                  type: 'success',
-                });
-                this.search();
-              }
-            }
-          } else {
-            let res = await this.exportuserDelete(data.uid);
-            if (this.$checkRes(res)) {
-              res = await this.authdelete(data.id);
-              if (this.$checkRes(res)) {
-                this.$message({
-                  message: '删除信息成功',
-                  type: 'success',
-                });
-                this.search();
-              }
-            }
-          }
-        })
-        .catch(() => {});
-    },
-    // 取消
-    handleClose() {
-      this.dialog = false;
-      this.form = {};
-    },
-    // 图片
-    uploadSuccess({ type, data }) {
-      this.$set(this.form, `${type}`, data.uri);
-    },
-    setIsQy(data) {
-      let val = '0';
-      data == '2' ? (val = '0') : (val = '1');
-      this.$set(this.form, `is_qy`, val);
-    },
-  },
-  computed: {
-    ...mapState(['user']),
-    pageTitle() {
-      return `${this.$route.meta.title}`;
-    },
-  },
-  metaInfo() {
-    return { title: this.$route.meta.title };
-  },
-};
-</script>
-
-<style lang="less" scoped></style>

+ 0 - 103
src/views/superAdminCenter/user copy/parts/one.vue

@@ -1,103 +0,0 @@
-<template>
-  <div id="one">
-    <el-row>
-      <el-col :span="24">
-        <el-table :data="list" style="width: 100%" border>
-          <el-table-column prop="name" label="用户名称" align="center"> </el-table-column>
-          <el-table-column prop="phone" label="用户ID" align="center"> </el-table-column>
-          <el-table-column label="用户类型" align="center">
-            <template v-slot="scoped">
-              {{ `${scoped.row.role}` == `4` ? '个人用户' : `${scoped.row.role}` == `5` ? '机构用户' : `${scoped.row.role}` == `6` ? '专家用户' : '临时用户' }}
-            </template>
-          </el-table-column>
-          <el-table-column label="状态" align="center">
-            <template v-slot="scoped">
-              {{ `${scoped.row.status}` == `0` ? '审核中' : `${scoped.row.status}` == `1` ? '审核通过' : `${scoped.row.status}` == `2` ? '审核拒绝' : '草稿' }}
-            </template>
-          </el-table-column>
-          <el-table-column fixed="right" label="操作" align="center">
-            <template slot-scope="scoped">
-              <el-tooltip content="审核" placement="bottom" effect="light">
-                <el-button type="text" size="small" @click="handleEdit(scoped.row)"><i class="el-icon-view"></i></el-button>
-              </el-tooltip>
-              <el-tooltip content="删除" placement="bottom" effect="light">
-                <el-button type="text" size="small" @click="handleDelete(scoped.row)"><i class="el-icon-delete"></i></el-button>
-              </el-tooltip>
-            </template>
-          </el-table-column>
-        </el-table>
-        <el-col :span="24" class="page">
-          <el-pagination
-            @current-change="handleCurrentChange"
-            :current-page="currentPage"
-            layout="total, prev, pager, next, jumper"
-            :total="total"
-            :page-size="pageSize"
-          >
-          </el-pagination>
-        </el-col>
-      </el-col>
-    </el-row>
-  </div>
-</template>
-
-<script>
-import { mapState, createNamespacedHelpers } from 'vuex';
-export default {
-  name: 'one',
-  props: {
-    oneList: { type: Array, default: () => [] },
-    total: { type: Number, default: 0 },
-  },
-  components: {},
-  data: function() {
-    return {
-      currentPage: 1,
-      pageSize: 10,
-      origin: [],
-      list: [],
-    };
-  },
-  created() {},
-  methods: {
-    search(page = 1) {
-      this.$set(this, `list`, this.origin[page - 1]);
-    },
-    handleCurrentChange(currentPage) {
-      this.search(currentPage);
-    },
-    handleEdit(data) {
-      this.$emit('handleEdit', data);
-    },
-    handleDelete(data) {
-      this.$emit('handleDelete', data);
-    },
-  },
-  computed: {
-    ...mapState(['user']),
-    pageTitle() {
-      return `${this.$route.meta.title}`;
-    },
-  },
-  metaInfo() {
-    return { title: this.$route.meta.title };
-  },
-  watch: {
-    oneList: {
-      immediate: true,
-      deep: true,
-      handler(val) {
-        if (val && val.length > 0) this.$set(this, `origin`, _.chunk(val, this.pageSize));
-        this.search();
-      },
-    },
-  },
-};
-</script>
-
-<style lang="less" scoped>
-.page {
-  text-align: center;
-  padding: 15px 0;
-}
-</style>

+ 0 - 103
src/views/superAdminCenter/user copy/parts/three.vue

@@ -1,103 +0,0 @@
-<template>
-  <div id="one">
-    <el-row>
-      <el-col :span="24">
-        <el-table :data="list" style="width: 100%" border>
-          <el-table-column prop="name" label="用户名称" align="center"> </el-table-column>
-          <el-table-column prop="phone" label="用户ID" align="center"> </el-table-column>
-          <el-table-column label="用户类型" align="center">
-            <template v-slot="scoped">
-              {{ `${scoped.row.role}` == `4` ? '个人用户' : `${scoped.row.role}` == `5` ? '机构用户' : `${scoped.row.role}` == `6` ? '专家用户' : '临时用户' }}
-            </template>
-          </el-table-column>
-          <el-table-column label="状态" align="center">
-            <template v-slot="scoped">
-              {{ `${scoped.row.status}` == `0` ? '审核中' : `${scoped.row.status}` == `1` ? '审核通过' : `${scoped.row.status}` == `2` ? '审核拒绝' : '草稿' }}
-            </template>
-          </el-table-column>
-          <el-table-column fixed="right" label="操作" align="center">
-            <template slot-scope="scoped">
-              <el-tooltip content="审核" placement="bottom" effect="light">
-                <el-button type="text" size="small" @click="handleEdit(scoped.row)"><i class="el-icon-view"></i></el-button>
-              </el-tooltip>
-              <el-tooltip content="删除" placement="bottom" effect="light">
-                <el-button type="text" size="small" @click="handleDelete(scoped.row)"><i class="el-icon-delete"></i></el-button>
-              </el-tooltip>
-            </template>
-          </el-table-column>
-        </el-table>
-        <el-col :span="24" class="page">
-          <el-pagination
-            @current-change="handleCurrentChange"
-            :current-page="currentPage"
-            layout="total, prev, pager, next, jumper"
-            :total="total"
-            :page-size="pageSize"
-          >
-          </el-pagination>
-        </el-col>
-      </el-col>
-    </el-row>
-  </div>
-</template>
-
-<script>
-import { mapState, createNamespacedHelpers } from 'vuex';
-export default {
-  name: 'one',
-  props: {
-    oneList: { type: Array, default: () => [] },
-    total: { type: Number, default: 0 },
-  },
-  components: {},
-  data: function() {
-    return {
-      currentPage: 1,
-      pageSize: 10,
-      origin: [],
-      list: [],
-    };
-  },
-  created() {},
-  methods: {
-    search(page = 1) {
-      this.$set(this, `list`, this.origin[page - 1]);
-    },
-    handleCurrentChange(currentPage) {
-      this.search(currentPage);
-    },
-    handleEdit(data) {
-      this.$emit('handleEdit', data);
-    },
-    handleDelete(data) {
-      this.$emit('handleDelete', data);
-    },
-  },
-  computed: {
-    ...mapState(['user']),
-    pageTitle() {
-      return `${this.$route.meta.title}`;
-    },
-  },
-  metaInfo() {
-    return { title: this.$route.meta.title };
-  },
-  watch: {
-    oneList: {
-      immediate: true,
-      deep: true,
-      handler(val) {
-        if (val && val.length > 0) this.$set(this, `origin`, _.chunk(val, this.pageSize));
-        this.search();
-      },
-    },
-  },
-};
-</script>
-
-<style lang="less" scoped>
-.page {
-  text-align: center;
-  padding: 15px 0;
-}
-</style>

+ 0 - 103
src/views/superAdminCenter/user copy/parts/two.vue

@@ -1,103 +0,0 @@
-<template>
-  <div id="one">
-    <el-row>
-      <el-col :span="24">
-        <el-table :data="list" style="width: 100%" border>
-          <el-table-column prop="name" label="用户名称" align="center"> </el-table-column>
-          <el-table-column prop="phone" label="用户ID" align="center"> </el-table-column>
-          <el-table-column label="用户类型" align="center">
-            <template v-slot="scoped">
-              {{ `${scoped.row.role}` == `4` ? '个人用户' : `${scoped.row.role}` == `5` ? '机构用户' : `${scoped.row.role}` == `6` ? '专家用户' : '临时用户' }}
-            </template>
-          </el-table-column>
-          <el-table-column label="状态" align="center">
-            <template v-slot="scoped">
-              {{ `${scoped.row.status}` == `0` ? '审核中' : `${scoped.row.status}` == `1` ? '审核通过' : `${scoped.row.status}` == `2` ? '审核拒绝' : '草稿' }}
-            </template>
-          </el-table-column>
-          <el-table-column fixed="right" label="操作" align="center">
-            <template slot-scope="scoped">
-              <el-tooltip content="审核" placement="bottom" effect="light">
-                <el-button type="text" size="small" @click="handleEdit(scoped.row)"><i class="el-icon-view"></i></el-button>
-              </el-tooltip>
-              <el-tooltip content="删除" placement="bottom" effect="light">
-                <el-button type="text" size="small" @click="handleDelete(scoped.row)"><i class="el-icon-delete"></i></el-button>
-              </el-tooltip>
-            </template>
-          </el-table-column>
-        </el-table>
-        <el-col :span="24" class="page">
-          <el-pagination
-            @current-change="handleCurrentChange"
-            :current-page="currentPage"
-            layout="total, prev, pager, next, jumper"
-            :total="total"
-            :page-size="pageSize"
-          >
-          </el-pagination>
-        </el-col>
-      </el-col>
-    </el-row>
-  </div>
-</template>
-
-<script>
-import { mapState, createNamespacedHelpers } from 'vuex';
-export default {
-  name: 'one',
-  props: {
-    oneList: { type: Array, default: () => [] },
-    total: { type: Number, default: 0 },
-  },
-  components: {},
-  data: function() {
-    return {
-      currentPage: 1,
-      pageSize: 10,
-      origin: [],
-      list: [],
-    };
-  },
-  created() {},
-  methods: {
-    search(page = 1) {
-      this.$set(this, `list`, this.origin[page - 1]);
-    },
-    handleCurrentChange(currentPage) {
-      this.search(currentPage);
-    },
-    handleEdit(data) {
-      this.$emit('handleEdit', data);
-    },
-    handleDelete(data) {
-      this.$emit('handleDelete', data);
-    },
-  },
-  computed: {
-    ...mapState(['user']),
-    pageTitle() {
-      return `${this.$route.meta.title}`;
-    },
-  },
-  metaInfo() {
-    return { title: this.$route.meta.title };
-  },
-  watch: {
-    oneList: {
-      immediate: true,
-      deep: true,
-      handler(val) {
-        if (val && val.length > 0) this.$set(this, `origin`, _.chunk(val, this.pageSize));
-        this.search();
-      },
-    },
-  },
-};
-</script>
-
-<style lang="less" scoped>
-.page {
-  text-align: center;
-  padding: 15px 0;
-}
-</style>