1

src/layout/scientific/learning/info-1.vue

@@ -0,0 +1,57 @@
+<template>
+  <div id="info-1">
+    <van-row>
+      <van-col span="24" class="main">
+        <van-col span="24" class="one">
+          <van-form label-width="4em">
+            <van-field v-model="info.name" name="name" label="姓名" readonly />
+            <van-field v-model="info.age" name="age" label="年龄" readonly />
+            <van-field v-model="info.unit" name="unit" label="单位" type="textarea" autosize rows="1" readonly />
+            <van-field v-model="info.job" name="job" label="职务" readonly />
+            <van-field v-model="info.title" name="title" label="职称" readonly />
+            <van-field v-model="info.directionId" name="directionId" label="研究方向" autosize rows="1" readonly />
+          </van-form>
+        </van-col>
+      </van-col>
+    </van-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'info-1',
+  props: {
+    info: { type: Object },
+  },
+  components: {},
+  data: function () {
+    return {};
+  },
+  created() {},
+  methods: {},
+  computed: {
+    ...mapState(['user']),
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+  watch: {
+    test: {
+      deep: true,
+      immediate: true,
+      handler(val) {},
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.main {
+  .one {
+    .van-divider {
+      margin: 10px 0;
+    }
+  }
+}
+</style>

src/layout/scientific/learning/list-1.vue

@@ -0,0 +1,91 @@
+<template>
+  <div id="list-1">
+    <van-row>
+      <van-col span="24" class="main">
+        <van-col span="24" class="list" v-for="(item, index) in list" :key="index">
+          <van-col span="24" class="title textOver">
+            {{ item.name }}
+          </van-col>
+          <van-col span="24" class="other">
+            <van-col span="24" class="otherInfo">
+              单位：<span>{{ item.unit || '暂无' }}</span>
+            </van-col>
+            <van-col span="24" class="otherInfo">
+              研究方向：<span>{{ item.directionId || '暂无' }}</span>
+            </van-col>
+          </van-col>
+          <van-col span="24" class="btn">
+            <van-button type="info" size="small" @click="toView(item)">详细信息</van-button>
+          </van-col>
+        </van-col>
+      </van-col>
+    </van-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'list-1',
+  props: {
+    list: { type: Array },
+  },
+  components: {},
+  data: function () {
+    return {};
+  },
+  created() {},
+  methods: {
+    // 查看详情
+    toView(data) {
+      this.$emit('toView', data);
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+  watch: {
+    test: {
+      deep: true,
+      immediate: true,
+      handler(val) {},
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.main {
+  .list {
+    background-color: #fff;
+    margin: 0 0 8px 0;
+    padding: 8px;
+    border-radius: 5px;
+    .title {
+      font-size: 16px;
+      font-weight: bold;
+      margin: 0 0 5px 0;
+    }
+    .other {
+      margin: 0 0 5px 0;
+      .otherInfo {
+        font-size: 14px;
+        color: #666;
+        margin: 0 0 5px 0;
+        span {
+          color: #000;
+        }
+      }
+    }
+    .btn {
+      text-align: center;
+      .van-button {
+        margin: 0 5px;
+      }
+    }
+  }
+}
+</style>

src/layout/scientific/learning/search-1.vue

@@ -0,0 +1,71 @@
+<template>
+  <div id="search-1">
+    <van-row>
+      <van-col span="24" class="main">
+        <van-col span="24" class="one">
+          <van-form label-width="4em">
+            <van-field v-model="form.name" name="name" label="姓名" placeholder="请输入姓名" />
+            <van-field v-model="form.age" name="age" label="年龄" placeholder="请输入年龄" />
+            <van-field v-model="form.unit" name="unit" label="单位" placeholder="请输入单位" />
+            <van-field v-model="form.job" name="job" label="职务" placeholder="请输入职务" />
+            <van-field v-model="form.title" name="title" label="职称" placeholder="请输入职称" />
+            <van-field v-model="form.directionId" name="directionId" label="研究方向" placeholder="请输入研究方向" />
+            <div class="btn">
+              <van-button type="info" size="small" @click="reseat">重置条件</van-button>
+              <van-button type="primary" size="small" @click="onSubmit">提交查询</van-button>
+            </div>
+          </van-form>
+        </van-col>
+      </van-col>
+    </van-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+const moment = require('moment');
+export default {
+  name: 'search-1',
+  props: { form: { type: Object } },
+  components: {},
+  data: function () {
+    return {};
+  },
+  created() {},
+  methods: {
+    reseat() {
+      this.$emit('reseat');
+    },
+    onSubmit() {
+      this.$emit('onSubmit', { data: this.form });
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+  watch: {
+    test: {
+      deep: true,
+      immediate: true,
+      handler(val) {},
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.main {
+  .one {
+    .btn {
+      text-align: center;
+      margin: 10px 0;
+      .van-button {
+        margin: 0 5px;
+      }
+    }
+  }
+}
+</style>

src/layout/scientific/task/info-1.vue

@@ -0,0 +1,57 @@
+<template>
+  <div id="info-1">
+    <van-row>
+      <van-col span="24" class="main">
+        <van-col span="24" class="one">
+          <van-form label-width="4em">
+            <van-field v-model="info.name" name="name" label="姓名" readonly />
+            <van-field v-model="info.age" name="age" label="年龄" readonly />
+            <van-field v-model="info.unit" name="unit" label="单位" type="textarea" autosize rows="1" readonly />
+            <van-field v-model="info.job" name="job" label="职务" readonly />
+            <van-field v-model="info.title" name="title" label="职称" readonly />
+            <van-field v-model="info.directionId" name="directionId" label="研究方向" autosize rows="1" readonly />
+          </van-form>
+        </van-col>
+      </van-col>
+    </van-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'info-1',
+  props: {
+    info: { type: Object },
+  },
+  components: {},
+  data: function () {
+    return {};
+  },
+  created() {},
+  methods: {},
+  computed: {
+    ...mapState(['user']),
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+  watch: {
+    test: {
+      deep: true,
+      immediate: true,
+      handler(val) {},
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.main {
+  .one {
+    .van-divider {
+      margin: 10px 0;
+    }
+  }
+}
+</style>

src/layout/scientific/task/list-1.vue

@@ -0,0 +1,91 @@
+<template>
+  <div id="list-1">
+    <van-row>
+      <van-col span="24" class="main">
+        <van-col span="24" class="list" v-for="(item, index) in list" :key="index">
+          <van-col span="24" class="title textOver">
+            {{ item.name }}
+          </van-col>
+          <van-col span="24" class="other">
+            <van-col span="24" class="otherInfo">
+              单位：<span>{{ item.unit || '暂无' }}</span>
+            </van-col>
+            <van-col span="24" class="otherInfo">
+              研究方向：<span>{{ item.directionId || '暂无' }}</span>
+            </van-col>
+          </van-col>
+          <van-col span="24" class="btn">
+            <van-button type="info" size="small" @click="toView(item)">详细信息</van-button>
+          </van-col>
+        </van-col>
+      </van-col>
+    </van-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'list-1',
+  props: {
+    list: { type: Array },
+  },
+  components: {},
+  data: function () {
+    return {};
+  },
+  created() {},
+  methods: {
+    // 查看详情
+    toView(data) {
+      this.$emit('toView', data);
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+  watch: {
+    test: {
+      deep: true,
+      immediate: true,
+      handler(val) {},
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.main {
+  .list {
+    background-color: #fff;
+    margin: 0 0 8px 0;
+    padding: 8px;
+    border-radius: 5px;
+    .title {
+      font-size: 16px;
+      font-weight: bold;
+      margin: 0 0 5px 0;
+    }
+    .other {
+      margin: 0 0 5px 0;
+      .otherInfo {
+        font-size: 14px;
+        color: #666;
+        margin: 0 0 5px 0;
+        span {
+          color: #000;
+        }
+      }
+    }
+    .btn {
+      text-align: center;
+      .van-button {
+        margin: 0 5px;
+      }
+    }
+  }
+}
+</style>

src/layout/scientific/task/search-1.vue

@@ -0,0 +1,73 @@
+<template>
+  <div id="search-1">
+    <van-row>
+      <van-col span="24" class="main">
+        <van-col span="24" class="one">
+          <van-form label-width="4em">
+            <van-field v-model="form.name" name="name" label="项目(课题)名称" placeholder="请输入项目(课题)名称" />
+            <van-field v-model="form.name" name="name" label="项目来源" placeholder="请输入项目来源" />
+            <van-field v-model="form.name" name="name" label="项目(课题)编号" placeholder="请输入项目(课题)编号" />
+            <van-field v-model="form.name" name="name" label="经费(万元)" placeholder="请输入经费(万元)" />
+            <van-field v-model="form.name" name="name" label="负责人" placeholder="请输入负责人" />
+            <van-field v-model="form.name" name="name" label="所属研究方向" placeholder="请输入所属研究方向" />
+            <van-field v-model="form.name" name="name" label="合作单位" placeholder="请输入合作单位" />
+            <van-field v-model="form.name" name="name" label="转化效益(万元)" placeholder="请输入转化效益(万元)" />
+            <div class="btn">
+              <van-button type="info" size="small" @click="reseat">重置条件</van-button>
+              <van-button type="primary" size="small" @click="onSubmit">提交查询</van-button>
+            </div>
+          </van-form>
+        </van-col>
+      </van-col>
+    </van-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+const moment = require('moment');
+export default {
+  name: 'search-1',
+  props: { form: { type: Object } },
+  components: {},
+  data: function () {
+    return {};
+  },
+  created() {},
+  methods: {
+    reseat() {
+      this.$emit('reseat');
+    },
+    onSubmit() {
+      this.$emit('onSubmit', { data: this.form });
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+  watch: {
+    test: {
+      deep: true,
+      immediate: true,
+      handler(val) {},
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.main {
+  .one {
+    .btn {
+      text-align: center;
+      margin: 10px 0;
+      .van-button {
+        margin: 0 5px;
+      }
+    }
+  }
+}
+</style>

src/router/index.js

@@ -37,17 +37,17 @@ const scientific = [
   },
   {
     path: '/scientific/personnel/index',
-    meta: { title: '主任及科研助理信息展示' },
+    meta: { title: '主任及科研助理信息列表' },
     component: () => import('../views/scientific/personnel/index.vue'),
   },
   {
     path: '/scientific/learning/index',
-    meta: { title: '学术委员会信息展示' },
+    meta: { title: '学术委员会' },
     component: () => import('../views/scientific/learning/index.vue'),
   },
   {
     path: '/scientific/task/index',
-    meta: { title: '承担科研任务信息展示' },
+    meta: { title: '实验室建设期内承担项目明细' },
     component: () => import('../views/scientific/task/index.vue'),
   },
   {

src/views/scientific/index.vue

@@ -4,16 +4,14 @@
       <template v-slot:info>
         <van-col span="24" class="one">
           <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
-            <van-swipe-item>1</van-swipe-item>
-            <van-swipe-item>2</van-swipe-item>
-            <van-swipe-item>3</van-swipe-item>
-            <van-swipe-item>4</van-swipe-item>
+            <van-swipe-item v-for="(item, index) in imageList" :key="index">
+              <van-image :src="item.url"></van-image>
+            </van-swipe-item>
           </van-swipe>
         </van-col>
         <van-col span="24" class="two">
           <van-grid :gutter="5">
             <van-grid-item class="list" v-for="(item, index) in menu" :key="index" :to="item.router">
-              <i :class="['iconfont', item.icon]"></i>
               <p>{{ item.label }}</p>
             </van-grid-item>
           </van-grid>
@@ -34,14 +32,16 @@ export default {
   },
   data: function () {
     return {
+      // 轮播图
+      imageList: [{ url: require('@a/scientific/image1.jpg') }, { url: require('@a/scientific/image2.jpg') }, { url: require('@a/scientific/image3.jpg') }],
       menu: [
-        { icon: 'icon-shouye', label: '主任及科研助理', router: '/scientific/personnel/index' },
-        { icon: 'icon-shouye', label: '学术委员会', router: '/scientific/learning/index' },
-        { icon: 'icon-shouye', label: '承担科研任务', router: '/scientific/task/index' },
-        { icon: 'icon-shouye', label: '获奖信息', router: '/scientific/award/index' },
-        { icon: 'icon-shouye', label: '论文发表', router: '/scientific/paper/index' },
-        { icon: 'icon-shouye', label: '成果展示', router: '/scientific/achieve/index' },
-        { icon: 'icon-shouye', label: '其他成果', router: '/scientific/otherachieve/index' },
+        { label: '主任/助理', router: '/scientific/personnel/index' },
+        { label: '委员会', router: '/scientific/learning/index' },
+        { label: '科研任务', router: '/scientific/task/index' },
+        { label: '获奖信息', router: '/scientific/award/index' },
+        { label: '论文发表', router: '/scientific/paper/index' },
+        { label: '成果展示', router: '/scientific/achieve/index' },
+        { label: '其他成果', router: '/scientific/otherachieve/index' },
       ],
     };
   },
@@ -68,14 +68,16 @@ export default {
   height: 200px;
   background-color: #fff;
   margin: 0 0 5px 0;
+  .van-swipe {
+    height: 200px;
+    overflow: hidden;
+  }
 }
 .two {
   .list {
-    height: 90px;
-    i {
-      margin: 0 0 5px 0;
-    }
+    height: 80px;
     p {
+      color: #fff;
       font-size: 14px;
       padding: 0px 5px;
       text-align: center;
@@ -86,9 +88,44 @@ export default {
       display: -webkit-box;
       -webkit-box-orient: vertical;
     }
+    /deep/.van-grid-item__content {
+      border-radius: 10px;
+    }
+  }
+  .list:nth-child(1) {
+    /deep/.van-grid-item__content {
+      background-color: #ffc0cb;
+    }
+  }
+  .list:nth-child(2) {
+    /deep/.van-grid-item__content {
+      background-color: #ee82ee;
+    }
+  }
+  .list:nth-child(3) {
+    /deep/.van-grid-item__content {
+      background-color: #7b68ee;
+    }
+  }
+  .list:nth-child(4) {
+    /deep/.van-grid-item__content {
+      background-color: #4169e1;
+    }
+  }
+  .list:nth-child(5) {
+    /deep/.van-grid-item__content {
+      background-color: #00bfff;
+    }
+  }
+  .list:nth-child(6) {
+    /deep/.van-grid-item__content {
+      background-color: #48d1cc;
+    }
   }
-  /deep/.van-grid-item__content {
-    border-radius: 10px;
+  .list:nth-child(7) {
+    /deep/.van-grid-item__content {
+      background-color: #98fb98;
+    }
   }
 }
 </style>

src/views/scientific/learning/index.vue

@@ -1,22 +1,97 @@
 <template>
   <div id="index">
-    <van-row>
-      <van-col span="24" class="main"> test </van-col>
-    </van-row>
+    <admin-frame @search="search" :limit="limit" :total="total" topType="2" @back="back" @add="toAdd" :useNav="false">
+      <template v-slot:info>
+        <list-1 :list="list" @toView="toView"></list-1>
+      </template>
+    </admin-frame>
+    <van-dialog class="dialog" v-model="dialog.show" :title="dialog.title" :show-confirm-button="false" show-cancel-button cancel-button-text="返回">
+      <info-1 :info="info" v-if="dialog.type == '1'"></info-1>
+      <search-1 :form="searhForm" v-else-if="dialog.type == '2'" @reseat="reseat" @onSubmit="onSubmit"></search-1>
+    </van-dialog>
   </div>
 </template>
 
 <script>
+import list1 from '@/layout/scientific/learning/list-1.vue';
+import info1 from '@/layout/scientific/learning/info-1.vue';
+import search1 from '@/layout/scientific/learning/search-1.vue';
+import adminFrame from '@common/src/components/mobile-frame/mobile-main.vue';
 import { mapState, createNamespacedHelpers } from 'vuex';
 export default {
   name: 'index',
   props: {},
-  components: {},
+  components: {
+    adminFrame,
+    list1,
+    info1,
+    search1,
+  },
   data: function () {
-    return {};
+    return {
+      list: [
+        {
+          age: null,
+          createBy: '1',
+          createTime: '2021-09-17 13:36:25',
+          delFlag: '0',
+          directionId: '生物钟异常与癫痫病机理',
+          id: 'c6c020e1d88643f59db9a2f7b0c533cb',
+          job: null,
+          name: '李培军',
+          params: {},
+          remark: null,
+          searchValue: null,
+          title: null,
+          type: '2',
+          unit: '温州医科大学附属第二医院、育英儿童医院',
+          updateBy: null,
+          updateTime: null,
+        },
+      ],
+      total: 0,
+      limit: 5,
+      // 查询
+      searhForm: {},
+      // 弹框
+      dialog: { show: false, title: '详细信息', type: '1' },
+      // 详细信息
+      info: {},
+    };
+  },
+  async created() {
+    await this.search();
+  },
+  methods: {
+    async search({ skip = 0, limit = this.limit, searchName, ...info } = {}) {
+      if (searchName) info.name = searchName;
+      console.log(this.searhForm);
+    },
+    // 查看信息
+    async toView(data) {
+      this.$set(this, `info`, data);
+      this.dialog = { show: true, title: '详细信息', type: '1' };
+    },
+    // 添加查询条件
+    toAdd() {
+      this.dialog = { show: true, title: '查询条件', type: '2' };
+    },
+    // 重置条件
+    reseat() {
+      this.searhForm = {};
+      this.dialog = { show: false, title: '查询条件', type: '2' };
+      this.search();
+    },
+    // 提交查询
+    onSubmit({ data }) {
+      this.search(data);
+      this.dialog = { show: false, title: '查询条件', type: '2' };
+    },
+    // 返回
+    back() {
+      this.$router.push({ path: '/scientific/index' });
+    },
   },
-  created() {},
-  methods: {},
   computed: {
     ...mapState(['user']),
   },
@@ -33,4 +108,11 @@ export default {
 };
 </script>
 
-<style lang="less" scoped></style>
+<style lang="less" scoped>
+.dialog {
+  /deep/.van-dialog__content {
+    max-height: 350px;
+    overflow-y: auto;
+  }
+}
+</style>

src/views/scientific/personnel/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div id="index">
-    <admin-frame @search="search" :limit="limit" :total="total" topType="2" :leftArrow="false" @add="toAdd" :useNav="false">
+    <admin-frame @search="search" :limit="limit" :total="total" topType="2" @back="back" @add="toAdd" :useNav="false">
       <template v-slot:info>
         <list-1 :list="list" @toView="toView"></list-1>
       </template>
@@ -98,6 +98,10 @@ export default {
       this.search(data);
       this.dialog = { show: false, title: '查询条件', type: '2' };
     },
+    // 返回
+    back() {
+      this.$router.push({ path: '/scientific/index' });
+    },
   },
   computed: {
     ...mapState(['user']),

src/views/scientific/task/index.vue

@@ -1,22 +1,78 @@
 <template>
   <div id="index">
-    <van-row>
-      <van-col span="24" class="main"> test </van-col>
-    </van-row>
+    <admin-frame @search="search" :limit="limit" :total="total" topType="2" @back="back" @add="toAdd" :useNav="false">
+      <template v-slot:info>
+        <list-1 :list="list" @toView="toView"></list-1>
+      </template>
+    </admin-frame>
+    <van-dialog class="dialog" v-model="dialog.show" :title="dialog.title" :show-confirm-button="false" show-cancel-button cancel-button-text="返回">
+      <info-1 :info="info" v-if="dialog.type == '1'"></info-1>
+      <search-1 :form="searhForm" v-else-if="dialog.type == '2'" @reseat="reseat" @onSubmit="onSubmit"></search-1>
+    </van-dialog>
   </div>
 </template>
 
 <script>
+import list1 from '@/layout/scientific/task/list-1.vue';
+import info1 from '@/layout/scientific/task/info-1.vue';
+import search1 from '@/layout/scientific/task/search-1.vue';
+import adminFrame from '@common/src/components/mobile-frame/mobile-main.vue';
 import { mapState, createNamespacedHelpers } from 'vuex';
 export default {
   name: 'index',
   props: {},
-  components: {},
+  components: {
+    adminFrame,
+    list1,
+    info1,
+    search1,
+  },
   data: function () {
-    return {};
+    return {
+      list: [],
+      total: 0,
+      limit: 5,
+      // 查询
+      searhForm: {},
+      // 弹框
+      dialog: { show: false, title: '详细信息', type: '1' },
+      // 详细信息
+      info: {},
+    };
+  },
+  async created() {
+    await this.search();
+  },
+  methods: {
+    async search({ skip = 0, limit = this.limit, searchName, ...info } = {}) {
+      if (searchName) info.name = searchName;
+      console.log(this.searhForm);
+    },
+    // 查看信息
+    async toView(data) {
+      this.$set(this, `info`, data);
+      this.dialog = { show: true, title: '详细信息', type: '1' };
+    },
+    // 添加查询条件
+    toAdd() {
+      this.dialog = { show: true, title: '查询条件', type: '2' };
+    },
+    // 重置条件
+    reseat() {
+      this.searhForm = {};
+      this.dialog = { show: false, title: '查询条件', type: '2' };
+      this.search();
+    },
+    // 提交查询
+    onSubmit({ data }) {
+      this.search(data);
+      this.dialog = { show: false, title: '查询条件', type: '2' };
+    },
+    // 返回
+    back() {
+      this.$router.push({ path: '/scientific/index' });
+    },
   },
-  created() {},
-  methods: {},
   computed: {
     ...mapState(['user']),
   },
@@ -33,4 +89,11 @@ export default {
 };
 </script>
 
-<style lang="less" scoped></style>
+<style lang="less" scoped>
+.dialog {
+  /deep/.van-dialog__content {
+    max-height: 350px;
+    overflow-y: auto;
+  }
+}
+</style>