活动场所详情页和测试接口

src/api/index.js

@@ -1,50 +1,51 @@
-import http  from "@/utils/request";
+import http from "@/utils/request";
 import config from "@/config"
 
-export default  {
-    login : {
-        VerifyLogin : {
-            url:`${config.baseUrl}/Mobile/VerifyLogin`,
-            name:'测试',
-            post : function(params){
-                return http.post(this.url,params)
+export default {
+    login: {
+        VerifyLogin: {
+            url: `${config.baseUrl}/Mobile/VerifyLogin`,
+            name: '测试',
+            post: function(params) {
+                return http.post(this.url, params)
             }
         }
     },
     // 商品列表
-    main : {
-        ProductList : {
-            url:`${config.baseUrl}/Mobile/ProductList`,
-            name:'测试',
-            get : function(params){
-                return http.get(this.url,params)
+    main: {
+        ProductList: {
+            url: `${config.baseUrl}/Mobile/ProductList`,
+            name: '测试',
+            get: function(params) {
+                return http.get(this.url, params)
             }
         }
     },
     my: {
-        OrderList : {
-            url:`${config.baseUrl}/Mobile/OrderList`,
-            name:'测试',
-            get : function(params){
-                return http.get(this.url,params)
+        OrderList: {
+            url: `${config.baseUrl}/Mobile/OrderList`,
+            name: '测试',
+            get: function(params) {
+                return http.get(this.url, params)
             }
         },
-        OrderDetails : {
-            url:`${config.baseUrl}/api/accountApi/gettIsDealCount`,
-            name:'测试',
-            get : function(params){
-                return http.get(this.url,params)
+        OrderDetails: {
+            url: `${config.baseUrl}/api/accountApi/gettIsDealCount`,
+            name: '测试',
+            get: function(params) {
+                return http.get(this.url, params)
             }
         }
     },
-    order : {
-        SaveOrder : {
-            url:`${config.baseUrl}/sys/login`,
-            name:'测试',
-            post : function(params){
-                return http.post(this.url,params)
+    order: {
+        SaveOrder: {
+            url: `${config.baseUrl}/sys/login`,
+            name: '测试',
+            post: function(params) {
+                return http.post(this.url, params)
             }
         }
     },
-}
+    // 测试接口
 
+}

src/config/index.js

@@ -1,13 +1,11 @@
-var defaultConfig = {
+const config = {
 
-    baseUrl : '/api',
-  
-    timeout : '50000',
+    baseUrl: '/api',
 
-    api_key : '8C21178A017E712134B0FA9642F1ECDD049C13808219AF7EA4C8AFB0FF56AECA',
+    timeout: '50000',
 
-    ContentType : 'Content-Type'
-}
-
-export default defaultConfig;
+    api_key: '8C21178A017E712134B0FA9642F1ECDD049C13808219AF7EA4C8AFB0FF56AECA',
 
+    ContentType: 'application/json;charset=UTF-8'
+}
+export default config;

src/main.js

@@ -8,7 +8,7 @@ import axios from 'axios';
 
 
 
-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 } 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, SwipeCell } from 'vant';
 import 'vant/lib/index.css';
 import store from './store';
 
@@ -45,6 +45,7 @@ app.use(router)
     .use(Search)
     .use(RadioGroup)
     .use(Radio)
+    .use(SwipeCell)
 
 app.config.globalProperties.$API = api
 app.config.globalProperties.$axios = axios

src/router/index.js

@@ -80,6 +80,14 @@ const routes = [{
         meta: {
             isShowTarbar: true,
         }
+    }, {
+        path: '/placeActivityInfo',
+        name: 'placeActivityInfo',
+        component: () =>
+            import ('../views/activityMan/placeactivity/placeActivityInfo.vue'),
+        meta: {
+            isShowTarbar: true,
+        }
     }, {
         path: '/selfMeetingList',
         name: 'selfMeetingList',

src/styles/index.css

@@ -1,131 +1,158 @@
 /*公用样式 开始----*/
+
+
 /*字体黑，正文常用*/
-.textRegular{
-	font-size: 12sp;
-	color: #262A30;
-}
-.textRed{
-	font-size: 13sp;
-	color: red;
-	font-weight: 700;
-	padding-top: 8px;
-}
-.textBlue{
-	font-size: 13sp;
-	color:#00aaff;
-	font-weight: 700;
-	padding-top: 8px;
-}
-.verticalLine{
-	width: 2px;
-	margin-top: 10px;
-	margin-bottom: 12px;	
-	background-color: rgb(236, 232, 232);
-}
-.hLine{
-	width: 100%;
-	height: 5px;
-	margin-bottom: 12px;	
-	background-color: #F2F2F2;
-}
-.flexll{
-	display: flex;
-}
-.flexll2{
-	display: flex;
-	flex-direction: column;
+
+.textRegular {
+    font-size: 12sp;
+    color: #262A30;
+}
+
+.textRed {
+    font-size: 13sp;
+    color: red;
+    font-weight: 700;
+    padding-top: 8px;
+}
+
+.textBlue {
+    font-size: 13sp;
+    color: #00aaff;
+    font-weight: 700;
+    padding-top: 8px;
+}
+
+.verticalLine {
+    width: 2px;
+    margin-top: 10px;
+    margin-bottom: 12px;
+    background-color: rgb(236, 232, 232);
 }
 
+.hLine {
+    width: 100%;
+    height: 5px;
+    margin-bottom: 12px;
+    background-color: #F2F2F2;
+}
+
+.flexll {
+    display: flex;
+}
+
+.flexll2 {
+    display: flex;
+    flex-direction: column;
+}
+
+
 /*----公用样式 结束*/
 
+
 /*页面*/
-.d1{
-	display: flex;
-	width: 100%;	
-	justify-content: center;
+
+.d1 {
+    display: flex;
+    width: 100%;
+    justify-content: center;
 }
-.logo{		
-	width: 20%;
-	padding-top: 90px;
-	margin-bottom: 80px;
+
+.logo {
+    width: 20%;
+    padding-top: 90px;
+    margin-bottom: 80px;
 }
-.changetype{		
-	color: #00aaff;
-	font-size: 3px;
-	padding-top: 30px;
-	padding-left: 30px;
-	padding-bottom: 10px;
+
+.changetype {
+    color: #00aaff;
+    font-size: 3px;
+    padding-top: 30px;
+    padding-left: 30px;
+    padding-bottom: 10px;
 }
 
+
 /*tabAll */
-.tabtitlelay{
-	display: flex;
-	border-bottom: 2px rgb(236, 232, 232) solid;
+
+.tabtitlelay {
+    display: flex;
+    border-bottom: 2px rgb(236, 232, 232) solid;
 }
-.tabtitle1{
-	width: 8px;
-	margin-top: 10px;
-	margin-left: 10px;
-	margin-right: 8px;
-	margin-bottom: 12px;
-	height: 23px;	
-	background-color: #0293EB;
+
+.tabtitle1 {
+    width: 8px;
+    margin-top: 10px;
+    margin-left: 10px;
+    margin-right: 8px;
+    margin-bottom: 12px;
+    height: 23px;
+    background-color: #0293EB;
 }
-.tabtitle{
-	margin-top: 12px;
-	margin-bottom: 12px;
-	font-weight: bold;
+
+.tabtitle {
+    margin-top: 12px;
+    margin-bottom: 12px;
+    font-weight: bold;
 }
-.tabtitle2{
-	margin-top: 12px;
+
+.tabtitle2 {
+    margin-top: 12px;
 }
-.tabtitle3{
-	margin-top: 12px;
-	color: red;
+
+.tabtitle3 {
+    margin-top: 12px;
+    color: red;
 }
-.tabtitle4{
-	margin-top: 12px;
+
+.tabtitle4 {
+    margin-top: 12px;
 }
-.tabtitle5{
-	margin-left: auto;
-	padding-left: 20px;
-	padding-right: 20px;
-	padding-top: 12px;
-	padding-bottom: 12px;
+
+.tabtitle5 {
+    margin-left: auto;
+    padding-left: 20px;
+    padding-right: 20px;
+    padding-top: 12px;
+    padding-bottom: 12px;
 }
 
-.ffl2{
-	flex-grow: 1;
-	display: flex;
-	flex-direction: column;
-	align-items: center;
-	padding: 20px;
+.ffl2 {
+    flex-grow: 1;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    padding: 20px;
 }
 
 
 /*setting */
-.touxiang{
-	margin-left: 50px;
-	margin-top: 50px;
+
+.touxiang {
+    margin-left: 50px;
+    margin-top: 50px;
 }
-.setffl{
-	display: flex;
-	flex-direction: column;
-	margin-top: 60px;
-	margin-left: 15px;
+
+.setffl {
+    display: flex;
+    flex-direction: column;
+    margin-top: 60px;
+    margin-left: 15px;
 }
-.settingtex1{
-	font-size: large;
+
+.settingtex1 {
+    font-size: large;
 }
-.settingtex2{
-	margin-top: 5px;
-	color: coral;
+
+.settingtex2 {
+    margin-top: 5px;
+    color: coral;
 }
-.settingtex3{
-	margin-top: 5px;
+
+.settingtex3 {
+    margin-top: 5px;
 }
 
-.settingtitlelay{
-	display: flex;
-	margin-top: 30px;
+.settingtitlelay {
+    display: flex;
+    margin-top: 30px;
 }

src/utils/request.js

@@ -1,12 +1,9 @@
-import axios from "axios";          //引入axios
-import sysConfig from '@/config'    //引入配置文件
-
-// console.log(process.env.NODE_ENV)
-
-axios.defaults.baseURL = sysConfig.baseURL   //设置请求时间
-axios.defaults.timeout = sysConfig.timeout   //设置请求超时时间
-const ContentType = sysConfig.ContentType
-axios.defaults.headers["Content-Type"] = "application/json";
+import axios from "axios"; //引入axios
+import sysConfig from '@/config' //引入配置文件
+axios.defaults.baseURL = sysConfig.baseUrl //设置请求时间
+axios.defaults.timeout = sysConfig.timeout //设置请求超时时间
+axios.defaults.withCredentials = true
+axios.defaults.headers = { 'Content-Type': 'application/json; charset=utf-8' };
 
 /** 请求发送前拦截，用于配置求情内容，如headers参数等 */
 axios.interceptors.request.use(
@@ -39,7 +36,7 @@ var http = {
      * @param {*} config    请求的config相关配置
      * @returns 
      */
-    get: function (url, params = {}, config = {}) {
+    get: function(url, params = {}, config = {}) {
         return new Promise((resolve, reject) => {
             axios({
                 url: url,
@@ -63,7 +60,7 @@ var http = {
      * @param {*} config   请求的config相关配置
      * @returns 
      */
-    post: function (url, data = {}, params = {}, config = {}) {
+    post: function(url, data = {}, params = {}, config = {}) {
         return new Promise((resolve, reject) => {
             axios({
                 url: url,
@@ -80,5 +77,4 @@ var http = {
     }
 }
 
-export default http;
-
+export default http;

src/views/activityMan/placeactivity/placeActivityInfo.vue

@@ -0,0 +1,77 @@
+<template>
+  <van-nav-bar
+    fixed
+    title="场所活动"
+    left-text=""
+    left-arrow
+    @click-left="onClickLeft"
+  />
+  <div class="banner"></div>
+  <div class="info">
+    <p>活动名称：{{ placeActivity.activity }}</p>
+    <p>场所名称：{{placeActivity.place}}</p>
+    <p>发起人：{{ placeActivity.portname }}</p>
+    <p>参会人数：{{placeActivity.countPerson}}</p>
+    <p>活动地点：{{placeActivity.activityPlace}}</p>
+    <p>详细地址：{{placeActivity.address}}</p>
+    <p>活动时间：{{placeActivity.activityTime}}</p>
+    <p>安全预案：<span style="color: #6892ff">活动申请书</span></p>
+    <p>主题内容：{{placeActivity.into}}</p>
+  </div>
+  <van-button type="primary" class="btn-sub">审核</van-button>
+</template>
+  
+  <script>
+import { reactive } from "vue";
+export default {
+  setup() {
+    const onClickLeft = () => {
+      history.back();
+    };
+    // 活动信息
+    const placeActivity = reactive({
+      activity: "测试",
+      place: "基督教",
+      activityTime: "2023-03-28 13:00",
+      countPerson: "100",
+      list: "11,22,33",
+      portname: "张三",
+      area: "",
+      activityPlace: "盐都区/张庄街道",
+      address: "1111",
+      money: "",
+      activityName: "李四",
+      tel: "",
+      file: "",
+      into: "1111",
+    });
+    return {
+      onClickLeft,
+      placeActivity,
+    };
+  },
+};
+</script>
+  
+<style lang="less">
+.banner {
+  height: 30vh;
+  background: #36a7f3;
+}
+.info {
+  position: relative;
+  width: 86vw;
+  // height: 120px;
+  margin: 10px auto;
+  padding: 10px;
+  background: #fff;
+  border-radius: 20px;
+  top: -50px;
+  font-size: 14px;
+}
+.btn-sub {
+  width: 90%;
+  border-radius: 20px;
+  margin-left: 5%;
+}
+</style>

src/views/activityMan/placeactivity/placeActivityList.vue

@@ -1,81 +1,151 @@
 <template>
   <van-nav-bar
+    fixed
     title="场所活动"
     left-text=""
+    right-text="上报"
     left-arrow
     @click-left="onClickLeft"
+    @click-right="onClickRight"
   />
-  <van-search
-  v-model="value"
-  shape="round"
-  placeholder="请输入搜索关键词"
-/>
+  <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
+    <!-- tab切换 -->
+    <div class="nav_tab">
+      <div class="tab active">未审核</div>
+      <div class="tab">已审核</div>
+    </div>
+    <van-swipe-cell v-for="item in list" :key="item">
+      <div class="list_item">
+        <div class="item-left">
+          <p style="color: #c4c4c4">{{ item.activityTime }}</p>
+          <p style="color: red">待审核</p>
+        </div>
+        <van-cell is-link to="placeActivityInfo">
+          <template #title>
+            {{ item.portname }}申请于{{ item.place }}举办{{ item.activity }}活动
+          </template>
+          <template #label>
+            {{ item.activityPlace + " " + item.address }}
+          </template>
+        </van-cell>
+      </div>
+      <template #right>
+        <van-button square type="danger" text="删除" class="button" />
+        <van-button square type="primary" text="修改" class="button" />
       </template>
-    </van-cell>
+    </van-swipe-cell>
   </van-list>
 </template>
 
 <script>
-import { ref } from "vue";
+import { reactive, ref } from "vue";
+import router from "@/router";
 export default {
   name: "placeActivityList",
   setup() {
+    // 返回
     const onClickLeft = () => {
       history.back();
     };
-    const list = ref([]);
+    // 上报
+    const onClickRight = () => {
+      router.push("placeActivity");
+    };
+    // 列表
+    const list = reactive([
+      {
+        activity: "测试",
+        place: "基督教",
+        activityTime: "2023-03-28 13:00",
+        countPerson: "100",
+        list: "11,22,33",
+        portname: "张三",
+        area: "",
+        activityPlace: "盐都区/张庄街道",
+        address: "1111",
+        money: "",
+        activityName: "李四",
+        tel: "",
+        file: "",
+        into: "1111",
+      },
+    ]);
     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);
-        }
+      // setTimeout(() => {
+      //   for (let i = 0; i < 10; i++) {
+      //     list.value.push(list.value.length + 1);
+      //   }
 
-        // 加载状态结束
-        loading.value = false;
+      // 加载状态结束
+      loading.value = false;
 
-        // 数据全部加载完成
-        if (list.value.length >= 10) {
-          finished.value = true;
-        }
-      }, 1000);
+      // 数据全部加载完成
+      // if (list.value.length >= 10) {
+      //   finished.value = true;
+      // }
+      // }, 1000);
     };
     // 搜索
-    let value = ref('');
+    let value = ref("");
     return {
       onClickLeft,
       list,
       onLoad,
       loading,
       finished,
-      value
+      value,
+      onClickRight,
     };
   },
 };
 </script>
 
 <style>
-.van-button {
-  top: -5px;
+body {
+  background: #f5f5f5;
+}
+.nav_tab {
+  width: 100vw;
+  display: flex;
+  text-align: center;
+  background: #fff;
+  margin: 10px 0;
+}
+.tab {
+  flex: 1;
+  line-height: 40px;
+  font-size: 14px;
+}
+.active {
+  background: #36a7f3;
+  color: #fff;
 }
-
 .van-list {
   height: 80%;
   margin-top: 5px;
 }
-
+.list_item {
+  display: flex;
+  background: #fff;
+}
+.item-left {
+  text-align: center;
+  width: 30%;
+  font-size: 12px;
+  border-right: 1px solid #eee;
+}
+.button {
+  height: 100%;
+}
 </style>

src/views/activityMan/placeactivity/placeActivityView.vue

@@ -211,6 +211,7 @@
 <script>
 import { reactive, ref } from "vue";
 import personList from "../personList.vue";
+import placeActivityServer from "@/api/placeActivity/placeActivityServer";
 export default {
   components: { personList },
   setup() {
@@ -267,7 +268,6 @@ export default {
     };
     let list = "";
     const selected = (val) => {
-      
       list = val;
     };
     const reselected = () => {
@@ -276,6 +276,9 @@ export default {
     // 地区选择
     let showArea = ref(false);
     const cascaderValue = ref("");
+    new placeActivityServer().treeData().then((res) => {
+      console.log("area", res);
+    });
     // 选项列表，children 代表子选项，支持多级嵌套
     const options = [
       {
@@ -329,6 +332,9 @@ export default {
   margin: 0;
   padding: 0;
 }
+.main {
+  background: #fff;
+}
 .main p {
   height: 40px;
   line-height: 40px;
@@ -353,7 +359,7 @@ export default {
   line-height: 40px;
 }
 .van-cell__value .van-field__right-icon .van-icon-location {
-  color: #36a7f3!important;
+  color: #36a7f3 !important;
 }
 .rowTextArea::v-deep .van-field__value {
   width: 98%;

src/views/activityMan/selfMeetingReport/selfMeetingList.vue

@@ -1,25 +1,45 @@
 <template>
   <van-nav-bar
+    fixed
     title="私设聚会点"
     left-text=""
+    right-text="上报"
     left-arrow
     @click-left="onClickLeft"
+    @click-right="onClickRight"
   />
-  <div class="search">
-    <input type="text" placeholder="请输入查询信息" class="keyword" />
-    <van-button icon="search" type="primary" size="small">查询</van-button>
-  </div>
+  <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="/selfMeeting"
-      >上报</van-button
-    >
-    <van-cell v-for="item in list" :key="item" :title="item" is-link>
-    </van-cell>
+    <!-- tab切换 -->
+    <div class="nav_tab">
+      <div class="tab active">未审核</div>
+      <div class="tab">已审核</div>
+    </div>
+    <van-swipe-cell v-for="item in list" :key="item">
+      <div class="list_item">
+        <!-- <div class="item-left">
+          <p style="color: #c4c4c4">{{ item.activityTime }}</p>
+          <p style="color: red">待审核</p>
+        </div> -->
+        <van-cell is-link :title="item">
+          <!-- <template #title>
+            {{ item.portname }}申请于{{ item.place }}举办{{ item.activity }}活动
+          </template>
+          <template #label>
+            {{ item.activityPlace + " " + item.address }}
+          </template> -->
+        </van-cell>
+      </div>
+      <template #right>
+        <van-button square type="danger" text="删除" class="button" />
+        <van-button square type="primary" text="修改" class="button" />
+      </template>
+    </van-swipe-cell>
   </van-list>
 </template>
   
@@ -64,22 +84,24 @@ export default {
 </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;
+.nav_tab {
+  width: 100vw;
+  display: flex;
+  text-align: center;
+  background: #fff;
+  margin: 10px 0;
+}
+.tab {
+  flex: 1;
+  line-height: 40px;
+  font-size: 14px;
+}
+.active {
+  background: #36a7f3;
+  color: #fff;
 }
 </style>

vue.config.js

@@ -1,22 +1,22 @@
 const { defineConfig } = require('@vue/cli-service')
 module.exports = defineConfig({
-  transpileDependencies: true,
-  publicPath:'./',
-  
-  // 代理服务，处理接口跨域请求
-  devServer:{
-    port:'8080',
-    proxy:{
-      '/api':{
-        target:'http://124.70.137.152:8095',// http://124.70.137.152:8095
-        //target:'http://localhost:8084',// 
-        changeOrigin:true,
-        pathRewrite:{
-          '^/api':'/'
+    transpileDependencies: true,
+    publicPath: './',
+
+    // 代理服务，处理接口跨域请求
+    devServer: {
+        port: '8080',
+        proxy: {
+            '/api': {
+                target: 'http://124.70.137.152:8095', // http://124.70.137.152:8095
+                // target: 'http://localhost:8084', // 
+                changeOrigin: true,
+                pathRewrite: {
+                    '^/api': '/'
+                }
+            }
         }
-      }
-    }
-  },
+    },
 
 
-})
+})