规划项目架构

agrcloud-config/index.config.js

@@ -1,20 +1,20 @@
 const CONFIG = {
-	// 开发环境配置
-	development: {
-		assetsPath: '/static', // 静态资源路径
-		baseUrl: '/dev-api', // 后台接口请求地址
-		hostUrl: '', // H5地址(前端运行地址)
-		websocketUrl: '', // websocket服务端地址
-		weixinAppId: '' // 微信公众号appid
-	},
-	// 生产环境配置
-	production: {
-		assetsPath: '/static', // 静态资源路径
-		baseUrl: '/prod-api', // 后台接口请求地址
-		hostUrl: '', // H5地址(前端运行地址)
-		websocketUrl: '', // websocket服务端地址
-		weixinAppId: '' // 微信公众号appid
-	}
+  // 开发环境配置
+  development: {
+    assetsPath: '/static', // 静态资源路径
+    baseUrl: '/dev-api', // 后台接口请求地址
+    hostUrl: '', // H5地址(前端运行地址)
+    websocketUrl: '', // websocket服务端地址
+    weixinAppId: '' // 微信公众号appid
+  },
+  // 生产环境配置
+  production: {
+    assetsPath: '/static', // 静态资源路径
+    baseUrl: '/prod-api', // 后台接口请求地址
+    hostUrl: '', // H5地址(前端运行地址)
+    websocketUrl: '', // websocket服务端地址
+    weixinAppId: '' // 微信公众号appid
+  }
 
 };
 export default CONFIG[process.env.NODE_ENV];

agrcloud-utils/https.js

@@ -5,24 +5,24 @@
 import request from '@/utils/request';
 
 export default {
-	async default(url, param, method) {
-		const res = await request(url, param, method)
-		return res;
-	},
-	async post(url, param) {
-		const res = await request(url, param, 'post')
-		return res;
-	},
-	async get(url, param) {
-		const res = await request(url, param, 'get')
-		return res;
-	},
-	async put(url, param) {
-		const res = await request(url, param, 'put')
-		return res;
-	},
-	async delete(url, param) {
-		const res = await request(url, param, 'delete')
-		return res;
-	}
+  async default(url, param, method) {
+    const res = await request(url, param, method)
+    return res;
+  },
+  async post(url, param) {
+    const res = await request(url, param, 'post')
+    return res;
+  },
+  async get(url, param) {
+    const res = await request(url, param, 'get')
+    return res;
+  },
+  async put(url, param) {
+    const res = await request(url, param, 'put')
+    return res;
+  },
+  async delete(url, param) {
+    const res = await request(url, param, 'delete')
+    return res;
+  }
 }

agrcloud-utils/request.js

