Selaa lähdekoodia

Merge remote-tracking branch 'HS_MZAP/master'

# Conflicts:
#	src/views/tab_a/tabAll.vue
yin_yu820 2 vuotta sitten
vanhempi
commit
98d1c37b41

Tiedoston diff-näkymää rajattu, sillä se on liian suuri
+ 1 - 10570
package-lock.json


+ 1 - 0
package.json

@@ -7,6 +7,7 @@
     "build": "vue-cli-service build"
   },
   "dependencies": {
+    "@vant/area-data": "^1.4.1",
     "axios": "^1.3.4",
     "core-js": "^3.8.3",
     "normalize.css": "^8.0.1",

BIN
src/assets/upload.png


+ 0 - 58
src/components/HelloWorld.vue

@@ -1,58 +0,0 @@
-<template>
-  <div class="hello">
-    <h1>{{ msg }}</h1>
-    <p>
-      For a guide and recipes on how to configure / customize this project,<br>
-      check out the
-      <a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>.
-    </p>
-    <h3>Installed CLI Plugins</h3>
-    <ul>
-      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel" target="_blank" rel="noopener">babel</a></li>
-      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-router" target="_blank" rel="noopener">router</a></li>
-    </ul>
-    <h3>Essential Links</h3>
-    <ul>
-      <li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li>
-      <li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li>
-      <li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li>
-      <li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li>
-      <li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li>
-    </ul>
-    <h3>Ecosystem</h3>
-    <ul>
-      <li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li>
-      <li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li>
-      <li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li>
-      <li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li>
-      <li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li>
-    </ul>
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'HelloWorld',
-  props: {
-    msg: String
-  }
-}
-</script>
-
-<!-- Add "scoped" attribute to limit CSS to this component only -->
-<style scoped>
-h3 {
-  margin: 40px 0 0;
-}
-ul {
-  list-style-type: none;
-  padding: 0;
-}
-li {
-  display: inline-block;
-  margin: 0 10px;
-}
-a {
-  color: #42b983;
-}
-</style>

+ 17 - 1
src/main.js

@@ -7,7 +7,8 @@ import api from '@/api';
 import axios from 'axios';
 
 
-import { NavBar, Button, Form, Field, CellGroup, Tabbar, TabbarItem, Icon, Toast, Image as VanImage, Grid, GridItem, Row, Col, Tab, Tabs } from 'vant';
+
+import { NavBar, Button, Form, Field, CellGroup, Tabbar, TabbarItem, Icon, Toast, Image as VanImage, Grid, GridItem, Row, Col, Tab, Tabs, Popup, PickerGroup, DatePicker, TimePicker, Picker, Uploader, Dialog, List, Cell, Cascader, Search, RadioGroup, Radio, DropdownMenu, DropdownItem } from 'vant';
 import 'vant/lib/index.css';
 import store from './store';
 
@@ -31,6 +32,21 @@ app.use(router)
     .use(Col)
     .use(Tab)
     .use(Tabs)
+    .use(Popup)
+    .use(PickerGroup)
+    .use(DatePicker)
+    .use(TimePicker)
+    .use(Picker)
+    .use(Uploader)
+    .use(Dialog)
+    .use(List)
+    .use(Cell)
+    .use(Cascader)
+    .use(Search)
+    .use(RadioGroup)
+    .use(Radio)
+    .use(DropdownMenu)
+    .use(DropdownItem)
 
 app.config.globalProperties.$API = api
 app.config.globalProperties.$axios = axios

+ 159 - 75
src/router/index.js

@@ -1,83 +1,167 @@
 import { createRouter, createWebHashHistory } from 'vue-router'
 