@@ -6,7 +6,6 @@
 import indexConfig from '@/agrcloud-config/index.config';
 
 module.exports = (params) => {
-  debugger
   let url = indexConfig.baseUrl + params.url;
   let method = params.method;
   let header = params.header || {};

manifest.json

@@ -1,100 +1,100 @@
 {
-	"name": "AgriculturalCloud-h5-UI",
-	"appid": "__UNI__DE5C136",
-	"description": "修文农业云公共服务系统",
-	"versionName": "1.0.0",
-	"versionCode": "100",
-	"transformPx": false,
-	/* 5+App特有相关 */
-	"app-plus": {
-		"safearea": {
-			"bottom": {
-				"offset": "none"
-			}
-		},
-		"usingComponents": true,
-		"nvueCompiler": "uni-app",
-		"compilerVersion": 3,
-		"splashscreen": {
-			"alwaysShowBeforeRender": true,
-			"waiting": true,
-			"autoclose": true,
-			"delay": 0
-		},
-		/* 模块配置 */
-		"modules": {},
-		/* 应用发布信息 */
-		"distribute": {
-			/* android打包配置 */
-			"android": {
-				"permissions": [
-					"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
-					"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
-					"<uses-permission android:name=\"android.permission.READ_CONTACTS\"/>",
-					"<uses-permission android:name=\"android.permission.VIBRATE\"/>",
-					"<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
-					"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
-					"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
-					"<uses-permission android:name=\"android.permission.WRITE_CONTACTS\"/>",
-					"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
-					"<uses-permission android:name=\"android.permission.CAMERA\"/>",
-					"<uses-permission android:name=\"android.permission.RECORD_AUDIO\"/>",
-					"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
-					"<uses-permission android:name=\"android.permission.MODIFY_AUDIO_SETTINGS\"/>",
-					"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
-					"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
-					"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
-					"<uses-permission android:name=\"android.permission.CALL_PHONE\"/>",
-					"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
-					"<uses-permission android:name=\"android.permission.ACCESS_COARSE_LOCATION\"/>",
-					"<uses-feature android:name=\"android.hardware.camera\"/>",
-					"<uses-permission android:name=\"android.permission.ACCESS_FINE_LOCATION\"/>",
-					"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
-				]
-			},
-			/* ios打包配置 */
-			"ios": {},
-			/* SDK配置 */
-			"sdkConfigs": {}
-		}
-	},
-	/* 快应用特有相关 */
-	"quickapp": {},
-	/* 小程序特有相关 */
-	"mp-weixin": {
-		"appid": "wxc256e348c4032ebd",
-		"setting": {
-			"urlCheck": false
-		},
-		"usingComponents": true
-	},
-	"mp-alipay": {
-		"usingComponents": true
-	},
-	"mp-baidu": {
-		"usingComponents": true
-	},
-	"mp-toutiao": {
-		"usingComponents": true
-	},
-	"h5": {
-		"template": "agrcloud.template.h5.html",
-		"router": {
-			"mode": "history"
-		},
-		"devServer": {
-			"proxy": {
-				"/dev-api": {
-					"target": "http://172.16.90.32:9110",
-					"changeOrigin": true,
-					"secure": false,
-					"pathRewrite": {
-						"^/dev-api": "/"
-					}
-				}
-			},
-			"port": 8080,
-			"https": false
-		}
-	}
+  "name": "AgriculturalCloud-h5-UI",
+  "appid": "__UNI__DE5C136",
+  "description": "修文农业云公共服务系统",
+  "versionName": "1.0.0",
+  "versionCode": "100",
+  "transformPx": false,
+  /* 5+App特有相关 */
+  "app-plus": {
+    "safearea": {
+      "bottom": {
+        "offset": "none"
+      }
+    },
+    "usingComponents": true,
+    "nvueCompiler": "uni-app",
+    "compilerVersion": 3,
+    "splashscreen": {
+      "alwaysShowBeforeRender": true,
+      "waiting": true,
+      "autoclose": true,
+      "delay": 0
+    },
+    /* 模块配置 */
+    "modules": {},
+    /* 应用发布信息 */
+    "distribute": {
+      /* android打包配置 */
+      "android": {
+        "permissions": [
+          "<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
+          "<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
+          "<uses-permission android:name=\"android.permission.READ_CONTACTS\"/>",
+          "<uses-permission android:name=\"android.permission.VIBRATE\"/>",
+          "<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
+          "<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
+          "<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
+          "<uses-permission android:name=\"android.permission.WRITE_CONTACTS\"/>",
+          "<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
+          "<uses-permission android:name=\"android.permission.CAMERA\"/>",
+          "<uses-permission android:name=\"android.permission.RECORD_AUDIO\"/>",
+          "<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
+          "<uses-permission android:name=\"android.permission.MODIFY_AUDIO_SETTINGS\"/>",
+          "<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
+          "<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
+          "<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
+          "<uses-permission android:name=\"android.permission.CALL_PHONE\"/>",
+          "<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
+          "<uses-permission android:name=\"android.permission.ACCESS_COARSE_LOCATION\"/>",
+          "<uses-feature android:name=\"android.hardware.camera\"/>",
+          "<uses-permission android:name=\"android.permission.ACCESS_FINE_LOCATION\"/>",
+          "<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
+        ]
+      },
+      /* ios打包配置 */
+      "ios": {},
+      /* SDK配置 */
+      "sdkConfigs": {}
+    }
+  },
+  /* 快应用特有相关 */
+  "quickapp": {},
+  /* 小程序特有相关 */
+  "mp-weixin": {
+    "appid": "wxc256e348c4032ebd",
+    "setting": {
+      "urlCheck": false
+    },
+    "usingComponents": true
+  },
+  "mp-alipay": {
+    "usingComponents": true
+  },
+  "mp-baidu": {
+    "usingComponents": true
+  },
+  "mp-toutiao": {
+    "usingComponents": true
+  },
+  "h5": {
+    "template": "agrcloud.template.h5.html",
+    "router": {
+      "mode": "history"
+    },
+    "devServer": {
+      "proxy": {
+        "/dev-api": {
+          "target": "http://172.16.90.32:9110",
+          "changeOrigin": true,
+          "secure": false,
+          "pathRewrite": {
+            "^/dev-api": "/"
+          }
+        }
+      },
+      "port": 8080,
+      "https": false
+    }
+  }
 }

pages.json

@@ -6,37 +6,33 @@
     {
       "path": "pages/index/index",
       "style": {
-        "navigationBarTitleText": "修文农业云公共服务系统"
+        "navigationBarTitleText": "修文农业云公共服务系统",
+        "navigationStyle": "custom"
       }
     },
     {
-      "path": "pages/center/index",
+      "path": "pages/complaints/index",
       "style": {
-        "navigationBarTitleText": "AgrCloud-center"
+        "navigationBarTitleText": "质量安全投诉"
+      }
+    },
+    {
+      "path": "pages/results/index",
+      "style": {
+        "navigationBarTitleText": "结果页面"
+      }
+    },
+    {
+      "path": "pages/complaints/details/index",
+      "style": {
+        "navigationBarTitleText": "质量安全投诉详情"
       }
     }
   ],
   "globalStyle": {
     "navigationBarTextStyle": "black",
-    "navigationBarTitleText": "农业云H5",
+    "navigationBarTitleText": "修文农业云公共服务系统",
     "navigationBarBackgroundColor": "#FFFFFF",
     "backgroundColor": "#F7F8F9"
-  },
-  "tabBar": {
-    "color": "#909399",
-    "selectedColor": "#303133",
-    "borderStyle": "black",
-    "backgroundColor": "#FFFFF",
-    "list": [{
-      "pagePath": "pages/index/index",
-      "iconPath": "static/agrcloud-images/index.png",
-      "selectedIconPath": "static/agrcloud-images/index-selected.png",
-      "text": "首页"
-    }, {
-      "pagePath": "pages/center/index",
-      "iconPath": "static/agrcloud-images/center.png",
-      "selectedIconPath": "static/agrcloud-images/center-selected.png",
-      "text": "我的"
-    }]
   }
 }

pages/center/index.vue

@@ -1,55 +0,0 @@
-<template>
-	<view class="content">
-		<image class="logo" src="/static/agrcloud-images/logo.png"></image>
-		<view class="text-area">
-			<text class="title">
-				{{ title }}
-			</text>
-		</view>
-	</view>
-</template>
-
-<script>
-	export default {
-		data() {
-			return {
-				title: 'AgrCloud-center'
-			}
-		},
-		onLoad() {
-
-		},
-		methods: {
-
-		}
-	}
-</script>
-
-<style lang="scss" scoped>
-	.content {
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-		justify-content: center;
-		padding: 40rpx;
-	}
-
-	.logo {
-		height: 200rpx;
-		width: 200rpx;
-		margin-top: 100rpx;
-		margin-left: auto;
-		margin-right: auto;
-		margin-bottom: 50rpx;
-	}
-
-	.text-area {
-		display: flex;
-		justify-content: center;
-	}
-
-	.title {
-		font-size: 28rpx;
-		color: $u-content-color;
-	}
-</style>

pages/complaints/details/index.vue

@@ -0,0 +1,254 @@
+<template>
+  <view class="page-content complaintsdetails">
+    <view class="complaintsdetails-content">
+      <view class="complaintsdetails-item complaintsdetails-plauser">
+        <view class="item-content">
+          <view class="item-text">
+            <view class="item-textlable">
+              <text class="item-lable">真实姓名：</text>
+            </view>
+            <view class="item-textvalue">
+              <text class="item-value">{{ complaintsDetailsObj.plaUser }}</text>
+            </view>
+          </view>
+        </view>
+      </view>
+      <view class="complaintsdetails-item complaintsdetails-plaphone">
+        <view class="item-content">
+          <view class="item-text">
+            <view class="item-textlable">
+              <text class="item-lable">手机号码：</text>
+            </view>
+            <view class="item-textvalue">
+              <text
+                class="item-value"
+              >{{ complaintsDetailsObj.plaPhone.replace(/^(.{3})(.*)(.{4})$/, '$1-$2-$3') }}</text>
+            </view>
+          </view>
+        </view>
+      </view>
+      <view class="complaintsdetails-item complaintsdetails-planame">
+        <view class="item-content">
+          <view class="item-text">
+            <view class="item-textlable">
+              <text class="item-lable">投诉标题：</text>
+            </view>
+            <view class="item-textvalue">
+              <text class="item-value">{{ complaintsDetailsObj.plaName }}</text>
+            </view>
+          </view>
+        </view>
+      </view>
+      <view class="complaintsdetails-placontent">
+        <view class="placontent-text">
+          <view class="placontent-textlable">
+            <text class="placontent-lable">投诉内容：</text>
+          </view>
+          <view class="placontent-textvalue">
+            <text class="placontent-textarea">{{ complaintsDetailsObj.plaContent }}</text>
+          </view>
+        </view>
+      </view>
+      <template v-if="complaintsDetailsObj.plaRes != null && complaintsDetailsObj.plaRes != ''">
+        <view class="complaintsdetails-plares">
+          <view class="plares-text">
+            <view class="plares-textlable">
+              <text class="plares-lable">反馈内容：</text>
+            </view>
+            <view class="plares-textvalue">
+              <text class="plares-textarea">{{ complaintsDetailsObj.plaRes }}</text>
+            </view>
+          </view>
+        </view>
+      </template>
+      <template v-else>
+        <view class="complaintsdetails-plares">
+          <view class="plares-text">
+            <view class="plares-textlable">
+              <text class="plares-lable">反馈内容：</text>
+            </view>
+            <view class="plares-textnovalue">
+              <text class="plares-value">暂无</text>
+            </view>
+          </view>
+        </view>
+      </template>
+    </view>
+  </view>
+</template>
+
+<script>
+import {
+  complaintsViewData
+} from '@/agrcloud-api/complaints';
+
+export default {
+  name: 'complaintsdetails',
+  data() {
+    return {
+      complaintsDetailsObj: {},
+      custLabelStyle: {
+        'height': '42rpx',
+        'font-size': '30rpx',
+        'font-family': 'PingFangSC-Regular, PingFang SC',
+        'font-weight': '400',
+        'color': '#666666',
+        'line-height': '42rpx'
+      },
+      custPlaceholderStyle: 'font-size: 34rpx;font-family: PingFangSC-Regular, PingFang SC;font-weight: 400;'
+    };
+  },
+  onLoad() {
+    this.initData();
+  },
+  methods: {
+    /** 初始化数据 */
+    initData() {
+      const currComplaintsDetailsItem = (this.$store.getters || {}).complaintsDetailsObj || {};
+      complaintsViewData({
+        id: currComplaintsDetailsItem.plaId
+      }).then(res => {
+        this.complaintsDetailsObj = res.data || {};
+      }).catch(() => {
+        this.complaintsDetailsObj = {};
+      });
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.complaintsdetails {
+  padding: 0;
+
+  .complaintsdetails-content {
+    width: 100%;
+    padding-top: 24rpx;
+
+    .complaintsdetails-item {
+      height: 138rpx;
+      padding-left: 24rpx;
+      background-color: #ffffff;
+
+      .item-content {
+        height: 138rpx;
+        border-bottom: 1px solid #eeeeee;
+
+        .item-text {
+          padding: 24rpx 24rpx 24rpx 0;
+
+          .item-textlable {
+            height: 42rpx;
+            line-height: 42rpx;
+
+            .item-lable {
+              height: 42rpx;
+              font-size: 30rpx;
+              font-family: PingFangSC-Regular, PingFang SC;
+              font-weight: 400;
+              color: #666666;
+              line-height: 42rpx;
+            }
+          }
+
+          .item-textvalue {
+            height: 48rpx;
+            line-height: 48rpx;
+
+            .item-value {
+              height: 48rpx;
+              font-size: 34rpx;
+              font-family: PingFangSC-Regular, PingFang SC;
+              font-weight: 400;
+              color: #333333;
+              line-height: 48rpx;
+            }
+          }
+        }
+      }
+    }
+
+    .complaintsdetails-placontent {
+      margin-top: 24rpx;
+      background-color: #ffffff;
+      min-height: 154rpx;
+
+      .placontent-text {
+        padding: 24rpx;
+
+        .placontent-textlable {
+          height: 42rpx;
+          line-height: 42rpx;
+
+          .placontent-lable {
+            height: 42rpx;
+            font-size: 30rpx;
+            font-family: PingFangSC-Regular, PingFang SC;
+            font-weight: 400;
+            color: #666666;
+            line-height: 42rpx;
+          }
+        }
+
+        .placontent-textvalue {
+          .placontent-textarea {
+            min-height: 48rpx;
+            font-size: 34rpx;
+            font-family: PingFangSC-Regular, PingFang SC;
+            font-weight: 400;
+            color: #333333;
+          }
+        }
+      }
+    }
+
+    .complaintsdetails-plares {
+      margin-top: 24rpx;
+      background-color: #ffffff;
+      min-height: 154rpx;
+
+      .plares-text {
+        padding: 24rpx;
+
+        .plares-textlable {
+          height: 42rpx;
+          line-height: 42rpx;
+
+          .plares-lable {
+            height: 42rpx;
+            font-size: 30rpx;
+            font-family: PingFangSC-Regular, PingFang SC;
+            font-weight: 400;
+            color: #666666;
+            line-height: 42rpx;
+          }
+        }
+
+        .plares-textvalue {
+          .plares-textarea {
+            min-height: 48rpx;
+            font-size: 34rpx;
+            font-family: PingFangSC-Regular, PingFang SC;
+            font-weight: 400;
+            color: #333333;
+          }
+        }
+
+        .plares-textnovalue {
+          height: 48rpx;
+          line-height: 48rpx;
+
+          .plares-value {
+            height: 48rpx;
+            font-size: 34rpx;
+            font-family: PingFangSC-Regular, PingFang SC;
+            font-weight: 400;
+            color: #333333;
+            line-height: 48rpx;
+          }
+        }
+      }
+    }
+  }
+}
+</style>

pages/complaints/index.vue

@@ -0,0 +1,480 @@
+<template>
+  <view class="page-content complaints">
+    <view class="page-header complaints-header">
+      <u-tabs
+        class="complaints-tabs"
+        name="cust_tabs_name"
+        :list="tabsList"
+        :current="currentTabs"
+        height="80"
+        item-width="256"
+        gutter="50"
+        bar-width="120"
+        font-size="32"
+        @change="handletabsChange"
+      ></u-tabs>
+    </view>
+
+    <view class="page-main">
+      <template v-if="currentTabs == 0">
+        <view class="initiate-complaints">
+          <u-form
+            :model="complaintsForm"
+            label-position="top"
+            :label-style="custLabelStyle"
+            ref="complaintsFormRef"
+          >
+            <u-form-item
+              label="真实姓名："
+              prop="plaUser"
+              :required="true"
+              maxlength="20"
+              class="initiate-formitem"
+            >
+              <u-input
+                v-model="complaintsForm.plaUser"
+                placeholder="请输入真实姓名"
+                :placeholder-style="custPlaceholderStyle"
+              />
+            </u-form-item>
+            <u-form-item label="手机号码：" prop="plaPhone" :required="true" class="initiate-formitem">
+              <u-input
+                v-model="complaintsForm.plaPhone"
+                placeholder="请输入手机号码"
+                :placeholder-style="custPlaceholderStyle"
+              />
+            </u-form-item>
+            <u-form-item
+              label="投诉标题："
+              prop="plaName"
+              :required="true"
+              maxlength="50"
+              class="initiate-formitem"
+            >
+              <u-input
+                v-model="complaintsForm.plaName"
+                placeholder="请输入投诉标题"
+                :placeholder-style="custPlaceholderStyle"
+              />
+            </u-form-item>
+            <u-form-item
+              label="投诉内容："
+              prop="plaContent"
+              :required="true"
+              class="mt40 initiate-formitem"
+            >
+              <u-input
+                v-model="complaintsForm.plaContent"
+                type="textarea"
+                maxlength="200"
+                height="298"
+                placeholder="请输入不少于10个字的描述"
+                :placeholder-style="custPlaceholderStyle"
+                @input="handleSumPlacontentNum"
+              />
+              <text class="formitem-sumplacontentnum">{{ sumPlacontentNum }}/200</text>
+            </u-form-item>
+          </u-form>
+          <view class="complaintsform-footer">
+            <u-button
+              type="primary"
+              @click="handleComplaintsformSubmit"
+              class="complaint-submitbtn"
+            >提交</u-button>
+          </view>
+        </view>
+      </template>
+      <template v-else-if="currentTabs == 1">
+        <view class="history-complaints">
+          <scroll-view scroll-y="true" class="scroll-Y" @scrolltolower="handleScrolltolower">
+            <view class="history-complaints-listbody">
+              <u-row gutter="16" class="listbody-row">
+                <u-col
+                  span="12"
+                  class="listbody-col"
+                  v-for="complaintsItem in hisComplaintsObj.complaintsList"
+                  :key="complaintsItem.plaId"
+                  @click="handleComplaintsDetails(complaintsItem)"
+                >
+                  <view class="listbody-item">
+                    <view class="item-title">
+                      <text class="item-title-left">质量安全投诉</text>
+                      <text class="item-title-right">{{ complaintsItem.plaInTime }}</text>
+                    </view>
+                    <view class="item-body">
+                      <text class="item-body-text">
+                        真实姓名：{{ complaintsItem.plaUser }}
+                        <br />
+                        手机号码：{{ complaintsItem.plaPhone.replace(/^(.{3})(.*)(.{4})$/, '$1-$2-$3') }}
+                      </text>
+                      <template v-if="complaintsItem.plaIsRe == 1">
+                        <text class="item-body-feedback">已反馈</text>
+                      </template>
+                      <template v-else>
+                        <text class="item-body-nofeedback">未反馈</text>
+                      </template>
+                    </view>
+                  </view>
+                </u-col>
+              </u-row>
+              <uni-load-more
+                :status="hisComplaintsObj.loadStatus"
+                v-if="!hisComplaintsObj.list_empty"
+              ></uni-load-more>
+            </view>
+          </scroll-view>
+        </view>
+      </template>
+      <template v-else></template>
+    </view>
+  </view>
+</template>
+
+<script>
+import {
+  complaintsAddData,
+  complaintsListData
+} from '@/agrcloud-api/complaints';
+import uniLoadMore from "@/agrcloud-components/uni-load-more/uni-load-more.vue"
+
+export default {
+  name: 'complaints',
+  components: {
+    uniLoadMore
+  },
+  data() {
+    return {
+      optionType: '',
+      currentTabs: 0,
+      tabsList: [{
+        cust_tabs_name: '发起投诉'
+      },
+      {
+        cust_tabs_name: '历史投诉'
+      }
+      ],
+      complaintsForm: {
+        plaUser: '',
+        plaPhone: '',
+        plaName: '',
+        plaContent: ''
+      },
+      complaintsRules: {
+        plaUser: [{
+          required: true,
+          message: '请输入真实姓名',
+          trigger: ['change', 'blur']
+        }],
+        plaPhone: [{
+          required: true,
+          message: '请输入手机号',
+          trigger: ['change', 'blur']
+        },
+        {
+          validator: (rule, value, callback) => {
+            return this.$u.test.mobile(value);
+          },
+          message: '手机号码不正确',
+          trigger: ['change', 'blur']
+        }
+        ],
+        plaName: [{
+          required: true,
+          message: '请输入投诉标题',
+          trigger: ['change', 'blur']
+        }],
+        plaContent: [{
+          required: true,
+          message: '请输入投诉内容',
+          trigger: ['change', 'blur']
+        },
+        {
+          min: 10,
+          message: '投诉内容不少于10个字',
+          trigger: ['change', 'blur']
+        }
+        ]
+      },
+      sumPlacontentNum: 0,
+      custLabelStyle: {
+
+        'font-size': '30rpx',
+        'font-family': 'PingFangSC-Regular, PingFang SC',
+        'font-weight': '400',
+      },
+      custPlaceholderStyle: 'font-size: 34rpx;font-family: PingFangSC-Regular, PingFang SC;font-weight: 400;',
+      hisComplaintsObj: {
+        loadStatus: 'more',
+        list_empty: false,
+        pageTotal: 0,
+        pageCount: 0,
+        pagination: {
+          pageNum: 1,
+          pageSize: 10
+        },
+        complaintsList: []
+      }
+    };
+  },
+  onLoad: function (option) {
+    console.log(option.id);
+    this.initData();
+  },
+  methods: {
+    /** 初始化数据 */
+    initData() {
+
+    },
+    /** 切换页签 */
+    handletabsChange(index) {
+      this.currentTabs = index;
+      if (index == 1) {
+        this.hisComplaintsObj.pagination.pageNum = 1;
+        this.getComplaintsListData();
+      }
+    },
+    /** 获取历史投诉列表 */
+    getComplaintsListData() {
+      this.hisComplaintsObj = {
+        ...this.hisComplaintsObj,
+        list_empty: false,
+        loadStatus: 'loading',
+        pageTotal: 0
+      };
+
+      // 请求获取列表数据
+      complaintsListData({
+        ...this.hisComplaintsObj.pagination,
+        plaUser: this.complaintsForm.plaUser,
+        plaPhone: this.complaintsForm.plaPhone
+      }).then(res => {
+        // 数据总条数
+        this.hisComplaintsObj.pageTotal = res.total || 0;
+
+        // 处理返回结果
+        if ((res.rows || []).length <= 0) { // 返回结果没有数据
+          if ((this.hisComplaintsObj.complaintsList || []).length <= 0) {
+            this.hisComplaintsObj.loadStatus = 'noMores';
+            this.hisComplaintsObj.list_empty = true;
+            return;
+          } else {
+            this.hisComplaintsObj.loadStatus = 'noMores';
+          }
+        } else { //返回结果有数据
+          //返回历史投诉列表存在
+          this.hisComplaintsObj.list_empty = false;
+
+          // 获取列表数据分页数量
+          this.hisComplaintsObj.pageCount = Math.ceil((res.total || 0) / this.hisComplaintsObj.pagination.pageSize);
+          if ((res.total || 0) % this.hisComplaintsObj.pagination.pageSize == 0) {
+            this.hisComplaintsObj.pageCount = Math.ceil((res.total || 0) / this.hisComplaintsObj.pagination.pageSize);
+            if (this.hisComplaintsObj.pageCount == 1) {
+              this.hisComplaintsObj.pageCount--;
+            }
+          } else {
+            this.hisComplaintsObj.pageCount--;
+          };
+
+          // 处理页面状态
+          if (this.hisComplaintsObj.pageCount === 0) {
+            this.hisComplaintsObj.loadStatus = 'noMores'
+          } else {
+            this.hisComplaintsObj.loadStatus = 'more'
+          }
+
+          // 如果列表为第一页，返回列表数据清空
+          if (this.hisComplaintsObj.pagination.pageNum == 1) {
+            this.hisComplaintsObj.complaintsList = [];
+          };
+
+          // 组装返回数据
+          this.hisComplaintsObj.complaintsList.push.apply(this.hisComplaintsObj.complaintsList, res.rows || []);
+
+          uni.stopPullDownRefresh();
+        }
+
+      }).catch(err => {
+        this.hisComplaintsObj.loadStatus = 'noMores';
+      });
+    },
+    handleComplaintsformSubmit() {
+      this.$refs.complaintsFormRef && this.$refs.complaintsFormRef.validate(valid => {
+        if (valid) {
+          complaintsAddData(this.complaintsForm).then(
+            res => {
+              this.$msgbox('操作成功！', 'success');
+              this.complaintsForm = {
+                ...this.complaintsForm,
+                plaName: '',
+                plaContent: ''
+              };
+              uni.navigateTo({
+                url: '/pages/results/index'
+              });
+            }
+          );
+        }
+      });
+    },
+    handleScrolltolower() {
+      this.hisComplaintsObj.loadStatus = 'loading'
+      if (this.hisComplaintsObj.pagination.pageNum - 1 >= this.hisComplaintsObj.pageCount) {
+        this.hisComplaintsObj.loadStatus = 'noMores';
+        return
+      } else {
+        this.hisComplaintsObj.pagination.pageNum++;
+        this.getComplaintsListData();
+      }
+    },
+    handleSumPlacontentNum() {
+      this.sumPlacontentNum = this.complaintsForm.plaContent.length;
+      if (this.sumPlacontentNum == 200) {
+        this.$msgbox('最多只能输入240个字！', 'none');
+      }
+    },
+    handleComplaintsDetails(param) {
+      this.$store.dispatch("SetComplaintsDetails", param).then(() => {
+        // console.log(this.$store.getters)
+        uni.navigateTo({
+          url: '/pages/complaints/details/index'
+        });
+      }).catch(() => {
+        this.$msgbox('访问数据异常！', 'none');
+      });
+    }
+  },
+  onReady() {
+    this.$refs.complaintsFormRef && this.$refs.complaintsFormRef.setRules(this.complaintsRules);
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.complaints {
+  padding: 0;
+
+  &-header {
+    width: 100%;
+    border-top: 2rpx solid #eeeeee;
+    border-bottom: 2rpx solid #eeeeee;
+  }
+
+  .complaints-tabs {
+    height: 87rpx;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+  }
+
+  .initiate-complaints {
+    .initiate-formitem {
+      padding-left: 24rpx;
+      background: #ffffff;
+
+      .formitem-sumplacontentnum {
+        position: absolute;
+        bottom: 0;
+        right: 0;
+      }
+    }
+  }
+
+  .complaintsform-footer {
+    padding: 40rpx 32rpx;
+
+    .complaint-submitbtn {
+      height: 88rpx;
+    }
+  }
+
+  .hiscomplaint-item {
+    background: #ffffff;
+  }
+
+  .history-complaints {
+    .scroll-Y {
+      height: calc(
+        100vh - 88rpx - 100rpx - env(safe-area-inset-bottom) -
+          var(--status-bar-height)
+      );
+    }
+
+    .history-complaints-listbody {
+      .listbody-row {
+        .listbody-col {
+          padding: 24rpx 0 0 0 !important;
+
+          .listbody-item {
+            background: #ffffff;
+            height: 196rpx;
+            width: 100%;
+
+            .item-title {
+              padding-top: 24rpx;
+
+              .item-title-left {
+                float: left;
+                height: 48rpx;
+                font-size: 34rpx;
+                font-family: PingFangSC-Medium, PingFang SC;
+                font-weight: 500;
+                color: #333333;
+                line-height: 48rpx;
+                padding-left: 24rpx;
+              }
+
+              .item-title-right {
+                float: right;
+                height: 48rpx;
+                font-size: 30rpx;
+                font-family: PingFangSC-Regular, PingFang SC;
+                font-weight: 400;
+                color: #999999;
+                line-height: 48rpx;
+                padding-right: 24rpx;
+              }
+            }
+
+            .item-body {
+              clear: both;
+              padding: 16rpx 0 0 24rpx;
+
+              .item-body-text {
+                height: 84rpx;
+                font-size: 30rpx;
+                font-family: PingFangSC-Regular, PingFang SC;
+                font-weight: 400;
+                color: #666666;
+                line-height: 42rpx;
+              }
+
+              .item-body-nofeedback {
+                float: right;
+                padding-right: 24rpx;
+                height: 42rpx;
+                font-size: 30rpx;
+                font-family: PingFangSC-Medium, PingFang SC;
+                font-weight: 500;
+                color: #fd4779;
+                line-height: 42rpx;
+              }
+
+              .item-body-feedback {
+                float: right;
+                padding-right: 24rpx;
+                height: 42rpx;
+                font-size: 30rpx;
+                font-family: PingFangSC-Medium, PingFang SC;
+                font-weight: 500;
+                color: #48a79e;
+                line-height: 42rpx;
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+}
+</style>

pages/index/index.vue

@@ -1,66 +1,163 @@
 <template>
-	<view class="content">
-		<image class="logo" src="/static/agrcloud-images/logo.png"></image>
-		<view class="text-area">
-			<text class="title">
-				AgrCloud-index
-			</text>
-		</view>
-		<view class="button-demo">
-			<u-button :ripple="true">按钮演示</u-button>
-		</view>
-	</view>
+  <view>
+    <uni-page-head class="cust-uni-page-head">
+      <view class="cust-agrcloud-uni-page-head uni-page-head">
+        <view class="uni-page-head-hd cust-agrcloud-uni-page-head-hd">
+          <view class="uni-page-head-btn">
+            <image class="uni-btn-icon cust-head-icon"
+              src="@/static/agrcloud-images/agrcloud-head-dir-img.png"></image>
+          </view>
+        </view>
+        <view class="uni-page-head-bd">
+          <view class="uni-page-head__title"
+            style="font-size: 16px; opacity: 1;">修文农业云公共服务系统
+          </view>
+        </view>
+      </view>
+    </uni-page-head>
+
+    <view class="page-content">
+      <view class="title">
+        <image class="weather-densefog"
+          src="@/static/agrcloud-images/agrcloud-weather-densefog-img.png"></image>
+        <u-notice-bar class="title-content"
+          mode="horizontal"
+          type="none"
+          :volume-icon="true"
+          :more-icon="true"
+          :is-circular="true"
+          :list="titleContentList"></u-notice-bar>
+      </view>
+      <view class="main-content">
+        <u-waterfall v-model="flowList">
+          <template v-slot:left="{leftList}">
+            <view class="main-warter"
+              v-for="item in leftList"
+              :key="item.id"
+              @click="handleWarterClick(item)">
+              <view class="water-title">
+                {{item.title}}
+              </view>
+            </view>
+          </template>
+          <template v-slot:right="{rightList}">
+            <view class="main-warter"
+              v-for="item in rightList"
+              :key="item.id"
+              @click="handleWarterClick(item)">
+              <view class="water-title">
+                {{item.title}}
+              </view>
+            </view>
+          </template>
+        </u-waterfall>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				title: 'Hello'
-			}
-		},
-		onLoad() {
-
-		},
-		methods: {
-
-		}
-	}
+  export default {
+    data() {
+      return {
+        title: 'Hello',
+        titleContentList: ['气象预警：修文县气象台2020年x月x日x时x分发布大雾'],
+        mainNavigateToObj: {
+          QualitySafetyComplaints: '/pages/complaints/index',
+          MeteorologicalServices: '/pages/results/index',
+          AgriculturalTechnologyExpert: '',
+          PoliciesRegulations: '',
+          NoticeAnnouncement: '',
+          MonitoringInformation: ''
+        },
+        flowList: [{
+          id: 'QualitySafetyComplaints',
+          title: '质量安全投诉',
+          image: 'http://pic.sc.chinaz.com/Files/pic/pic9/202002/zzpic23327_s.jpg',
+        }, {
+          id: 'MeteorologicalServices',
+          title: '气象服务',
+          image: 'http://pic.sc.chinaz.com/Files/pic/pic9/202002/zzpic23327_s.jpg',
+        }, {
+          id: 'AgriculturalTechnologyExpert',
+          title: '农技专家',
+          image: 'http://pic.sc.chinaz.com/Files/pic/pic9/202002/zzpic23327_s.jpg',
+        }, {
+          id: 'PoliciesRegulations',
+          title: '政策法规',
+          image: 'http://pic.sc.chinaz.com/Files/pic/pic9/202002/zzpic23327_s.jpg',
+        }, {
+          id: 'NoticeAnnouncement',
+          title: '通知公告',
+          image: 'http://pic.sc.chinaz.com/Files/pic/pic9/202002/zzpic23327_s.jpg',
+        }, {
+          id: 'MonitoringInformation',
+          title: '监测信息',
+          image: 'http://pic.sc.chinaz.com/Files/pic/pic9/202002/zzpic23327_s.jpg',
+        }]
+      };
+    },
+    onLoad() {
+      this.indexInit();
+    },
+    methods: {
+      async indexInit() {},
+      handleWarterClick(itemData) {
+        if (!itemData.id || !this.mainNavigateToObj[itemData.id]) {
+          this.$msgbox('模块建设中...');
+          return;
+        }
+        uni.navigateTo({
+          url: this.mainNavigateToObj[itemData.id]
+        });
+      }
+    }
+  };
 </script>
 
 <style lang="scss" scoped>
-	.content {
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-		justify-content: center;
-		padding: 40rpx;
-	}
+  .page-content {
+    .title {
+      width: 100%;
+
+      .title-logo {
+        padding-top: 9rpx;
+        height: 52rpx;
+        width: 30rpx;
+        float: left;
+      }
 
-	.logo {
-		height: 200rpx;
-		width: 200rpx;
-		margin-top: 100rpx;
-		margin-left: auto;
-		margin-right: auto;
-		margin-bottom: 50rpx;
-	}
+      .weather-densefog {
+        padding-top: 6rpx;
+        float: left;
+        width: 36rpx;
+        height: 36rpx;
+      }
 
-	.text-area {
-		display: flex;
-		justify-content: center;
-	}
+      .title-content {
+        width: calc(100% - 36rpx);
+      }
+    }
 
-	.title {
-		font-size: 28rpx;
-		color: $u-content-color;
-	}
+    .main-content {
+      padding-top: 20rpx;
+      width: 100%;
 
-	.button-demo {
-		margin-top: 80rpx;
-	}
+      .main-warter {
+        width: 100%;
 
-	.link-demo {
-		margin-top: 80rpx;
-	}
+        .water-title {
+          margin: 20rpx;
+          height: 300rpx;
+          border-radius: 20rpx;
+          border: 1rpx solid #c6c6c6;
+          display: flex;
+          flex-direction: column;
+          align-items: center;
+          justify-content: center;
+          cursor: pointer;
+        }
+      }
+    }
+  }
 </style>

pages/results/index.vue

@@ -0,0 +1,172 @@
+<template>
+  <view class="page-content results">
+    <view class="page-header results-header">
+      <view class="results-header-content">
+        <view class="results-header-image">
+          <image class="results-image"
+            src="@/static/agrcloud-images/agrcloud-results-page-img.png"></image>
+        </view>
+        <view class="results-header-text">
+          <text class="results-text">操作成功</text>
+        </view>
+      </view>
+    </view>
+    <view class="page-main results-main">
+      <view class="results-main-btngroup">
+        <view class="btngroup-backuplevelbtn">
+          <view class="results-backuplevelbtn">
+            <view class="results-backuplevelbtn-text"
+              @click="handleBackUplevelClick">
+              返回上一级
+            </view>
+          </view>
+        </view>
+        <view class="btngroup-backhomebtn">
+          <view class="results-backhomebtn">
+            <view class="results-backhomebtn-text"
+              @click="handleBackHomeClick">
+              返回主页
+            </view>
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+
+export default {
+  name: 'results',
+  components: {},
+  data() {
+    return {};
+  },
+  onLoad: function(option) {
+    this.initData();
+  },
+  methods: {
+    /** 初始化数据 */
+    initData() {},
+    handleBackUplevelClick() {
+      uni.navigateBack({
+        delta: 1
+      });
+    },
+    handleBackHomeClick() {
+      uni.navigateTo({
+        url: '/pages/index/index'
+      });
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+  .results {
+    padding: 0;
+
+    &-header {
+      padding-top: 25rpx;
+      width: 100%;
+
+      &-content {
+        width: 100%;
+        height: 346rpx;
+        background-color: #FFFFFF;
+
+        .results-header-image {
+          width: 100%;
+          display: flex;
+          flex-direction: column;
+          align-items: center;
+          justify-content: center;
+
+          .results-image {
+            width: 128rpx;
+            height: 128rpx;
+            margin: 64rpx auto auto auto;
+          }
+        }
+
+        .results-header-text {
+          width: 100%;
+          display: flex;
+          flex-direction: column;
+          align-items: center;
+          justify-content: center;
+
+          .results-text {
+            margin: 40rpx auto auto auto;
+            height: 50rpx;
+            font-size: 36rpx;
+            font-family: PingFangSC-Regular, PingFang SC;
+            font-weight: 400;
+            color: #333333;
+            line-height: 50rpx;
+          }
+        }
+      }
+    }
+
+    &-main {
+      width: 100%;
+
+      &-btngroup {
+        width: 100%;
+        padding-top: 60rpx;
+
+        .btngroup-backuplevelbtn {
+          padding: 0 24rpx;
+        }
+
+        .btngroup-backhomebtn {
+          padding: 24rpx;
+        }
+      }
+
+      .results-backuplevelbtn {
+        height: 98rpx;
+        background: #53A0FD;
+        border-radius: 8rpx;
+        width: 100%;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
+
+        .results-backuplevelbtn-text {
+          margin: 24rpx auto auto auto;
+          height: 50rpx;
+          font-size: 36rpx;
+          font-family: PingFangSC-Regular, PingFang SC;
+          font-weight: 400;
+          color: #FFFFFF;
+          line-height: 50rpx;
+        }
+      }
+
+      .results-backhomebtn {
+        height: 98rpx;
+        background: #FFFFFF;
+        border-radius: 8rpx;
+        border: 2rpx solid #E5E5E5;
+        width: 100%;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
+
+        .results-backhomebtn-text {
+          margin: 24rpx auto auto auto;
+          height: 50rpx;
+          font-size: 36rpx;
+          font-family: PingFangSC-Regular, PingFang SC;
+          font-weight: 400;
+          color: #333333;
+          line-height: 50rpx;
+        }
+      }
+    }
+  }
+</style>