-const routes = [
-  {
-    path: '/',
-    name: 'home',
-    component: () => import('../views/login/login.vue'),
-    meta:{
-      isShowTarbar:false,
+const routes = [{
+        path: '/',
+        name: 'home',
+        component: () =>
+            import ('../views/login/login.vue'),
+        meta: {
+            isShowTarbar: false,
+        }
+    }, {
+        path: '/login',
+        name: 'login',
+        component: () =>
+            import ('../views/login/login.vue'),
+        meta: {
+            isShowTarbar: false,
+        }
+    }, {
+        path: '/forget',
+        name: 'forget',
+        component: () =>
+            import ('../views/login/forget.vue'),
+        meta: {
+            isShowTarbar: false,
+        }
+    }, {
+        path: '/tab_a',
+        name: 'tab_a',
+        component: () =>
+            import ('../views/tab_a/tab_a.vue'),
+        meta: {
+            isShowTarbar: true,
+        }
+    }, {
+        path: '/toBeDone',
+        name: 'toBeDone',
+        component: () =>
+            import ('../views/toBeDone/toBeDone.vue'),
+        meta: {
+            isShowTarbar: true,
+        }
+    }, {
+        path: '/toBeDone_details',
+        name: 'toBeDone_details',
+        component: () =>
+            import ('../views/toBeDone/toBeDone_details.vue'),
+        meta: {
+            isShowTarbar: true,
+        }
+    }, {
+        path: '/siteMan',
+        name: 'siteMan',
+        component: () =>
+            import ('../views/siteMan/siteMan.vue'),
+        meta: {
+            isShowTarbar: true,
+        }
+    }, {
+        path: '/activityMan',
+        name: 'activityMan',
+        component: () =>
+            import ('../views/activityMan/activityMan.vue'),
+        meta: {
+            isShowTarbar: true,
+        }
+    }, {
+        path: '/placeActivityList',
+        name: 'placeActivityList',
+        component: () =>
+            import ('../views/activityMan/placeactivity/placeActivityList.vue'),
+        meta: {
+            isShowTarbar: true,
+        }
+    }, {
+        path: '/placeActivity',
+        name: 'placeActivity',
+        component: () =>
+            import ('../views/activityMan/placeactivity/placeActivityView.vue'),
+        meta: {
+            isShowTarbar: true,
+        }
+    }, {
+        path: '/selfMeetingList',
+        name: 'selfMeetingList',
+        component: () =>
+            import ('../views/activityMan/selfMeetingReport/selfMeetingList.vue'),
+        meta: {
+            isShowTarbar: true,
+        }
+    }, {
+        path: '/selfMeeting',
+        name: 'selfMeeting',
+        component: () =>
+            import ('../views/activityMan/selfMeetingReport/selfMeetingView.vue'),
+        meta: {
+            isShowTarbar: true,
+        }
+    }, {
+        path: '/abnormalCrowd',
+        name: 'abnormalCrowd',
+        component: () =>
+            import ('../views/activityMan/abnormalcrowd/abnormalCrowdView.vue'),
+        meta: {
+            isShowTarbar: true,
+        }
+    }, {
+        path: '/setting',
+        name: 'setting',
+        component: () =>
+            import ('../views/setting/setting.vue'),
+        meta: {
+            isShowTarbar: true,
+        }
+    }, {
+        path: '/tabAll',
+        name: 'tabAll',
+        component: () =>
+            import ('../views/tab_a/tabAll.vue'),
+        meta: {
+            isShowTarbar: false,
+        }
+    },
+    {
+        path: '/about',
+        name: 'about',
+        component: () =>
+            import ('../views/AboutView.vue'),
+        meta: {
+            isShowTarbar: false,
+        }
+    },
+    {
+        path: '/placePerson',
+        name: 'placePerson',
+        component: () =>
+            import ('../views/placeManage/placePerson.vue'),
+        meta: {
+            isShowTarbar: false,
+        }
+    },
+    {
+        path: '/placePersoninfo',
+        name: 'placePersoninfo',
+        component: () =>
+            import ('../views/placeManage/placePersoninfo.vue'),
+        meta: {
+            isShowTarbar: false,
+        }
+    },
+    {
+        path: '/placeRegister',
+        name: 'placeRegister',
+        component: () =>
+            import ('../views/placeManage/placeRegister.vue'),
+        meta: {
+            isShowTarbar: false,
+        }
     }
-  },{
-    path: '/login',
-    name: 'login',
-    component: () => import('../views/login/login.vue'),
-    meta:{
-      isShowTarbar:false,
-    }
-  },{
-    path: '/forget',
-    name: 'forget',
-    component: () => import('../views/login/forget.vue'),
-    meta:{
-      isShowTarbar:false,
-    }
-  },{
-    path: '/tab_a',
-    name: 'tab_a',
-    component: () => import('../views/tab_a/tab_a.vue'),
-    meta:{
-      isShowTarbar:true,
-    }
-  },{
-    path: '/toBeDone',
-    name: 'toBeDone',
-    component: () => import('../views/toBeDone/toBeDone.vue'),
-    meta:{
-      isShowTarbar:true,
-    }
-  },{
-    path: '/siteMan',
-    name: 'siteMan',
-    component: () => import('../views/siteMan/siteMan.vue'),
-    meta:{
-      isShowTarbar:true,
-    }
-  },{
-    path: '/activityMan',
-    name: 'activityMan',
-    component: () => import('../views/activityMan/activityMan.vue'),
-    meta:{
-      isShowTarbar:true,
-    }
-  },{
-    path: '/setting',
-    name: 'setting',
-    component: () => import('../views/setting/setting.vue'),
-    meta:{
-      isShowTarbar:true,
-    }
-  },{
-    path: '/tabAll',
-    name: 'tabAll',
-    component: () => import('../views/tab_a/tabAll.vue'),
-    meta:{
-      isShowTarbar:false,
-    }
-  },
-  {
-    path: '/about',
-    name: 'about',
-    component: () => import('../views/AboutView.vue'),
-    meta:{
-      isShowTarbar:false,
-    }
-  }
 ]
 
 const router = createRouter({
-  history: createWebHashHistory(),
-  routes,
+    history: createWebHashHistory(),
+    routes,
 })
 
-export default router
+export default router

+ 256 - 0
src/views/activityMan/abnormalcrowd/abnormalCrowdView.vue

@@ -0,0 +1,256 @@
+<template>
+  <van-nav-bar
+    title="信息上报中心"
+    left-text=""
+    left-arrow
+    @click-left="onClickLeft"
+  />
+  <div class="main">
+    <p class="title">信教异常群众上报</p>
+    <div class="formArea">
+      <p class="miniTitle">基础信息</p>
+      <van-cell-group>
+        <van-field
+          v-model="inputForm.count"
+          center
+          label="异常人员:"
+          placeholder="请填写异常人员姓名"
+          input-align="right"
+          type="digit"
+        />
+      </van-cell-group>
+      <van-cell-group>
+        <van-field
+          v-model="inputForm.count"
+          center
+          label="身份证号:"
+          placeholder="请填写身份证号"
+          input-align="right"
+          type="digit"
+        />
+      </van-cell-group>
+      <van-cell-group>
+        <van-field
+          v-model="inputForm.count"
+          center
+          label="手机号:"
+          placeholder="请填写手机号"
+          input-align="right"
+          type="tel"
+        />
+      </van-cell-group>
+      <van-cell-group>
+        <van-cell title="性别:">
+          <template #right-icon>
+            <van-radio-group v-model="checked" direction="horizontal">
+              <van-radio name="1">男</van-radio>
+              <van-radio name="2">女</van-radio>
+            </van-radio-group>
+          </template>
+        </van-cell>
+      </van-cell-group>
+      <van-cell-group>
+        <van-field
+          v-model="inputForm.place"
+          center
+          readonly
+          label="籍贯:"
+          placeholder="请选择"
+          input-align="right"
+          right-icon="arrow-down"
+          @click="showArea = true"
+        />
+        <van-popup v-model:show="showArea" round position="bottom">
+          <van-cascader
+            v-model="cascaderValue"
+            title="请选择籍贯"
+            :options="options"
+            @close="showArea = false"
+            @finish="onFinish"
+          />
+        </van-popup>
+      </van-cell-group>
+      <van-cell-group>
+        <van-field
+          v-model="inputForm.place"
+          center
+          readonly
+          label="现居地:"
+          placeholder="请选择"
+          input-align="right"
+          right-icon="arrow-down"
+          @click="showArea = true"
+        />
+        <van-popup v-model:show="showArea" round position="bottom">
+          <van-cascader
+            v-model="cascaderValue"
+            title="请选择现居地"
+            :options="options"
+            @close="showArea = false"
+            @finish="onFinish"
+          />
+        </van-popup>
+      </van-cell-group>
+      <van-cell-group>
+        <van-field
+          v-model="inputForm.address"
+          center
+          label="详细地址:"
+          placeholder="请填写具体地址"
+          input-align="right"
+          right-icon="location"
+        />
+      </van-cell-group>
+      <van-cell-group>
+        <div class="rowTextArea">
+          <van-field
+            v-model="inputForm.into"
+            placeholder="请填写异常行为"
+            center
+            rows="2"
+            type="textarea"
+            label="异常行为:"
+            label-align="top"
+          />
+        </div>
+      </van-cell-group>
+    </div>
+    <div class="subbtn">
+      <van-button type="primary">提交</van-button>
+      <van-button type="default" hairline>取消</van-button>
+    </div>
+  </div>
+</template>
+    
+    <script>
+import { reactive, ref } from "vue";
+import { useCascaderAreaData } from "@vant/area-data";
+import personList from "../personList.vue";
+export default {
+  components: { personList },
+  setup() {
+    // 返回
+    const onClickLeft = () => {
+      history.back();
+    };
+    // 活动信息
+    const inputForm = reactive({
+      place: "",
+      count: "",
+      time: "",
+      person: "",
+      place: "",
+      address: "",
+      into: "",
+    });
+    // 获取活动时间
+    let showAct = ref(false);
+    let currentDate = ref(["" + new Date().getFullYear(), "01", "01"]);
+    let currentTime = ref(["00", "00"]);
+    const getTime = () => {
+      showAct.value = false;
+      inputForm.time = `${currentDate.value.join("-")} ${currentTime.value.join(
+        ":"
+      )}`;
+    };
+    // 相关人
+    let showPerson = ref(false);
+    let list = "";
+    const selected = (val) => {
+      list = val;
+    };
+    const reselected = () => {
+      inputForm.person = list;
+    };
+    // 地区选择
+    let showArea = ref(false);
+    const cascaderValue = ref("");
+    // 选项列表,children 代表子选项,支持多级嵌套
+    const options = useCascaderAreaData();
+    // 全部选项选择完毕后,会触发 finish 事件
+    const onFinish = ({ selectedOptions }) => {
+      showArea.value = false;
+      inputForm.place = selectedOptions.map((option) => option.text).join("/");
+    };
+    // 性别
+    let checked = ref("1");
+    return {
+      inputForm,
+      // 活动时间
+      showAct,
+      currentDate,
+      currentTime,
+      getTime,
+      // 返回
+      onClickLeft,
+      // 人员选择
+      showPerson,
+      selected,
+      reselected,
+      // 地区选择
+      showArea,
+      options,
+      onFinish,
+      cascaderValue,
+      checked,
+    };
+  },
+};
+</script>
+    
+    <style scoped>
+* {
+  margin: 0;
+  padding: 0;
+}
+.main p {
+  height: 40px;
+  line-height: 40px;
+  color: #36a7f3;
+  border-bottom: 1px solid #eee;
+}
+.title {
+  font-size: 20px;
+  font-weight: 700;
+  padding-left: 20px;
+}
+.miniTitle {
+  font-size: 16px;
+}
+.formArea {
+  padding: 0px 20px;
+}
+.formArea .van-cell-group .van-field__label {
+  height: 40px;
+}
+.formArea .van-cell-group .van-cell {
+  line-height: 40px;
+}
+.van-cell__value .van-field__right-icon .van-icon-location {
+  color: #36a7f3 !important;
+}
+.rowTextArea::v-deep .van-field__value {
+  width: 98%;
+  border: 2px solid #ccc;
+  border-radius: 10px;
+}
+.rowTextArea::v-deep .van-cell {
+  display: flow-root;
+}
+.subbtn {
+  margin: 20px;
+  text-align: center;
+}
+.subbtn .van-button {
+  width: 40%;
+  margin: 5px;
+}
+.van-uploader .van-button {
+  border: none;
+  color: #36a7f3;
+  top: -4px;
+}
+.van-radio {
+  margin-right: 10px;
+}
+</style>

+ 140 - 0
src/views/activityMan/personList.vue

@@ -0,0 +1,140 @@
+<template>
+  <div class="personList">
+    <van-search
+      v-model="value"
+      show-action
+      placeholder="请输入搜索关键词"
+      @search="onSearch"
+      @cancel="onCancel"
+    />
+    <van-list
+      v-model:loading="loading"
+      :finished="finished"
+      finished-text="没有更多了"
+      @load="onLoad"
+    >
+      <van-cell title="全选">
+        <template #right-icon>
+          <input type="checkbox" v-model="isAll" @change="selectAll" />
+        </template>
+      </van-cell>
+      <van-cell v-for="(item, index) in list" :key="item" :title="item">
+        <template #right-icon>
+          <input
+            type="checkbox"
+            :ref="getList"
+            @change="selectPerson(item, index)"
+          />
+        </template>
+      </van-cell>
+    </van-list>
+  </div>
+</template>
+
+<script>
+import { ref, toRef } from "vue";
+
+export default {
+  name: "personList",
+  emits: ["selected"],
+  setup(props, { emit }) {
+    const list = [];
+    const loading = ref(false);
+    const finished = ref(false);
+
+    const onLoad = () => {
+      // 异步更新数据
+      // setTimeout 仅做示例,真实场景中一般为 ajax 请求
+      setTimeout(() => {
+        for (let i = 0; i < 10; i++) {
+          list.push(list.length + 1);
+        }
+
+        // 加载状态结束
+        loading.value = false;
+
+        // 数据全部加载完成
+        if (list.length >= 10) {
+          finished.value = true;
+        }
+      }, 1000);
+    };
+    // 搜索
+    const value = ref("");
+    const onSearch = (val) => showToast(val);
+    const onCancel = () => showToast("取消");
+    // 选择人员
+    let selects = [];
+    // 全选
+    let isAll = ref(false);
+    let checks = [];
+    const getList = (el) => {
+      checks.push(el);
+    };
+    const selectAll = () => {
+      checks.forEach((item) => {
+        item.checked = isAll.value;
+      });
+      if (isAll) {
+        selects = list;
+      } else {
+        selects = [];
+      }
+      emit("selected", selects.join(","));
+    };
+    const selectPerson = (value, index) => {
+      if (checks[index].checked) {
+        selects.push(value);
+      } else {
+        selects.splice(selects.indexOf(value), 1);
+      }
+
+      if (selects.length == getList.length) {
+        isAll.value = true;
+      } else {
+        isAll.value = false;
+      }
+      emit("selected", selects.join(","));
+    };
+    return {
+      list,
+      onLoad,
+      loading,
+      finished,
+      selectPerson,
+      value,
+      onSearch,
+      onCancel,
+      selectAll,
+      getList,
+      isAll,
+    };
+  },
+};
+</script>
+
+<style scoped>
+.personList {
+  height: 65vh;
+  overflow: auto;
+  margin: 10px;
+}
+.van-button {
+  top: -5px;
+}
+.search {
+  height: 40px;
+  line-height: 40px;
+}
+.van-list {
+  height: 80%;
+  margin-top: 5px;
+}
+.keyword {
+  width: 70%;
+  height: 25px;
+  border-radius: 25px;
+  border: 1px solid;
+  padding-left: 15px;
+}
+</style>

+ 81 - 0
src/views/activityMan/placeactivity/placeActivityList.vue

@@ -0,0 +1,81 @@
+<template>
+  <van-nav-bar
+    title="场所活动"
+    left-text=""
+    left-arrow
+    @click-left="onClickLeft"
+  />
+  <van-search
+  v-model="value"
+  shape="round"
+  placeholder="请输入搜索关键词"
+/>
+  <van-list
+    v-model:loading="loading"
+    :finished="finished"
+    finished-text="没有更多了"
+    @load="onLoad"
+  >
+    <van-button type="primary" size="small" to="/placeActivity">新增</van-button>
+    <van-cell v-for="item in list" :key="item" :title="item" label="2222" is-link>
+      <template #value>
+        11111
+      </template>
+    </van-cell>
+  </van-list>
+</template>
+
+<script>
+import { ref } from "vue";
+export default {
+  name: "placeActivityList",
+  setup() {
+    const onClickLeft = () => {
+      history.back();
+    };
+    const list = ref([]);
+    const loading = ref(false);
+    const finished = ref(false);
+
+    const onLoad = () => {
+      // 异步更新数据
+      // setTimeout 仅做示例,真实场景中一般为 ajax 请求
+      setTimeout(() => {
+        for (let i = 0; i < 10; i++) {
+          list.value.push(list.value.length + 1);
+        }
+
+        // 加载状态结束
+        loading.value = false;
+
+        // 数据全部加载完成
+        if (list.value.length >= 10) {
+          finished.value = true;
+        }
+      }, 1000);
+    };
+    // 搜索
+    let value = ref('');
+    return {
+      onClickLeft,
+      list,
+      onLoad,
+      loading,
+      finished,
+      value
+    };
+  },
+};
+</script>
+
+<style>
+.van-button {
+  top: -5px;
+}
+
+.van-list {
+  height: 80%;
+  margin-top: 5px;
+}
+
+</style>

+ 383 - 0
src/views/activityMan/placeactivity/placeActivityView.vue

@@ -0,0 +1,383 @@
+<template>
+  <van-nav-bar
+    title="信息上报中心"
+    left-text=""
+    left-arrow
+    @click-left="onClickLeft"
+  />
+  <div class="main">
+    <p class="title">场所活动上报</p>
+    <div class="formArea">
+      <p class="miniTitle">基础信息</p>
+      <van-cell-group>
+        <van-field
+          v-model="placeActivity.activity"
+          center
+          label="活动名称:"
+          placeholder="请填写活动名称"
+          input-align="right"
+        />
+      </van-cell-group>
+      <van-cell-group>
+        <van-field
+          v-model="placeActivity.place"
+          readonly
+          required
+          label="场所名称:"
+          placeholder="请选择"
+          input-align="right"
+          right-icon="arrow-down"
+          @click="showPlace = true"
+        />
+        <van-popup v-model:show="showPlace" round position="bottom">
+          <van-picker
+            title="活动场所"
+            :columns="places"
+            @cancel="showPlace = false"
+            @confirm="getPlace"
+          />
+        </van-popup>
+      </van-cell-group>
+      <van-cell-group>
+        <van-field
+          v-model="placeActivity.activityTime"
+          center
+          readonly
+          label="活动时间:"
+          placeholder="请选择时间"
+          input-align="right"
+          right-icon="arrow-down"
+          @click="showAct = true"
+        />
+        <van-popup v-model:show="showAct" round position="bottom">
+          <van-picker-group
+            title="活动时间"
+            :tabs="['选择日期', '选择时间']"
+            next-step-text="下一步"
+            @confirm="getTime"
+            @cancel="showAct = false"
+          >
+            <van-date-picker v-model="currentDate" />
+            <van-time-picker v-model="currentTime" />
+          </van-picker-group>
+        </van-popup>
+      </van-cell-group>
+      <van-cell-group>
+        <van-field
+          v-model="placeActivity.countPerson"
+          center
+          label="参会人数:"
+          placeholder="请填写参会人数"
+          input-align="right"
+          type="digit"
+        />
+      </van-cell-group>
+      <van-cell-group>
+        <van-field
+          v-model="placeActivity.list"
+          center
+          required
+          label="已知名单:"
+          placeholder="请选择参会已知名单"
+          input-align="right"
+          right-icon="arrow-down"
+          @click="showPerson = true"
+        />
+        <van-dialog
+          v-model:show="showPerson"
+          title="选择人员名单"
+          show-cancel-button
+          @confirm="reselected"
+        >
+          <person-list @selected="selected"></person-list>
+        </van-dialog>
+      </van-cell-group>
+      <van-cell-group>
+        <van-field
+          v-model="placeActivity.portname"
+          center
+          label="报告人:"
+          placeholder="请选择报告人"
+          input-align="right"
+          right-icon="arrow-down"
+        />
+      </van-cell-group>
+      <van-cell-group>
+        <van-field
+          v-model="placeActivity.area"
+          center
+          label="参加范围:"
+          placeholder="请填写参加范围"
+          input-align="right"
+        />
+      </van-cell-group>
+      <van-cell-group>
+        <van-field
+          v-model="placeActivity.activityPlace"
+          center
+          readonly
+          label="活动地点:"
+          placeholder="请填写参加地点"
+          input-align="right"
+          right-icon="arrow-down"
+          @click="showArea = true"
+        />
+        <van-popup v-model:show="showArea" round position="bottom">
+          <van-cascader
+            v-model="cascaderValue"
+            title="请选择所在地区"
+            :options="options"
+            @close="showArea = false"
+            @finish="onFinish"
+          />
+        </van-popup>
+      </van-cell-group>
+      <van-cell-group>
+        <van-field
+          v-model="placeActivity.address"
+          center
+          label="详细地址:"
+          placeholder="请填写活参加地点"
+          input-align="right"
+          right-icon="location"
+        />
+      </van-cell-group>
+      <van-cell-group>
+        <van-field
+          v-model="placeActivity.money"
+          center
+          label="经费来源:"
+          placeholder="请选择"
+          input-align="right"
+        />
+      </van-cell-group>
+      <van-cell-group>
+        <van-field
+          v-model="placeActivity.activityName"
+          center
+          label="活动负责人:"
+          placeholder="请选择活动负责人"
+          input-align="right"
+          right-icon="arrow-down"
+          @click="showReport = true"
+        />
+        <van-dialog
+          v-model:show="showReport"
+          title="选择活动负责人"
+          show-cancel-button
+        >
+          <person-list></person-list>
+        </van-dialog>
+      </van-cell-group>
+      <van-cell-group>
+        <van-field
+          v-model="placeActivity.tel"
+          center
+          type="tel"
+          label="联系方式:"
+          placeholder="请填写联系方式"
+          input-align="right"
+        />
+      </van-cell-group>
+      <van-cell-group>
+        <van-field name="uploader" label="安全预案:">
+          <template #input>
+            <van-uploader>
+              <van-button icon="plus">上传文件</van-button>
+            </van-uploader>
+          </template>
+        </van-field>
+      </van-cell-group>
+      <van-cell-group>
+        <div class="rowTextArea">
+          <van-field
+            v-model="placeActivity.into"
+            center
+            rows="2"
+            type="textarea"
+            label="主题内容:"
+            label-align="top"
+          />
+        </div>
+      </van-cell-group>
+    </div>
+    <div class="subbtn">
+      <van-button type="primary">提交</van-button>
+      <van-button type="default" hairline>取消</van-button>
+    </div>
+  </div>
+</template>
+
+<script>
+import { reactive, ref } from "vue";
+import personList from "../personList.vue";
+export default {
+  components: { personList },
+  setup() {
+    // 返回
+    const onClickLeft = () => {
+      history.back();
+    };
+    // 活动信息
+    const placeActivity = reactive({
+      activity: "",
+      place: "",
+      activityTime: "",
+      countPerson: "",
+      list: "",
+      portname: "",
+      area: "",
+      activityPlace: "",
+      address: "",
+      money: "",
+      activityName: "",
+      tel: "",
+      file: "",
+      into: "",
+    });
+    // 场所名称
+    const places = [
+      { text: "杭州", value: "Hangzhou" },
+      { text: "宁波", value: "Ningbo" },
+      { text: "温州", value: "Wenzhou" },
+      { text: "绍兴", value: "Shaoxing" },
+      { text: "湖州", value: "Huzhou" },
+    ];
+    let showPlace = ref(false);
+    const getPlace = ({ selectedOptions }) => {
+      showPlace.value = false;
+      placeActivity.place = selectedOptions[0].text;
+    };
+    // 获取活动时间
+    let showAct = ref(false);
+    let currentDate = ref(["" + new Date().getFullYear(), "01", "01"]);
+    let currentTime = ref(["00", "00"]);
+    const getTime = () => {
+      showAct.value = false;
+      placeActivity.activityTime = `${currentDate.value.join(
+        "-"
+      )} ${currentTime.value.join(":")}`;
+    };
+    // 已知名单
+    let showPerson = ref(false);
+    // 活动负责人
+    let showReport = ref(false);
+    const show = () => {
+      showPerson = true;
+    };
+    let list = "";
+    const selected = (val) => {
+      
+      list = val;
+    };
+    const reselected = () => {
+      placeActivity.list = list;
+    };
+    // 地区选择
+    let showArea = ref(false);
+    const cascaderValue = ref("");
+    // 选项列表,children 代表子选项,支持多级嵌套
+    const options = [
+      {
+        text: "浙江省",
+        value: "330000",
+        children: [{ text: "杭州市", value: "330100" }],
+      },
+      {
+        text: "江苏省",
+        value: "320000",
+        children: [{ text: "南京市", value: "320100" }],
+      },
+    ];
+    // 全部选项选择完毕后,会触发 finish 事件
+    const onFinish = ({ selectedOptions }) => {
+      showArea.value = false;
+      placeActivity.activityPlace = selectedOptions
+        .map((option) => option.text)
+        .join("/");
+    };
+    return {
+      placeActivity,
+      // 活动场所
+      showPlace,
+      places,
+      getPlace,
+      // 活动时间
+      showAct,
+      currentDate,
+      currentTime,
+      getTime,
+      // 返回
+      onClickLeft,
+      // 人员选择
+      showPerson,
+      showReport,
+      selected,
+      reselected,
+      // 地区选择
+      showArea,
+      options,
+      onFinish,
+      cascaderValue,
+    };
+  },
+};
+</script>
+
+<style scoped>
+* {
+  margin: 0;
+  padding: 0;
+}
+.main p {
+  height: 40px;
+  line-height: 40px;
+  color: #36a7f3;
+  border-bottom: 1px solid #eee;
+}
+.title {
+  font-size: 20px;
+  font-weight: 700;
+  padding-left: 20px;
+}
+.miniTitle {
+  font-size: 16px;
+}
+.formArea {
+  padding: 0px 20px;
+}
+.formArea .van-cell-group .van-field__label {
+  height: 40px;
+}
+.formArea .van-cell-group .van-cell {
+  line-height: 40px;
+}
+.van-cell__value .van-field__right-icon .van-icon-location {
+  color: #36a7f3!important;
+}
+.rowTextArea::v-deep .van-field__value {
+  width: 98%;
+  border: 2px solid #ccc;
+  border-radius: 10px;
+}
+.rowTextArea::v-deep .van-cell {
+  display: flow-root;
+}
+.subbtn {
+  margin: 20px;
+  text-align: center;
+}
+.subbtn .van-button {
+  width: 40%;
+  margin: 5px;
+}
+.van-uploader .van-button {
+  border: none;
+  color: #36a7f3;
+  top: -4px;
+}
+.van-dialog {
+  width: 80%;
+  top: 50%;
+}
+</style>

+ 85 - 0
src/views/activityMan/selfMeetingReport/selfMeetingList.vue

@@ -0,0 +1,85 @@
+<template>
+  <van-nav-bar
+    title="私设聚会点"
+    left-text=""
+    left-arrow
+    @click-left="onClickLeft"
+  />
+  <div class="search">
+    <input type="text" placeholder="请输入查询信息" class="keyword" />
+    <van-button icon="search" type="primary" size="small">查询</van-button>
+  </div>
+  <van-list
+    v-model:loading="loading"
+    :finished="finished"
+    finished-text="没有更多了"
+    @load="onLoad"
+  >
+    <van-button type="primary" size="small" to="/selfMeeting"
+      >上报</van-button
+    >
+    <van-cell v-for="item in list" :key="item" :title="item" is-link>
+    </van-cell>
+  </van-list>
+</template>
+  
+  <script>
+import { ref } from "vue";
+export default {
+  name: "placeActivityList",
+  setup() {
+    const onClickLeft = () => {
+      history.back();
+    };
+    const list = ref([]);
+    const loading = ref(false);
+    const finished = ref(false);
+
+    const onLoad = () => {
+      // 异步更新数据
+      // setTimeout 仅做示例,真实场景中一般为 ajax 请求
+      setTimeout(() => {
+        for (let i = 0; i < 10; i++) {
+          list.value.push(list.value.length + 1);
+        }
+
+        // 加载状态结束
+        loading.value = false;
+
+        // 数据全部加载完成
+        if (list.value.length >= 10) {
+          finished.value = true;
+        }
+      }, 1000);
+    };
+    return {
+      onClickLeft,
+      list,
+      onLoad,
+      loading,
+      finished,
+    };
+  },
+};
+</script>
+  
+  <style>
+.van-button {
+  top: -5px;
+}
+.search {
+  height: 40px;
+  line-height: 40px;
+}
+.van-list {
+  height: 80%;
+  margin-top: 5px;
+}
+.keyword {
+  width: 70%;
+  height: 25px;
+  border-radius: 25px;
+  border: 1px solid;
+  padding-left: 15px;
+}
+</style>

+ 256 - 0
src/views/activityMan/selfMeetingReport/selfMeetingView.vue

@@ -0,0 +1,256 @@
+<template>
+  <van-nav-bar
+    title="信息上报中心"
+    left-text=""
+    left-arrow
+    @click-left="onClickLeft"
+  />
+  <div class="main">
+    <p class="title">私设聚会点上报</p>
+    <div class="formArea">
+      <p class="miniTitle">基础信息</p>
+      <van-cell-group>
+        <van-field
+          v-model="inputForm.place"
+          center
+          readonly
+          label="地点:"
+          placeholder="请填写参加地点"
+          input-align="right"
+          right-icon="arrow-down"
+          @click="showArea = true"
+        />
+        <van-popup v-model:show="showArea" round position="bottom">
+          <van-cascader
+            v-model="cascaderValue"
+            title="请选择所在地区"
+            :options="options"
+            @close="showArea = false"
+            @finish="onFinish"
+          />
+        </van-popup>
+      </van-cell-group>
+      <van-cell-group>
+        <van-field
+          v-model="inputForm.address"
+          center
+          label="详细地址:"
+          placeholder="请填写具体地址"
+          input-align="right"
+          right-icon="location"
+        />
+      </van-cell-group>
+
+      <van-cell-group>
+        <van-field
+          v-model="inputForm.count"
+          center
+          label="频次:"
+          placeholder="请填写频次"
+          input-align="right"
+          type="digit"
+        />
+      </van-cell-group>
+      <van-cell-group>
+        <van-field
+          v-model="inputForm.time"
+          center
+          readonly
+          label="时间:"
+          placeholder="请选择时间"
+          input-align="right"
+          right-icon="arrow-down"
+          @click="showAct = true"
+        />
+        <van-popup v-model:show="showAct" round position="bottom">
+          <van-picker-group
+            :tabs="['选择日期', '选择时间']"
+            next-step-text="下一步"
+            @confirm="getTime"
+            @cancel="showAct = false"
+          >
+            <van-date-picker v-model="currentDate" />
+            <van-time-picker v-model="currentTime" />
+          </van-picker-group>
+        </van-popup>
+      </van-cell-group>
+      <van-cell-group>
+        <van-field
+          v-model="inputForm.person"
+          center
+          required
+          label="相关人:"
+          placeholder="请选择相关人"
+          input-align="right"
+          right-icon="arrow-down"
+          @click="showPerson = true"
+        />
+        <van-dialog
+          v-model:show="showPerson"
+          title="选择人员"
+          show-cancel-button
+          @confirm="reselected"
+        >
+          <person-list @selected="selected"></person-list>
+        </van-dialog>
+      </van-cell-group>
+      <van-cell-group>
+        <div class="rowTextArea">
+          <van-field
+            v-model="inputForm.into"
+            center
+            rows="2"
+            type="textarea"
+            label="内容:"
+            label-align="top"
+          />
+        </div>
+      </van-cell-group>
+    </div>
+    <div class="subbtn">
+      <van-button type="primary">提交</van-button>
+      <van-button type="default" hairline>取消</van-button>
+    </div>
+  </div>
+</template>
+  
+  <script>
+import { reactive, ref } from "vue";
+import personList from "../personList.vue";
+export default {
+  components: { personList },
+  setup() {
+    // 返回
+    const onClickLeft = () => {
+      history.back();
+    };
+    // 活动信息
+    const inputForm = reactive({
+      place: "",
+      count: "",
+      time: "",
+      person: "",
+      place: "",
+      address: "",
+      into: "",
+    });
+    // 获取活动时间
+    let showAct = ref(false);
+    let currentDate = ref(["" + new Date().getFullYear(), "01", "01"]);
+    let currentTime = ref(["00", "00"]);
+    const getTime = () => {
+      showAct.value = false;
+      inputForm.time = `${currentDate.value.join("-")} ${currentTime.value.join(
+        ":"
+      )}`;
+    };
+    // 相关人
+    let showPerson = ref(false);
+    let list = "";
+    const selected = (val) => {
+      list = val;
+    };
+    const reselected = () => {
+      inputForm.person = list;
+    };
+    // 地区选择
+    let showArea = ref(false);
+    const cascaderValue = ref("");
+    // 选项列表,children 代表子选项,支持多级嵌套
+    const options = [
+      {
+        text: "浙江省",
+        value: "330000",
+        children: [{ text: "杭州市", value: "330100" }],
+      },
+      {
+        text: "江苏省",
+        value: "320000",
+        children: [{ text: "南京市", value: "320100" }],
+      },
+    ];
+    // 全部选项选择完毕后,会触发 finish 事件
+    const onFinish = ({ selectedOptions }) => {
+      showArea.value = false;
+      inputForm.place = selectedOptions.map((option) => option.text).join("/");
+    };
+    return {
+      inputForm,
+      // 活动时间
+      showAct,
+      currentDate,
+      currentTime,
+      getTime,
+      // 返回
+      onClickLeft,
+      // 人员选择
+      showPerson,
+      selected,
+      reselected,
+      // 地区选择
+      showArea,
+      options,
+      onFinish,
+      cascaderValue,
+    };
+  },
+};
+</script>
+  
+  <style scoped>
+* {
+  margin: 0;
+  padding: 0;
+}
+.main p {
+  height: 40px;
+  line-height: 40px;
+  color: #36a7f3;
+  border-bottom: 1px solid #eee;
+}
+.title {
+  font-size: 20px;
+  font-weight: 700;
+  padding-left: 20px;
+}
+.miniTitle {
+  font-size: 16px;
+}
+.formArea {
+  padding: 0px 20px;
+}
+.formArea .van-cell-group .van-field__label {
+  height: 40px;
+}
+.formArea .van-cell-group .van-cell {
+  line-height: 40px;
+}
+.van-cell__value .van-field__right-icon .van-icon-location {
+  color: #36a7f3 !important;
+}
+.rowTextArea::v-deep .van-field__value {
+  width: 98%;
+  border: 2px solid #ccc;
+  border-radius: 10px;
+}
+.rowTextArea::v-deep .van-cell {
+  display: flow-root;
+}
+.subbtn {
+  margin: 20px;
+  text-align: center;
+}
+.subbtn .van-button {
+  width: 40%;
+  margin: 5px;
+}
+.van-uploader .van-button {
+  border: none;
+  color: #36a7f3;
+  top: -4px;
+}
+.van-dialog {
+  width: 80%;
+  top: 50%;
+}
+</style>

+ 179 - 0
src/views/placeManage/placePerson.vue

@@ -0,0 +1,179 @@
+<template>
+  <van-nav-bar title="人员档案信息" left-arrow @click-left="goback" />
+  <div class="serach">
+    <van-search
+      v-model="value"
+      show-action
+      shape="round"
+      placeholder="请输入姓名/身份证/场所名称"
+      @search="onSearch"
+    >
+      <template #action>
+        <div @click="onClickButton">
+          <van-dropdown-menu>
+            <van-dropdown-item overlay="false" v-model="value1" :options="option1" />
+          </van-dropdown-menu>
+        </div>
+      </template>
+    </van-search>
+  </div>
+  <div class="PersonList">
+    <div class="PersonItem" v-for="item in Person.PersonList" :key="item.id">
+      <van-row>
+        <van-col span="18">
+            <p>{{item.name}}(<span style="color:#36a7f3;">{{item.id}}</span>)</p>
+        </van-col>
+        <van-col span="6">
+            <p v-if="item.church == '基督教'" style="color:#36a7f3;">基督教</p>
+            <p v-else-if="item.church == '佛教'" style="color:#e4dd65;">佛教</p>
+            <p v-else-if="item.church == '伊斯兰教'" style="color:#52ca7d;">伊斯兰教</p>
+        </van-col>
+      </van-row>
+      <van-row>
+        <van-col span="18">
+            <p>{{item.address}}</p>
+        </van-col>
+        <van-col span="6">
+            <p>{{item.position}}</p>
+        </van-col>
+      </van-row>
+    </div>
+  </div>
+</template>
+
+<script>
+import { reactive,ref } from "vue";
+export default {
+  setup() {
+    const value = ref("");
+    const value1 = ref(0);
+    const option1 = [
+      { text: "所有教别", value: 0 },
+      { text: "基督教", value: 1 },
+      { text: "佛教", value: 2 },
+      { text: "伊斯兰教", value: 3 },
+    ];
+    const Person = reactive({
+        PersonList:[
+            {
+                name:'孙辉',
+                id:'320902198901523010',
+                church:'基督教',
+                address:'盐都基督教总教',
+                position:'教职人员'
+            },
+            {
+                name:'孙辉',
+                id:'320902198901523010',
+                church:'佛教',
+                address:'盐城永宁寺',
+                position:'教职人员'
+            },
+            {
+                name:'孙辉',
+                id:'320902198901523010',
+                church:'基督教',
+                address:'盐都基督教总教',
+                position:'教职人员'
+            },
+            {
+                name:'孙辉',
+                id:'320902198901523010',
+                church:'基督教',
+                address:'盐都基督教总教',
+                position:'教职人员'
+            },
+            {
+                name:'孙辉',
+                id:'320902198901523010',
+                church:'伊斯兰教',
+                address:'盐都清真寺',
+                position:'教职人员'
+            },
+        ]
+    })
+    //返回
+    const goback = () => {
+      history.back();
+    };
+    return {
+      goback,
+      value,
+      value1,
+      option1,
+      Person
+    };
+  },
+};
+</script>
+<style lang="less">
+body,
+html {
+  margin: 0;
+  padding: 0;
+  background-color: #f2f2f2;
+}
+.van-nav-bar {
+  background-color: #36a7f3;
+  .van-nav-bar__title {
+    color: #fff;
+  }
+  .van-badge__wrapper {
+    color: #fff;
+  }
+}
+.search {
+  background-color: #fff;
+  .van-dropdown-menu__item {
+    width: 20px;
+    height: 50px;
+  }
+}
+.PersonList {
+  background-color: #fff;
+  margin-top: 20px;
+  height: 600px;
+  p{
+    margin: 0;
+    padding: 0;
+  }
+  .PersonItem{
+    padding: 10px 10px;
+    font-size: 16px;
+    border-bottom: 1px solid #f2f2f2;
+    .van-row{
+        &:nth-child(1){
+            margin-bottom: 10px;
+            .van-col{
+                &:nth-child(1){
+                    p{
+                        font-weight: 700;
+                    }
+                }
+                &:nth-child(2){
+                    p{
+                        text-align: right;
+                    }
+                }
+            }
+        }
+        &:nth-child(2){
+            .van-col{
+                &:nth-child(1){
+                    p{
+                        color: #d0d0d0;
+                    }
+                }
+                &:nth-child(2){
+                    p{
+                        text-align: right;
+                        color: #d0d0d0;
+                    }
+                }
+            }
+        }
+    }
+  }
+  
+}
+</style>

+ 303 - 0
src/views/placeManage/placePersoninfo.vue

@@ -0,0 +1,303 @@
+<template>
+  <van-nav-bar title="人员档案信息" left-arrow @click-left="goback" />
+  <div class="banner">
+    <h2>扎实提升“三力”</h2>
+    <h2>深入推进“三化”</h2>
+    <h2>坚持“三个思维”</h2>
+  </div>
+  <div class="content">
+    <div class="itemInfo">
+    <h3 style="color: #40abf4">个人信息-孙辉</h3>
+      <van-row justify="space-between">
+        <van-col span="14">
+          <van-row class="item">
+            <van-col span="24">
+              <van-row justify="space-between">
+                <van-col span="8"> 姓名: </van-col>
+                <van-col span="8" style="text-align: right"> 孙辉 </van-col>
+              </van-row>
+            </van-col>
+          </van-row>
+          <van-row class="item">
+            <van-col span="24">
+              <van-row justify="space-between">
+                <van-col span="8"> 性别: </van-col>
+                <van-col span="8" style="text-align: right"> 男 </van-col>
+              </van-row>
+            </van-col>
+          </van-row>
+          <van-row class="item">
+            <van-col span="24">
+              <van-row justify="space-between">
+                <van-col span="12"> 证件类型: </van-col>
+                <van-col span="6" style="text-align: right"> 身份证 </van-col>
+              </van-row>
+            </van-col>
+          </van-row>
+        </van-col>
+        <van-col span="8">
+          <img class="personImg" src="../../assets/logo.png" alt="" />
+        </van-col>
+      </van-row>
+      <van-row class="item">
+        <van-col span="24">
+          <van-row justify="space-between">
+            <van-col span="10"> 证件号码: </van-col>
+            <van-col span="14" style="text-align: right">
+              320911198904021563
+            </van-col>
+          </van-row>
+        </van-col>
+      </van-row>
+      <van-row class="item">
+        <van-col span="24">
+          <van-row justify="space-between">
+            <van-col span="10"> 手机号: </van-col>
+            <van-col span="14" style="text-align: right">
+              18356568569
+            </van-col>
+          </van-row>
+        </van-col>
+      </van-row>
+      <van-row class="item">
+        <van-col span="24">
+          <van-row justify="space-between">
+            <van-col span="10"> 所属场所: </van-col>
+            <van-col span="14" style="text-align: right">
+              盐都基督教总教
+            </van-col>
+          </van-row>
+        </van-col>
+      </van-row>
+      <van-row class="item">
+        <van-col span="24">
+          <van-row justify="space-between">
+            <van-col span="10"> 人员类型: </van-col>
+            <van-col span="14" style="text-align: right">
+              教职人员
+            </van-col>
+          </van-row>
+        </van-col>
+      </van-row>
+      <van-row class="item">
+        <van-col span="24">
+          <van-row justify="space-between">
+            <van-col span="10"> 从业类型: </van-col>
+            <van-col span="14" style="text-align: right">
+              场所负责人
+            </van-col>
+          </van-row>
+        </van-col>
+      </van-row>
+      <van-row class="item">
+        <van-col span="24">
+          <van-row justify="space-between">
+            <van-col span="10"> 籍贯: </van-col>
+            <van-col span="14" style="text-align: right">
+              中国/江苏/盐城
+            </van-col>
+          </van-row>
+        </van-col>
+      </van-row>
+      <van-row class="item">
+        <van-col span="24">
+          <van-row justify="space-between">
+            <van-col span="10"> 现居地: </van-col>
+            <van-col span="14" style="text-align: right">
+              中国/江苏省/盐城市/盐都区
+            </van-col>
+          </van-row>
+        </van-col>
+      </van-row>
+      <van-row class="item">
+        <van-col span="24">
+          <van-row justify="space-between">
+            <van-col span="10"> 详细地址: </van-col>
+            <van-col span="14" style="text-align: right">
+              世纪大道3838号
+            </van-col>
+          </van-row>
+        </van-col>
+      </van-row>
+      <h3 style="color: #40abf4;margin-top:10px;">拓展信息</h3>
+      <van-row class="item">
+        <van-col span="24">
+          <van-row justify="space-between">
+            <van-col span="10"> 法名: </van-col>
+            <van-col span="14" style="text-align: right">
+              普宁居士
+            </van-col>
+          </van-row>
+        </van-col>
+      </van-row>
+      <van-row class="item">
+        <van-col span="24">
+          <van-row justify="space-between">
+            <van-col span="10">教别: </van-col>
+            <van-col span="14" style="text-align: right">
+              基督教
+            </van-col>
+          </van-row>
+        </van-col>
+      </van-row>
+      <van-row class="item">
+        <van-col span="24">
+          <van-row justify="space-between">
+            <van-col span="10"> 教职名称: </van-col>
+            <van-col span="14" style="text-align: right">
+              传教士
+            </van-col>
+          </van-row>
+        </van-col>
+      </van-row>
+      <van-row class="item">
+        <van-col span="24">
+          <van-row justify="space-between">
+            <van-col span="10"> 教职证书号: </van-col>
+            <van-col span="14" style="text-align: right">
+              JS25645784
+            </van-col>
+          </van-row>
+        </van-col>
+      </van-row>
+      <van-row class="item">
+        <van-col span="24">
+          <van-row justify="space-between">
+            <van-col span="10"> 备案时间: </van-col>
+            <van-col span="14" style="text-align: right">
+              2020-10-26
+            </van-col>
+          </van-row>
+        </van-col>
+      </van-row>
+      <van-row class="item">
+        <van-col span="24">
+          <van-row justify="space-between">
+            <van-col span="10"> 备案部门: </van-col>
+            <van-col span="14" style="text-align: right">
+              盐城市民宗局
+            </van-col>
+          </van-row>
+        </van-col>
+      </van-row>
+      <van-row class="item">
+        <van-col span="24">
+          <van-row justify="space-between">
+            <van-col span="10"> 证书备案编号: </van-col>
+            <van-col span="14" style="text-align: right">
+              20201026302
+            </van-col>
+          </van-row>
+        </van-col>
+      </van-row>
+      <van-row class="item">
+        <van-col span="24">
+          <van-row justify="space-between">
+            <van-col span="10"> 证书有效期: </van-col>
+            <van-col span="14" style="text-align: right">
+              2023-10-26
+            </van-col>
+          </van-row>
+        </van-col>
+      </van-row>
+      <van-row class="item">
+        <van-col span="24">
+          <van-row justify="space-between">
+            <van-col span="10"> 教职人员类型: </van-col>
+            <van-col span="14" style="text-align: right">
+              负责人
+            </van-col>
+          </van-row>
+        </van-col>
+      </van-row>
+      <van-row class="item">
+        <van-col span="24">
+          <van-row>
+            <van-col span="10"> 证书照片: </van-col>
+          </van-row>
+          <van-row>
+            <van-col span="10">
+                <img class="personImg" src="../../assets/logo.png" alt="" />
+            </van-col>
+          </van-row>
+        </van-col>
+      </van-row>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {};
+</script>
+
+<style lang="less">
+body,
+html {
+  margin: 0;
+  padding: 0;
+  background-color: #f2f2f2;
+}
+.van-nav-bar {
+  background-color: #36a7f3;
+  .van-nav-bar__title {
+    color: #fff;
+  }
+  .van-badge__wrapper {
+    color: #fff;
+  }
+}
+.banner {
+  background-color: #36a7f3;
+  padding: 20px 50px 40px 50px;
+  color: #fff;
+  h2 {
+    &:nth-child(1) {
+      margin-top: 0px;
+      text-align: left;
+    }
+    &:nth-child(2) {
+      text-align: center;
+    }
+    &:nth-child(3) {
+      text-align: right;
+    }
+  }
+}
+.content {
+  position: fixed;
+  width: 85%;
+  top: 240px;
+  left: 50%;
+  padding: 20px 10px;
+  transform: translateX(-50%);
+  background-color: #fff;
+  border-radius: 10px;
+  font-size: 16px;
+  height: 680px;
+  overflow: auto;
+  h3 {
+    margin: 0;
+    padding: 0;
+  }
+  .itemInfo{
+    height: 100%;
+    .item{
+        padding: 15px 0;
+        border-bottom: 1px solid #f2f2f2;
+        .van-col{
+            .van-row{
+                .van-col{
+                    &:nth-child(2){
+                        color: #7f7f7f;
+                    }
+                }
+            }
+        }
+    }
+    .personImg{
+        width: 100%;
+        height: 100%;
+    }
+  }
+}
+</style>

+ 256 - 0
src/views/placeManage/placeRegister.vue

@@ -0,0 +1,256 @@
+<template>
+  <van-nav-bar title="智慧“和顺”" left-arrow @click-left="goback" />
+  <div class="main">
+    <p class="title">宗教场所录入</p>
+    <div class="formArea">
+      <p class="miniTitle">基础信息</p>
+      <van-cell-group>
+        <van-field
+          v-model="placeActivity.place"
+          readonly
+          label="所属宗教:"
+          placeholder="请选择宗教"
+          input-align="right"
+          right-icon="arrow-down"
+          @click="showPlace = true"
+        />
+        <van-popup v-model:show="showPlace" round position="bottom">
+          <van-picker
+            title="宗教选择"
+            :columns="places"
+            @cancel="showPlace = false"
+            @confirm="getPlace"
+          />
+        </van-popup>
+      </van-cell-group>
+      <van-cell-group>
+        <van-field
+          v-model="placeActivity.activityPlace"
+          center
+          readonly
+          label="所属县(区):"
+          placeholder="请填写所属县(区)"
+          input-align="right"
+          right-icon="arrow-down"
+          @click="showArea = true"
+        />
+        <van-popup v-model:show="showArea" round position="bottom">
+          <van-cascader
+            v-model="cascaderValue"
+            title="请选择所在地区"
+            :options="options"
+            @close="showArea = false"
+            @finish="onFinish"
+          />
+        </van-popup>
+      </van-cell-group>
+      <van-cell-group>
+        <van-field
+          v-model="placeActivity.address"
+          center
+          label="具体地址:"
+          placeholder="请填写具体地址"
+          input-align="right"
+          right-icon="location"
+        />
+      </van-cell-group>
+      <van-cell-group>
+        <van-field
+          v-model="placeActivity.money"
+          center
+          label="场所名称:"
+          placeholder="请填写场所名称"
+          input-align="right"
+        />
+      </van-cell-group>
+      <van-cell-group>
+        <van-field
+          v-model="placeActivity.money"
+          center
+          label="联络人姓名:"
+          placeholder="请填写联络人姓名"
+          input-align="right"
+        />
+      </van-cell-group>
+      <van-cell-group>
+        <van-field
+          v-model="placeActivity.money"
+          center
+          label="联系方式:"
+          placeholder="请填写联络人联系方式"
+          input-align="right"
+        />
+      </van-cell-group>
+      <van-cell-group>
+        <van-field name="uploader" label="外景照片:">
+          <template #input>
+            <van-uploader :after-read="afterRead" />
+          </template>
+        </van-field>
+      </van-cell-group>
+      <van-cell-group>
+        <van-field name="uploader" label="内景照片:">
+          <template #input>
+            <van-uploader :after-read="afterRead" />
+          </template>
+        </van-field>
+      </van-cell-group>
+    </div>
+    <div class="subbtn">
+      <van-button type="primary">提交</van-button>
+      <van-button type="default" hairline>取消</van-button>
+    </div>
+  </div>
+</template>
+
+<script>
+import { reactive, ref } from "vue";
+export default {
+  setup() {
+    const goback = () => {
+      history.back();
+    };
+    //场所录入
+    const placeActivity = reactive({
+      activity: "",
+      place: "",
+      activityTime: "",
+      countPerson: "",
+      list: "",
+      portname: "",
+      area: "",
+      activityPlace: "",
+      address: "",
+      money: "",
+      activityName: "",
+      tel: "",
+      file: "",
+      into: "",
+    });
+    // 宗教名称
+    const places = [
+      { text: "基督教", value: "基督教" },
+      { text: "佛教", value: "佛教" },
+      { text: "伊斯兰教", value: "伊斯兰教" },
+    ];
+    let showPlace = ref(false);
+    const getPlace = ({ selectedOptions }) => {
+      showPlace.value = false;
+      placeActivity.place = selectedOptions[0].text;
+    };
+    //图片上传
+    const afterRead = (file) => {
+      // 此时可以自行将文件上传至服务器
+      console.log(file);
+    };
+
+    // 地区选择
+    let showArea = ref(false);
+    const cascaderValue = ref("");
+    // 选项列表,children 代表子选项,支持多级嵌套
+    const options = [
+      {
+        text: "浙江省",
+        value: "330000",
+        children: [{ text: "杭州市", value: "330100" }],
+      },
+      {
+        text: "江苏省",
+        value: "320000",
+        children: [{ text: "南京市", value: "320100" }],
+      },
+    ];
+    // 全部选项选择完毕后,会触发 finish 事件
+    const onFinish = ({ selectedOptions }) => {
+      showArea.value = false;
+      placeActivity.activityPlace = selectedOptions
+        .map((option) => option.text)
+        .join("/");
+    };
+    return {
+      placeActivity,
+      // 活动场所
+      showPlace,
+      places,
+      getPlace,
+      //图片上传
+      afterRead,
+      // 返回
+      goback,
+      // 地区选择
+      showArea,
+      options,
+      onFinish,
+      cascaderValue,
+    };
+  },
+};
+</script>
+
+<style lang="less">
+body,
+html {
+  margin: 0;
+  padding: 0;
+}
+.van-nav-bar {
+  background-color: #36a7f3;
+  .van-nav-bar__title {
+    color: #fff;
+  }
+  .van-badge__wrapper {
+    color: #fff;
+  }
+}
+.main p {
+  height: 40px;
+  line-height: 40px;
+  color: #36a7f3;
+  border-bottom: 1px solid #eee;
+}
+.title {
+  font-size: 20px;
+  font-weight: 700;
+  padding-left: 20px;
+}
+.miniTitle {
+  font-size: 16px;
+}
+.formArea {
+  padding: 0px 20px;
+}
+.formArea .van-cell-group .van-field__label {
+  height: 40px;
+}
+.formArea .van-cell-group .van-cell {
+  line-height: 40px;
+}
+.van-cell__value .van-field__right-icon .van-icon-location {
+  color: #36a7f3 !important;
+}
+.rowTextArea::v-deep .van-field__value {
+  width: 98%;
+  border: 2px solid #ccc;
+  border-radius: 10px;
+}
+.rowTextArea::v-deep .van-cell {
+  display: flow-root;
+}
+.subbtn {
+  margin: 20px;
+  text-align: center;
+}
+.subbtn .van-button {
+  width: 40%;
+  margin: 5px;
+}
+.van-uploader .van-button {
+  border: none;
+  color: #36a7f3;
+  top: -4px;
+}
+.van-dialog {
+  width: 80%;
+  top: 50%;
+}
+</style>

+ 0 - 0
src/views/placeManage/placeTablet.vue


+ 21 - 21
src/views/tab_a/tabAll.vue

@@ -21,7 +21,7 @@
 		<div class="tabtitle4">)</div>
 		<van-icon name="ellipsis" class="tabtitle5" />
 	</div>
-	
+
 	<div class="flexll">
 		<div class="ffl2">
 			<div class="textRegular">待处理</div>
@@ -38,7 +38,7 @@
 	<div class="tabtitlelay">
 		<div class="tabtitle1"></div>
 		<div class="tabtitle">场所管理</div>
-	</div>	
+	</div>
 
 	<van-grid :border="false">
 		<van-grid-item icon="photo-o" text="场所登记" @click="getsome2" />
@@ -51,7 +51,7 @@
 	<div class="tabtitlelay">
 		<div class="tabtitle1"></div>
 		<div class="tabtitle">活动管理</div>
-	</div>	
+	</div>
 
 	<van-grid :border="false" >
 		<van-grid-item icon="photo-o" text="场所活动" @click="getUser1"/>
@@ -75,14 +75,14 @@ import tool from "@/tool";
 				password:"",
 				password2:"",
 				con1:"0",
-			}			
+			}
 		},
-		
+
 		created(){
 			let id=this.$route.query.id;
 			this.getSome();
 			this.TokenLogin();
-			
+
 
 		},
 
@@ -91,7 +91,7 @@ import tool from "@/tool";
 				history.back();
 			},
 
-			
+
 
 			async TokenLogin(){
 
@@ -105,10 +105,10 @@ import tool from "@/tool";
 				// 	'token': token
 				// 	}
 				// 	var res = await this.$API.yin.TokenLogin.get(inputForm);
-					
+
 				// })
 
-				
+
 				const inputForm ={
 					'token': "ssssssss"
 				}
@@ -130,14 +130,14 @@ import tool from "@/tool";
 
 
 			getSome(){
-	
+
 
 			},
 
 			async getsome2(){
 
-				let that=this;			
-				
+				let that=this;
+
 				//SDK中 getToken() 方法获取免登token
 				window.xm.getToken().then(function(token){
 					console.log(token);
@@ -160,7 +160,7 @@ import tool from "@/tool";
 
 				//var res = await this.$API.yin.TokenLogin.post(inputForm);
 				var res = await this.$API.yin.SchemaService.post(inputForm);
-				
+
                 if (res.type == 1) {
                     this.$router.replace({
                         path: "/main",
@@ -173,7 +173,7 @@ import tool from "@/tool";
 
 			async getsome3(){
 				console.log("11");
-				
+
 				var datas = {
 					username: "admin",
             	};
@@ -201,7 +201,7 @@ import tool from "@/tool";
 					'sign': '个性签名2',
 				  }
 				var res = await this.$API.yin.UserCreateService.post(inputForm);
-				
+
                 console.log(res);
 			},
 			//(用户更新)
@@ -224,7 +224,7 @@ import tool from "@/tool";
 				  }
 				var res = await this.$API.yin.UserUpdateService.post(inputForm);
 				console.log(res);
-                
+
 			},
 			//(用户删除)
 			async getUser3(){
@@ -234,16 +234,16 @@ import tool from "@/tool";
 					'iamRemotePwd': '111',
 					'uid': '1639158103696228354',
 				  }
-				var res = await this.$API.yin.UserDeleteService.post(inputForm);				
+				var res = await this.$API.yin.UserDeleteService.post(inputForm);
                 console.log(res);
-				
+
 			},
 
 		},
-	 
+
 	};
 </script>
 
 <style>
-	
-</style>
+
+</style>

+ 153 - 269
src/views/toBeDone/toBeDone.vue

@@ -1,12 +1,5 @@
 <template>
-  <van-row class="header">
-    <van-col span="2">
-      <van-icon name="arrow-left" color="#ffffff" @click="goback"/>
-    </van-col>
-    <van-col span="22">
-      <h3 style="color: #fff">我的待办</h3>
-    </van-col>
-  </van-row>
+  <van-nav-bar title="我的待办" left-arrow @click-left="goback" />
   <van-tabs
     v-model:active="active"
     title-inactive-color="#bdbdbd"
@@ -14,287 +7,47 @@
   >
     <van-tab title="待处理">
       <div class="list1">
-        <van-row class="list-item">
+        <van-row class="list-item" v-for="item in toBeDone.DoneList1" :key="item.dateTime">
           <van-col span="6" class="list-item-left">
             <div>
-              <p style="color: #a3a3a3">2022.12.01</p>
-              <p style="color: #a3a3a3">11:32</p>
+              <p style="color: #a3a3a3">{{item.dateTime}}</p>
+              <p style="color: #a3a3a3">{{item.timer}}</p>
             </div>
-            <p style="color: red; margin-top: 10px">待处理</p>
+            <p style="color: red; margin-top: 10px">待处理{{item.state}}</p>
           </van-col>
           <van-col span="18" style="border-left: 1px solid #e3e3e3" class="list-item-right">
             <van-row>
               <van-col span="24">
-                <span>东台市南阳镇菩提寺需要于12.12日晚8点举办祈福活动,请审核。</span>
+                <span>{{item.title}}</span>
               </van-col>
             </van-row>
             <van-row justify="space-between">
-              <van-col span="12">盐城-东台-南阳镇</van-col>
-              <van-col span="8">一般交办</van-col>
+              <van-col span="12">{{item.address}}</van-col>
+              <van-col span="8">{{item.type}}交办</van-col>
             </van-row>
           </van-col>
-        </van-row>
-        <van-row class="list-item">
-          <van-col span="6" class="list-item-left">
-            <div>
-              <p style="color: #a3a3a3">2022.12.01</p>
-              <p style="color: #a3a3a3">11:32</p>
-            </div>
-            <p style="color: red; margin-top: 10px">待处理</p>
-          </van-col>
-          <van-col span="18" style="border-left: 1px solid #e3e3e3" class="list-item-right">
-            <van-row>
-              <van-col span="24">
-                <span>东台市南阳镇菩提寺需要于12.12日晚8点举办祈福活动,请审核。</span>
-              </van-col>
-            </van-row>
-            <van-row justify="space-between">
-              <van-col span="12">盐城-东台-南阳镇</van-col>
-              <van-col span="8">一般交办</van-col>
-            </van-row>
-          </van-col>
-        </van-row>
-        <van-row class="list-item">
-          <van-col span="6" class="list-item-left">
-            <div>
-              <p style="color: #a3a3a3">2022.12.01</p>
-              <p style="color: #a3a3a3">11:32</p>
-            </div>
-            <p style="color: red; margin-top: 10px">待处理</p>
-          </van-col>
-          <van-col span="18" style="border-left: 1px solid #e3e3e3" class="list-item-right">
-            <van-row>
-              <van-col span="24">
-                <span>东台市南阳镇菩提寺需要于12.12日晚8点举办祈福活动,请审核。</span>
-              </van-col>
-            </van-row>
-            <van-row justify="space-between">
-              <van-col span="12">盐城-东台-南阳镇</van-col>
-              <van-col span="8">一般交办</van-col>
-            </van-row>
-          </van-col>
-        </van-row>
-        <van-row class="list-item">
-          <van-col span="6" class="list-item-left">
-            <div>
-              <p style="color: #a3a3a3">2022.12.01</p>
-              <p style="color: #a3a3a3">11:32</p>
-            </div>
-            <p style="color: red; margin-top: 10px">待处理</p>
-          </van-col>
-          <van-col span="18" style="border-left: 1px solid #e3e3e3" class="list-item-right">
-            <van-row>
-              <van-col span="24">
-                <span>东台市南阳镇菩提寺需要于12.12日晚8点举办祈福活动,请审核。</span>
-              </van-col>
-            </van-row>
-            <van-row justify="space-between">
-              <van-col span="12">盐城-东台-南阳镇</van-col>
-              <van-col span="8">一般交办</van-col>
-            </van-row>
-          </van-col>
-        </van-row>
-        <van-row class="list-item">
-          <van-col span="6" class="list-item-left">
-            <div>
-              <p style="color: #a3a3a3">2022.12.01</p>
-              <p style="color: #a3a3a3">11:32</p>
-            </div>
-            <p style="color: red; margin-top: 10px">待处理</p>
-          </van-col>
-          <van-col span="18" style="border-left: 1px solid #e3e3e3" class="list-item-right">
-            <van-row>
-              <van-col span="24">
-                <span>东台市南阳镇菩提寺需要于12.12日晚8点举办祈福活动,请审核。</span>
-              </van-col>
-            </van-row>
-            <van-row justify="space-between">
-              <van-col span="12">盐城-东台-南阳镇</van-col>
-              <van-col span="8">一般交办</van-col>
-            </van-row>
-          </van-col>
-        </van-row>
-        <van-row class="list-item">
-          <van-col span="6" class="list-item-left">
-            <div>
-              <p style="color: #a3a3a3">2022.12.01</p>
-              <p style="color: #a3a3a3">11:32</p>
-            </div>
-            <p style="color: red; margin-top: 10px">待处理</p>
-          </van-col>
-          <van-col span="18" style="border-left: 1px solid #e3e3e3" class="list-item-right">
-            <van-row>
-              <van-col span="24">
-                <span>东台市南阳镇菩提寺需要于12.12日晚8点举办祈福活动,请审核。</span>
-              </van-col>
-            </van-row>
-            <van-row justify="space-between">
-              <van-col span="12">盐城-东台-南阳镇</van-col>
-              <van-col span="8">一般交办</van-col>
-            </van-row>
-          </van-col>
-        </van-row>
-        <van-row class="list-item">
-          <van-col span="6" class="list-item-left">
-            <div>
-              <p style="color: #a3a3a3">2022.12.01</p>
-              <p style="color: #a3a3a3">11:32</p>
-            </div>
-            <p style="color: red; margin-top: 10px">待处理</p>
-          </van-col>
-          <van-col span="18" style="border-left: 1px solid #e3e3e3" class="list-item-right">
-            <van-row>
-              <van-col span="24">
-                <span>东台市南阳镇菩提寺需要于12.12日晚8点举办祈福活动,请审核。</span>
-              </van-col>
-            </van-row>
-            <van-row justify="space-between">
-              <van-col span="12">盐城-东台-南阳镇</van-col>
-              <van-col span="8">一般交办</van-col>
-            </van-row>
-          </van-col>
-        </van-row>
+        </van-row> 
       </div>
     </van-tab>
-    <van-tab title="已处理"> 
+    <van-tab title="已处理">
       <div class="list1">
-        <van-row class="list-item">
-          <van-col span="6" class="list-item-left">
-            <div>
-              <p style="color: #a3a3a3">2022.12.01</p>
-              <p style="color: #a3a3a3">11:32</p>
-            </div>
-            <p style="color: red; margin-top: 10px">已处理</p>
-          </van-col>
-          <van-col span="18" style="border-left: 1px solid #e3e3e3" class="list-item-right">
-            <van-row>
-              <van-col span="24">
-                <span>东台市南阳镇菩提寺需要于12.12日晚8点举办祈福活动,请审核。</span>
-              </van-col>
-            </van-row>
-            <van-row justify="space-between">
-              <van-col span="12">盐城-东台-南阳镇</van-col>
-              <van-col span="8">一般交办</van-col>
-            </van-row>
-          </van-col>
-        </van-row>
-        <van-row class="list-item">
-          <van-col span="6" class="list-item-left">
-            <div>
-              <p style="color: #a3a3a3">2022.12.01</p>
-              <p style="color: #a3a3a3">11:32</p>
-            </div>
-            <p style="color: red; margin-top: 10px">已处理</p>
-          </van-col>
-          <van-col span="18" style="border-left: 1px solid #e3e3e3" class="list-item-right">
-            <van-row>
-              <van-col span="24">
-                <span>东台市南阳镇菩提寺需要于12.12日晚8点举办祈福活动,请审核。</span>
-              </van-col>
-            </van-row>
-            <van-row justify="space-between">
-              <van-col span="12">盐城-东台-南阳镇</van-col>
-              <van-col span="8">一般交办</van-col>
-            </van-row>
-          </van-col>
-        </van-row>
-        <van-row class="list-item">
-          <van-col span="6" class="list-item-left">
-            <div>
-              <p style="color: #a3a3a3">2022.12.01</p>
-              <p style="color: #a3a3a3">11:32</p>
-            </div>
-            <p style="color: red; margin-top: 10px">已处理</p>
-          </van-col>
-          <van-col span="18" style="border-left: 1px solid #e3e3e3" class="list-item-right">
-            <van-row>
-              <van-col span="24">
-                <span>东台市南阳镇菩提寺需要于12.12日晚8点举办祈福活动,请审核。</span>
-              </van-col>
-            </van-row>
-            <van-row justify="space-between">
-              <van-col span="12">盐城-东台-南阳镇</van-col>
-              <van-col span="8">一般交办</van-col>
-            </van-row>
-          </van-col>
-        </van-row>
-        <van-row class="list-item">
-          <van-col span="6" class="list-item-left">
-            <div>
-              <p style="color: #a3a3a3">2022.12.01</p>
-              <p style="color: #a3a3a3">11:32</p>
-            </div>
-            <p style="color: red; margin-top: 10px">已处理</p>
-          </van-col>
-          <van-col span="18" style="border-left: 1px solid #e3e3e3" class="list-item-right">
-            <van-row>
-              <van-col span="24">
-                <span>东台市南阳镇菩提寺需要于12.12日晚8点举办祈福活动,请审核。</span>
-              </van-col>
-            </van-row>
-            <van-row justify="space-between">
-              <van-col span="12">盐城-东台-南阳镇</van-col>
-              <van-col span="8">一般交办</van-col>
-            </van-row>
-          </van-col>
-        </van-row>
-        <van-row class="list-item">
-          <van-col span="6" class="list-item-left">
-            <div>
-              <p style="color: #a3a3a3">2022.12.01</p>
-              <p style="color: #a3a3a3">11:32</p>
-            </div>
-            <p style="color: red; margin-top: 10px">已处理</p>
-          </van-col>
-          <van-col span="18" style="border-left: 1px solid #e3e3e3" class="list-item-right">
-            <van-row>
-              <van-col span="24">
-                <span>东台市南阳镇菩提寺需要于12.12日晚8点举办祈福活动,请审核。</span>
-              </van-col>
-            </van-row>
-            <van-row justify="space-between">
-              <van-col span="12">盐城-东台-南阳镇</van-col>
-              <van-col span="8">一般交办</van-col>
-            </van-row>
-          </van-col>
-        </van-row>
-        <van-row class="list-item">
+        <van-row class="list-item" v-for="item in toBeDone.DoneList2" :key="item.dateTime">
           <van-col span="6" class="list-item-left">
             <div>
-              <p style="color: #a3a3a3">2022.12.01</p>
-              <p style="color: #a3a3a3">11:32</p>
+              <p style="color: #a3a3a3">{{item.dateTime}}</p>
+              <p style="color: #a3a3a3">{{item.timer}}</p>
             </div>
-            <p style="color: red; margin-top: 10px">已处理</p>
+            <p style="color: red; margin-top: 10px">已处理{{item.state}}</p>
           </van-col>
           <van-col span="18" style="border-left: 1px solid #e3e3e3" class="list-item-right">
             <van-row>
               <van-col span="24">
-                <span>东台市南阳镇菩提寺需要于12.12日晚8点举办祈福活动,请审核。</span>
+                <span>{{item.title}}</span>
               </van-col>
             </van-row>
             <van-row justify="space-between">
-              <van-col span="12">盐城-东台-南阳镇</van-col>
-              <van-col span="8">一般交办</van-col>
-            </van-row>
-          </van-col>
-        </van-row>
-        <van-row class="list-item">
-          <van-col span="6" class="list-item-left">
-            <div>
-              <p style="color: #a3a3a3">2022.12.01</p>
-              <p style="color: #a3a3a3">11:32</p>
-            </div>
-            <p style="color: red; margin-top: 10px">已处理</p>
-          </van-col>
-          <van-col span="18" style="border-left: 1px solid #e3e3e3" class="list-item-right">
-            <van-row>
-              <van-col span="24">
-                <span>东台市南阳镇菩提寺需要于12.12日晚8点举办祈福活动,请审核。</span>
-              </van-col>
-            </van-row>
-            <van-row justify="space-between">
-              <van-col span="12">盐城-东台-南阳镇</van-col>
-              <van-col span="8">一般交办</van-col>
+              <van-col span="12">{{item.address}}</van-col>
+              <van-col span="8">{{item.type}}交办</van-col>
             </van-row>
           </van-col>
         </van-row>
@@ -304,13 +57,142 @@
 </template>
 
 <script>
+import {reactive,ref} from "vue"
 export default {
+  beforeCreate() {
+    this.dealWith()
+  },
   setup() {
+    const toBeDone =reactive({
+      toBeDoneList:[
+        {
+          dateTime:'2022.12.01',//日期
+          timer:'11:32',//时间
+          state:1,//处理状态
+          title:'东台市南阳镇菩提寺需要于12.12日晚8点举办祈福活动,请审核。',//事件标题
+          address:'盐城-东台-南阳镇',//举办地点
+          type:'一般'//交办类型
+        },
+        {
+          dateTime:'2022.12.01',//日期
+          timer:'11:32',//时间
+          state:1,//处理状态
+          title:'东台市南阳镇菩提寺需要于12.12日晚8点举办祈福活动,请审核。',//事件标题
+          address:'盐城-东台-南阳镇',//举办地点
+          type:'一般'//交办类型
+        },
+        {
+          dateTime:'2022.12.01',//日期
+          timer:'11:32',//时间
+          state:0,//处理状态
+          title:'东台市南阳镇菩提寺需要于12.12日晚8点举办祈福活动,请审核。',//事件标题
+          address:'盐城-东台-南阳镇',//举办地点
+          type:'一般'//交办类型
+        },
+        {
+          dateTime:'2022.12.01',//日期
+          timer:'11:32',//时间
+          state:0,//处理状态
+          title:'东台市南阳镇菩提寺需要于12.12日晚8点举办祈福活动,请审核。',//事件标题
+          address:'盐城-东台-南阳镇',//举办地点
+          type:'一般'//交办类型
+        },
+        {
+          dateTime:'2022.12.01',//日期
+          timer:'11:32',//时间
+          state:1,//处理状态
+          title:'东台市南阳镇菩提寺需要于12.12日晚8点举办祈福活动,请审核。',//事件标题
+          address:'盐城-东台-南阳镇',//举办地点
+          type:'一般'//交办类型
+        },
+        {
+          dateTime:'2022.12.01',//日期
+          timer:'11:32',//时间
+          state:1,//处理状态
+          title:'东台市南阳镇菩提寺需要于12.12日晚8点举办祈福活动,请审核。',//事件标题
+          address:'盐城-东台-南阳镇',//举办地点
+          type:'一般'//交办类型
+        },
+        {
+          dateTime:'2022.12.01',//日期
+          timer:'11:32',//时间
+          state:0,//处理状态
+          title:'东台市南阳镇菩提寺需要于12.12日晚8点举办祈福活动,请审核。',//事件标题
+          address:'盐城-东台-南阳镇',//举办地点
+          type:'一般'//交办类型
+        }
+        ,{
+          dateTime:'2022.12.01',//日期
+          timer:'11:32',//时间
+          state:1,//处理状态
+          title:'东台市南阳镇菩提寺需要于12.12日晚8点举办祈福活动,请审核。',//事件标题
+          address:'盐城-东台-南阳镇',//举办地点
+          type:'一般'//交办类型
+        },{
+          dateTime:'2022.12.01',//日期
+          timer:'11:32',//时间
+          state:0,//处理状态
+          title:'东台市南阳镇菩提寺需要于12.12日晚8点举办祈福活动,请审核。',//事件标题
+          address:'盐城-东台-南阳镇',//举办地点
+          type:'一般'//交办类型
+        },{
+          dateTime:'2022.12.01',//日期
+          timer:'11:32',//时间
+          state:1,//处理状态
+          title:'东台市南阳镇菩提寺需要于12.12日晚8点举办祈福活动,请审核。',//事件标题
+          address:'盐城-东台-南阳镇',//举办地点
+          type:'一般'//交办类型
+        },{
+          dateTime:'2022.12.01',//日期
+          timer:'11:32',//时间
+          state:0,//处理状态
+          title:'东台市南阳镇菩提寺需要于12.12日晚8点举办祈福活动,请审核。',//事件标题
+          address:'盐城-东台-南阳镇',//举办地点
+          type:'一般'//交办类型
+        },{
+          dateTime:'2022.12.01',//日期
+          timer:'11:32',//时间
+          state:0,//处理状态
+          title:'东台市南阳镇菩提寺需要于12.12日晚8点举办祈福活动,请审核。',//事件标题
+          address:'盐城-东台-南阳镇',//举办地点
+          type:'一般'//交办类型
+        }
+        ,{
+          dateTime:'2022.12.01',//日期
+          timer:'11:32',//时间
+          state:0,//处理状态
+          title:'东台市南阳镇菩提寺需要于12.12日晚8点举办祈福活动,请审核。',//事件标题
+          address:'盐城-东台-南阳镇',//举办地点
+          type:'一般'//交办类型
+        }
+        ,{
+          dateTime:'2022.12.01',//日期
+          timer:'11:32',//时间
+          state:0,//处理状态
+          title:'东台市南阳镇菩提寺需要于12.12日晚8点举办祈福活动,请审核。',//事件标题
+          address:'盐城-东台-南阳镇',//举办地点
+          type:'一般'//交办类型
+        }
+      ],
+      DoneList1:[],
+      DoneList2:[],
+    })
+    const dealWith = ()=>{
+      toBeDone.toBeDoneList.forEach(item=>{
+        if(item.state===1){
+          toBeDone.DoneList1.push(item)
+        }else{
+          toBeDone.DoneList2.push(item)
+        }
+      })
+    }
     const goback = ()=>{
       history.back();
     }
     return {
       goback,
+      toBeDone,
+      dealWith
     }
   }
 };
@@ -323,11 +205,13 @@ html {
   padding: 0;
   background-color: #f2f2f2;
 }
-.header {
-  background-color: #39a9ed;
-  .van-col {
-    text-align: center;
-    margin: auto;
+.van-nav-bar {
+  background-color: #36a7f3;
+  .van-nav-bar__title {
+    color: #fff;
+  }
+  .van-badge__wrapper {
+    color: #fff;
   }
 }
 .list1 {

+ 68 - 18
src/views/toBeDone/toBeDone_details.vue

@@ -1,20 +1,40 @@
 <template>
-  <van-row class="header">
-    <van-col span="2">
-      <van-icon name="arrow-left" color="#ffffff" @click="goback" />
-    </van-col>
-    <van-col span="22">
-      <h3 style="color: #fff">我的待办</h3>
-    </van-col>
-  </van-row>
+  <van-nav-bar title="我的待办" left-arrow @click-left="goback" />
   <div class="banner">
     <h2>扎实提升“三力”</h2>
     <h2>深入推进“三化”</h2>
     <h2>坚持“三个思维”</h2>
   </div>
   <div class="content">
-    
+    <div class="content-top">
+        <p>问题内容:</p>
+        <p>东台市南阳镇菩提寺需要于12.12日晚8点举办祈福活动,请审核。</p>
+        <p>发起部门:场所一</p>
+        <p>发起人:场所负责人李毅</p>
+        <p>交办类型:一般</p>
+        <p>问题发生区域:东台市南阳镇</p>
+        <p>问题场所:菩提寺</p>
+        <p>详细地址:东台南阳镇菩提村2号</p>
+        <p>发生时间:2022.12.04 11:26</p>
+        <p>截止时间:2022.12.11 11:26</p>
+        <p>问题附件:<span style="color:#6892ff;">活动申请书</span></p>
+    </div>
+    <div class="content-bottom">
+        <p>
+          处理结果:
+        </p>
+        <div>
+          <form action="">
+            <textarea name="" id="" cols="40" rows="5"></textarea>
+          </form>
+        </div>
+        <div style="margin-top:10px;">
+          处理证据资料:<img class="uploadImg" src="../../assets/upload.png" alt=""><span  style="color:#58b5f5;font-size:14px;">点击上传</span>
+        </div>
+    </div>
+     <van-button type="primary">确认</van-button>
   </div>
+ 
 </template>
 
 <script>
@@ -23,6 +43,7 @@ export default {
     const goback = () => {
       history.back();
     };
+    
     return {
       goback,
     };
@@ -37,19 +58,23 @@ html {
   padding: 0;
   background-color: #f2f2f2;
 }
-.header {
-  background-color: #39a9ed;
-  .van-col {
-    text-align: center;
-    margin: auto;
+.van-nav-bar {
+  background-color: #36a7f3;
+  border: none;
+  .van-nav-bar__title {
+    color: #fff;
+  }
+  .van-badge__wrapper {
+    color: #fff;
   }
 }
 .banner{
-    background-color: #39a9ed;
+    background-color: #36a7f3;
     padding: 20px 50px 40px 50px;
     color: #fff;
     h2{
         &:nth-child(1){
+            margin-top:0px;
             text-align: left;
         }
         &:nth-child(2){
@@ -62,13 +87,38 @@ html {
 }
 .content{
     position: fixed;
-    min-width: 90%;
-    height: 600px;
-    top: 260px;
+    width: 85%;
+    height: 640px;
+    top: 240px;
     left: 50%;
+    padding: 20px 10px;
     transform: translateX(-50%);
     background-color: #fff;
     border-radius: 10px;
+    .content-top{
+        padding-bottom: 30px;
+        border-bottom: 2px solid #e7e7e7;
+        p{
+            margin: 0;
+            padding: 0;
+            margin-bottom: 10px;
+            &:nth-child(2){
+                margin-bottom: 40px;
+            }
+        }
+    }
+    .van-button{
+      width: 100%;
+      border-radius:20px;
+    }
+    .content-bottom{
+      margin-bottom: 30px;
+      .uploadImg{
+        width: 30px;
+        height: 30px;
+        vertical-align: middle;
+      }
+    }
 }
 
 </style>

Kaikkia tiedostoja ei voida näyttää, sillä liian monta tiedostoa muuttui tässä diffissä