Merge branch 'master' of http://116.255.223.226:3000/zhangzl/nsgk_mobile

config/index.js

@@ -13,7 +13,8 @@ module.exports = {
       "/api": {
         // 请求的目标主机
         //target: 'http://116.255.223.226:8081/nsgk_test/',
-        target: 'http://localhost:8080/',
+        //target: 'http://localhost:8080/',
+        target: 'http://192.168.0.107:8080/',
         changeOrigin: true,
         pathRewrite: {
           '^/api': ''

package-lock.json

@@ -24,6 +24,11 @@
       "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.9.0.tgz",
       "integrity": "sha512-wjtKehFAIARq2OxK8j3JrggNlEslJfNuSm2ArteIbKyRMts2g0a7KzTxfRVNUM+O0gnBJ2hNV8nWPOYBgI1sew=="
     },
+    "@types/json-schema": {
+      "version": "7.0.11",
+      "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.11.tgz",
+      "integrity": "sha512-wOuvG1SN4Us4rez+tylwwwCV1psiNVOkJeM3AUWUNWg/jDQY2+HE/444y5gc+jBmRqASOm2Oeh5c1axHobwRKQ=="
+    },
     "@types/q": {
       "version": "1.5.4",
       "resolved": "https://registry.npmjs.org/@types/q/-/q-1.5.4.tgz",
@@ -121,8 +126,7 @@
     "ajv-keywords": {
       "version": "3.5.2",
       "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-3.5.2.tgz",
-      "integrity": "sha512-5p6WTN0DdTGVQk6VjcEju19IgaHudalcfabD7yhDGeA6bcQnmL+CpveLJq/3hvfwd1aof6L386Ougkx6RfyMIQ==",
-      "dev": true
+      "integrity": "sha512-5p6WTN0DdTGVQk6VjcEju19IgaHudalcfabD7yhDGeA6bcQnmL+CpveLJq/3hvfwd1aof6L386Ougkx6RfyMIQ=="
     },
     "align-text": {
       "version": "0.1.4",
@@ -724,8 +728,7 @@
     "babel-plugin-syntax-dynamic-import": {
       "version": "6.18.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-syntax-dynamic-import/-/babel-plugin-syntax-dynamic-import-6.18.0.tgz",
-      "integrity": "sha1-jWomIpyDdFqZgqRBBRVyyqF5sdo=",
-      "dev": true
+      "integrity": "sha1-jWomIpyDdFqZgqRBBRVyyqF5sdo="
     },
     "babel-plugin-syntax-exponentiation-operator": {
       "version": "6.13.0",
@@ -7468,6 +7471,11 @@
         "sha.js": "^2.4.8"
       }
     },
+    "pdfjs-dist": {
+      "version": "2.6.347",
+      "resolved": "https://registry.npmjs.org/pdfjs-dist/-/pdfjs-dist-2.6.347.tgz",
+      "integrity": "sha512-QC+h7hG2su9v/nU1wEI3SnpPIrqJODL7GTDFvR74ANKGq1AFJW16PH8VWnhpiTi9YcLSFV9xLeWSgq+ckHLdVQ=="
+    },
     "performance-now": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-2.1.0.tgz",
@@ -10191,6 +10199,63 @@
         "unpipe": "1.0.0"
       }
     },
+    "raw-loader": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/raw-loader/-/raw-loader-4.0.2.tgz",
+      "integrity": "sha512-ZnScIV3ag9A4wPX/ZayxL/jZH+euYb6FcUinPcgiQW0+UBtEv0O6Q3lGd3cqJ+GHH+rksEv3Pj99oxJ3u3VIKA==",
+      "requires": {
+        "loader-utils": "^2.0.0",
+        "schema-utils": "^3.0.0"
+      },
+      "dependencies": {
+        "ajv": {
+          "version": "6.12.6",
+          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
+          "integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==",
+          "requires": {
+            "fast-deep-equal": "^3.1.1",
+            "fast-json-stable-stringify": "^2.0.0",
+            "json-schema-traverse": "^0.4.1",
+            "uri-js": "^4.2.2"
+          }
+        },
+        "fast-deep-equal": {
+          "version": "3.1.3",
+          "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
+          "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q=="
+        },
+        "json-schema-traverse": {
+          "version": "0.4.1",
+          "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
+          "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg=="
+        },
+        "json5": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/json5/-/json5-2.2.1.tgz",
+          "integrity": "sha512-1hqLFMSrGHRHxav9q9gNjJ5EXznIxGVO09xQRrwplcS8qs28pZ8s8hupZAmqDwZUmVZ2Qb2jnyPOWcDH8m8dlA=="
+        },
+        "loader-utils": {
+          "version": "2.0.4",
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.4.tgz",
+          "integrity": "sha512-xXqpXoINfFhgua9xiqD8fPFHgkoq1mmmpE92WlDbm9rNRd/EbRb+Gqf908T2DMfuHjjJlksiK2RbHVOdD/MqSw==",
+          "requires": {
+            "big.js": "^5.2.2",
+            "emojis-list": "^3.0.0",
+            "json5": "^2.1.2"
+          }
+        },
+        "schema-utils": {
+          "version": "3.1.1",
+          "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-3.1.1.tgz",
+          "integrity": "sha512-Y5PQxS4ITlC+EahLuXaY86TXfR7Dc5lw294alXOq86JAHCihAIZfqv8nNCWvaEJvaC51uN9hbLGeV0cFBdH+Fw==",
+          "requires": {
+            "@types/json-schema": "^7.0.8",
+            "ajv": "^6.12.5",
+            "ajv-keywords": "^3.5.2"
+          }
+        }
+      }
+    },
     "read-cache": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz",
@@ -12313,6 +12378,19 @@
         }
       }
     },
+    "vue-pdf": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/vue-pdf/-/vue-pdf-4.3.0.tgz",
+      "integrity": "sha512-zd3lJj6CbtrawgaaDDciTDjkJMUKiLWtbEmBg5CvFn9Noe9oAO/GNy/fc5c59qGuFCJ14ibIV1baw4S07e5bSQ==",
+      "requires": {
+        "babel-plugin-syntax-dynamic-import": "^6.18.0",
+        "loader-utils": "^1.4.0",
+        "pdfjs-dist": "2.6.347",
+        "raw-loader": "^4.0.2",
+        "vue-resize-sensor": "^2.0.0",
+        "worker-loader": "^2.0.0"
+      }
+    },
     "vue-qrcode-reader": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/vue-qrcode-reader/-/vue-qrcode-reader-3.1.0.tgz",
@@ -12332,6 +12410,11 @@
         }
       }
     },
+    "vue-resize-sensor": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/vue-resize-sensor/-/vue-resize-sensor-2.0.0.tgz",
+      "integrity": "sha512-W+y2EAI/BxS4Vlcca9scQv8ifeBFck56DRtSwWJ2H4Cw1GLNUYxiZxUHHkuzuI5JPW/cYtL1bPO5xPyEXx4LmQ=="
+    },
     "vue-router": {
       "version": "3.5.1",
       "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.5.1.tgz",
@@ -13517,6 +13600,47 @@
         "errno": "~0.1.7"
       }
     },
+    "worker-loader": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/worker-loader/-/worker-loader-2.0.0.tgz",
+      "integrity": "sha512-tnvNp4K3KQOpfRnD20m8xltE3eWh89Ye+5oj7wXEEHKac1P4oZ6p9oTj8/8ExqoSBnk9nu5Pr4nKfQ1hn2APJw==",
+      "requires": {
+        "loader-utils": "^1.0.0",
+        "schema-utils": "^0.4.0"
+      },
+      "dependencies": {
+        "ajv": {
+          "version": "6.12.6",
+          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
+          "integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==",
+          "requires": {
+            "fast-deep-equal": "^3.1.1",
+            "fast-json-stable-stringify": "^2.0.0",
+            "json-schema-traverse": "^0.4.1",
+            "uri-js": "^4.2.2"
+          }
+        },
+        "fast-deep-equal": {
+          "version": "3.1.3",
+          "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
+          "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q=="
+        },
+        "json-schema-traverse": {
+          "version": "0.4.1",
+          "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
+          "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg=="
+        },
+        "schema-utils": {
+          "version": "0.4.7",
+          "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-0.4.7.tgz",
+          "integrity": "sha512-v/iwU6wvwGK8HbU9yi3/nhGzP0yGSuhQMzL6ySiec1FSrZZDkhm4noOSWzrNFo/jEc+SJY6jRTwuwbSXJPDUnQ==",
+          "requires": {
+            "ajv": "^6.1.0",
+            "ajv-keywords": "^3.1.0"
+          }
+        }
+      }
+    },
     "wrap-ansi": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz",

package.json

@@ -31,6 +31,7 @@
     "vue-baidu-map": "^0.21.22",
     "vue-cookies": "^1.7.4",
     "vue-esign": "^1.0.5",
+    "vue-pdf": "^4.3.0",
     "vue-qrcode-reader": "^3.1.0",
     "vue-router": "^3.0.1",
     "vue-search-tree": "^1.9.9",

src/api/lawEnforcement/index.js

@@ -717,3 +717,166 @@ export function getMonitor(query) {
     params: query
   })
 }
+
+// 查询案件下拉列表
+export function getCaseList(query) {
+  return request({
+    url: '/enforce/case/getCaseList',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询案件文书列表
+export function getCaseDocumentList(query) {
+  return request({
+    url: '/enforce/case/getCaseDocumentList',
+    method: 'get',
+    params: query
+  })
+}
+
+// 生成下载协助调查函
+export function createAssistPDF(query) {
+  return request({
+    url: '/enforce/assist/createPDF',
+    method: 'post',
+    params: query
+  })
+}
+
+// 生成现场检查(勘察)笔录PDF
+export function createSurveyPDF(query) {
+  return request({
+    url: '/enforce/survey/createPDF',
+    method: 'post',
+    params: query
+  })
+}
+
+// 生成立案相关PDF
+export function createPutrecordPDF(query) {
+  return request({
+    url: '/enforce/putrecord/createPDF',
+    method: 'post',
+    params: query
+  })
+}
+
+// 生成现场检查(勘察)笔录PDF
+export function createOnrecordPDF(query) {
+  return request({
+    url: '/enforce/onrecord/createPDF',
+    method: 'post',
+    params: query
+  })
+}
+
+// 生成抽样产品相关PDF
+export function createSamplingPDF(query) {
+  return request({
+    url: '/enforce/sampling/createPDF',
+    method: 'post',
+    params: query
+  })
+}
+
+// 生成PDF
+export function createTreatPDF(query) {
+  return request({
+    url: '/enforce/treat/createPDF',
+    method: 'post',
+    params: query
+  })
+}
+
+// 生成PDF
+export function createDecisionPDF(query) {
+  return request({
+    url: '/enforce/decision/createPDF',
+    method: 'post',
+    params: query
+  })
+}
+
+// 生成现场检查(勘察)笔录PDF
+export function createEvidencePDF(query) {
+  return request({
+    url: '/enforce/evidence/createPDF',
+    method: 'post',
+    params: query
+  })
+}
+
+// 生成PDF
+export function createExecutePDF(query) {
+  return request({
+    url: '/enforce/execute/createPDF',
+    method: 'post',
+    params: query
+  })
+}
+
+// 生成PDF
+export function createEndingPDF(query) {
+  return request({
+    url: '/enforce/ending/createPDF',
+    method: 'post',
+    params: query
+  })
+}
+
+// 案件中止调查PDF
+export function createBreakPDF(query) {
+  return request({
+    url: '/enforce/break/createPDF',
+    method: 'post',
+    params: query
+  })
+}
+
+// 案件恢复调查PDF
+export function createResumePDF(query) {
+  return request({
+    url: '/enforce/resume/createPDF',
+    method: 'post',
+    params: query
+  })
+}
+
+// 案件数量
+export function caseNumberAll(query) {
+  return request({
+    url: '/enforce/bigData/caseNumberAll',
+    method: 'get',
+    params: query
+  })
+}
+
+// 案件分类统计
+export function caseTypeAccount(query) {
+  return request({
+    url: '/enforce/bigData/caseTypeAccount',
+    method: 'get',
+    params: query
+  })
+}
+
+// 案件来源分析
+export function caseSourceTypeAccount(query) {
+  return request({
+    url: '/home/enforceStatistic/caseSourceTypeAccount',
+    method: 'get',
+    params: query
+  })
+}
+
+// 案件来源分析
+export function casePreMonthNum(query) {
+  return request({
+    url: '/enforce/bigData/casePreMonthNum',
+    method: 'get',
+    params: query
+  })
+}
+

src/components/agriculturalTrusteeship/dialog.vue

@@ -0,0 +1,80 @@
+<template>
+  <div class="tb-toolbar-container">
+
+    <div class="main">
+      <div class="main_box">
+        <van-cell label="快速发布，收益多多" center :to="{name:'agriculturalTrusteeshipSocializationRelease'}">
+          <template #title>
+            <p style="color:#4E7FFF; ">发布产品</p>
+          </template>
+          <template #icon>
+            <img src="../../../static/images/agriculturalTrusteeship/socialization/dialog_01.png" style="margin-right: 15PX" />
+          </template>
+        </van-cell>
+      </div>
+      <div class="main_box">
+        <van-cell label="未发布的商品都在这" center :to="{name:'agriculturalTrusteeshipSocializationDraft'}">
+          <template #title>
+            <p style="color:#FF5D00; ">草稿箱</p>
+          </template>
+          <template #icon>
+            <img src="../../../static/images/agriculturalTrusteeship/socialization/dialog_02.png" style="margin-right: 15PX" />
+          </template>
+          <template #default>
+            <p style="background: #FBE6D9;color: #FF5D00;display: inline-block;padding: 0 5PX;border-radius: 5PX;">12</p>
+          </template>
+        </van-cell>
+      </div>
+      <img src="../../../static/images/agriculturalTrusteeship/socialization/footer_close.png" alt="" class="add_btn" @click="openDialog">
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: "toolbar",
+  methods:{
+    openDialog(){
+      this.$parent.openDialog(false)
+    }
+  },
+};
+</script>
+<style scoped lang="scss">
+.tb-toolbar-container {
+  z-index: 99999;
+  width: 100%;
+  height: 100vh;
+  position: absolute;
+  top: 0;
+  background: rgba(255,255,255,0.95);
+  .main{
+    position: absolute;
+    left: 0%;
+    bottom: 0;
+    width: 100%;
+    .add_btn{
+      position: relative;
+      left: 50%;
+      transform: translate(-50%,10%);
+      margin-top:4vh;
+    }
+  }
+  .main_box{
+    width: 92%;
+    margin: 0 auto;
+    margin-top: 2vh;
+    border-radius: 20PX;
+    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
+    overflow: hidden;
+    background-color: #FFF;
+    padding: 2vh 4%;
+    /deep/ .van-cell{
+      padding: 0;
+      margin-bottom: 10PX;
+      &:last-child{
+        margin-bottom: 0;
+      }
+    }
+  }
+}
+</style>

src/components/common/agr_footer.vue

@@ -0,0 +1,78 @@
+<template>
+  <div class="tb-toolbar-container">
+    <router-link to="/agriculturalTrusteeship/socializationIndex" class="tab" active-class="active" exact>
+      <span class="icon"><van-icon name="shopping-cart-o" size="25" /></span>
+      <p class="text">待处理</p>
+    </router-link>
+    <router-link to="/agriculturalTrusteeship/socializationProject" class="tab" active-class="active">
+      <span class="icon"><van-icon name="shop-o" size="25" /></span>
+      <p class="text">产品</p>
+    </router-link>
+    <img src="../../../static/images/agriculturalTrusteeship/socialization/footer_add.png" alt="" class="add_btn" @click="openDialog">
+    <router-link to="/agriculturalTrusteeship/socializationBill" class="tab" active-class="active">
+      <span class="icon"><van-icon name="bill-o" size="25" /></span>
+      <p class="text">订单</p>
+    </router-link>
+    <router-link to="/agriculturalTrusteeship/socializationUser" class="tab" active-class="active">
+      <span class="icon"><van-icon name="contact" size="25" /></span>
+      <p class="text">我的</p>
+    </router-link>
+  </div>
+</template>
+<script>
+export default {
+  name: "toolbar",
+  data(){
+    return{
+      text:"我是子组件数据，我要发送给父组件",
+      num:12
+    }
+  },
+  methods:{
+    openDialog(){
+      this.$parent.openDialog(true)
+    }
+  },
+};
+</script>
+<style scoped lang="scss">
+.tb-toolbar-container {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: flex;
+  left: 0;
+  bottom: 0;
+  width: 100%;
+  z-index: 1001;
+  background-color: #fff;
+  border-top: 1px solid #e7e7e7;
+  border-bottom: 1px solid #f8f8f8;
+  -webkit-box-pack: justify;
+  /*justify-content: space-around;*/
+  -webkit-box-align: center;
+  align-items: center;
+  position: fixed;
+  padding: 10px 3%;
+  .tab {
+    color: #5d656b;
+    text-align: center;
+    width: 20%;
+    &.active {
+      color: #3E6CCD;
+    }
+    .icon {
+      padding-bottom: 3px;
+    }
+    &:nth-child(4){
+      margin-left: auto;
+    }
+  }
+  .add_btn{
+    position: absolute;
+    left: 50%;
+    top: 0;
+    transform: translate(-50%,-40%);
+  }
+}
+</style>

src/components/common/buyer_footer.vue

@@ -0,0 +1,68 @@
+<template>
+  <div class="tb-toolbar-container">
+    <router-link to="/agriculturalTrusteeship/buyerIndex" class="tab" active-class="active" exact>
+      <span class="icon"><van-icon name="shopping-cart-o" size="25" /></span>
+      <p class="text">寻找服务</p>
+    </router-link>
+    <router-link to="/agriculturalTrusteeship/buyerWaitBill" class="tab" active-class="active">
+      <span class="icon"><van-icon name="todo-list-o" size="25" /></span>
+      <p class="text">等待处理</p>
+    </router-link>
+    <router-link to="/agriculturalTrusteeship/buyerAllBill" class="tab" active-class="active">
+      <span class="icon"><van-icon name="bill-o" size="25" /></span>
+      <p class="text">所有订单</p>
+    </router-link>
+  </div>
+</template>
+<script>
+export default {
+  name: "toolbar",
+  data(){
+    return{
+      text:"我是子组件数据，我要发送给父组件",
+      num:12
+    }
+  },
+  methods:{
+  },
+};
+</script>
+<style scoped lang="scss">
+.tb-toolbar-container {
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: flex;
+  left: 0;
+  bottom: 0;
+  width: 100%;
+  z-index: 1001;
+  background-color: #fff;
+  border-top: 1px solid #e7e7e7;
+  border-bottom: 1px solid #f8f8f8;
+  -webkit-box-pack: justify;
+  /*justify-content: space-around;*/
+  -webkit-box-align: center;
+  align-items: center;
+  position: fixed;
+  padding: 10px 3%;
+  justify-content: space-around;
+  .tab {
+    color: #5d656b;
+    text-align: center;
+    width: 20%;
+    &.active {
+      color: #3E6CCD;
+    }
+    .icon {
+      padding-bottom: 3px;
+    }
+  }
+  .add_btn{
+    position: absolute;
+    left: 50%;
+    top: 0;
+    transform: translate(-50%,-40%);
+  }
+}
+</style>

src/permission.js

@@ -148,6 +148,28 @@ const whiteList = [
   '/agriculturalTrusteeship/societyProjectList',//社会化产品列表
   '/agriculturalTrusteeship/societyProjectDetail',//社会化产品详情
   '/agriculturalTrusteeship/shopList',//保险列表首页
+  '/agriculturalTrusteeship/shopAdd',//保险列表首页
+  '/agriculturalTrusteeship/socializationIndex',//社会化服务组织待处理
+  '/agriculturalTrusteeship/socializationProject',//社会化服务组织产品
+  '/agriculturalTrusteeship/socializationProjectDetail',//社会化服务组织产品详情
+  '/agriculturalTrusteeship/socializationBill',//社会化服务组织订单
+  '/agriculturalTrusteeship/socializationBillDetail',//社会化服务组织订单详情
+  '/agriculturalTrusteeship/socializationUser',//社会化服务组织个人中心
+  '/agriculturalTrusteeship/socializationUserEdit',//社会化服务组织个人信息
+  '/agriculturalTrusteeship/socializationRelease',//社会化服务组织发布产品
+  '/agriculturalTrusteeship/socializationDraft',//社会化服务组织草稿箱
+  '/agriculturalTrusteeship/socializationDraftEdit',//社会化服务组织草稿箱修改
+
+  '/agriculturalTrusteeship/buyerIndex',//买家选购
+  '/agriculturalTrusteeship/buyerWaitBill',//买家选购-等待处理
+  '/agriculturalTrusteeship/buyerAllBill',//买家选购-所有订单
+  '/agriculturalTrusteeship/placeOrder',//买家选购-下单页
+  '/agriculturalTrusteeship/billDetail',//买家选购-订单详情
+  '/agriculturalTrusteeship/billDetail2',//买家选购-订单详情
+  '/agriculturalTrusteeship/billDetail3',//买家选购-订单详情
+  '/agriculturalTrusteeship/billDetail4',//买家选购-订单详情
+  '/agriculturalTrusteeship/evaluate',//买家选购-服务评价
+
 ]
 
 router.beforeEach((to, from, next) => {

src/router/index.js

@@ -3562,11 +3562,20 @@ export const constantRoutes = [
     path: '/lawEnforcement/record',
     name: 'lawEnforcementRecord',
     meta: {
-      title: '现场检查（勘察）笔录',
+      title: '现场检查笔录',
       hidden: true,
     },
     component: (resolve) => require(['@/views/lawEnforcement/record/record'], resolve)
   },
+  { ////农业执法（新）-- 现场检查（勘察）笔录
+    path: '/lawEnforcement/recordDetail',
+    name: 'lawEnforcementRecordDetail',
+    meta: {
+      title: '现场检查笔录',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/lawEnforcement/record/recordDetail'], resolve)
+  },
   { ////农业执法（新）-- 案件列表
     path: '/lawEnforcement/caseList',
     name: 'lawEnforcementCaseList',
@@ -4571,6 +4580,188 @@ export const constantRoutes = [
     },
     component: (resolve) => require(['@/views/agriculturalTrusteeship/shop/shopList'], resolve)
   },
+  {
+    path: '/agriculturalTrusteeship/shopAdd',
+    name: 'agriculturalTrusteeshipShopAdd',
+    meta: {
+      title: '发布商品',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/agriculturalTrusteeship/shop/shopAdd'], resolve)
+  },
+
+  //社会化服务组织页面
+  {
+    path: '/agriculturalTrusteeship/socializationIndex',
+    name: 'agriculturalTrusteeshipSocializationIndex',
+    meta: {
+      title: '社会化服务组织待处理',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/agriculturalTrusteeship/socialization/index'], resolve)
+  },
+  {
+    path: '/agriculturalTrusteeship/socializationProject',
+    name: 'agriculturalTrusteeshipSocializationProject',
+    meta: {
+      title: '社会化服务组织产品',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/agriculturalTrusteeship/socialization/project'], resolve)
+  },
+  {
+    path: '/agriculturalTrusteeship/socializationProjectDetail',
+    name: 'agriculturalTrusteeshipSocializationProjectDetail',
+    meta: {
+      title: '社会化服务组织产品详情',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/agriculturalTrusteeship/socialization/projectDetail'], resolve)
+  },
+  {
+    path: '/agriculturalTrusteeship/socializationBill',
+    name: 'agriculturalTrusteeshipSocializationBill',
+    meta: {
+      title: '社会化服务组织订单',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/agriculturalTrusteeship/socialization/bill'], resolve)
+  },
+  {
+    path: '/agriculturalTrusteeship/socializationBillDetail',
+    name: 'agriculturalTrusteeshipSocializationBillDetail',
+    meta: {
+      title: '社会化服务组织订单详情',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/agriculturalTrusteeship/socialization/billDetail'], resolve)
+  },
+  {
+    path: '/agriculturalTrusteeship/socializationUser',
+    name: 'agriculturalTrusteeshipSocializationUser',
+    meta: {
+      title: '社会化服务组织个人中心',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/agriculturalTrusteeship/socialization/user'], resolve)
+  },
+  {
+    path: '/agriculturalTrusteeship/socializationUserEdit',
+    name: 'agriculturalTrusteeshipSocializationUserEdit',
+    meta: {
+      title: '社会化服务组织个人信息',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/agriculturalTrusteeship/socialization/userEdit'], resolve)
+  },
+  {
+    path: '/agriculturalTrusteeship/socializationRelease',
+    name: 'agriculturalTrusteeshipSocializationRelease',
+    meta: {
+      title: '社会化服务组织发布产品',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/agriculturalTrusteeship/socialization/release'], resolve)
+  },
+  {
+    path: '/agriculturalTrusteeship/socializationDraft',
+    name: 'agriculturalTrusteeshipSocializationDraft',
+    meta: {
+      title: '社会化服务组织草稿箱',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/agriculturalTrusteeship/socialization/draft'], resolve)
+  },
+  {
+    path: '/agriculturalTrusteeship/socializationDraftEdit',
+    name: 'agriculturalTrusteeshipSocializationDraftEdit',
+    meta: {
+      title: '社会化服务组织草稿箱修改',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/agriculturalTrusteeship/socialization/draftEdit'], resolve)
+  },
+  {
+    path: '/agriculturalTrusteeship/buyerIndex',
+    name: 'agriculturalTrusteeshipBuyerIndex',
+    meta: {
+      title: '买家选购',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/agriculturalTrusteeship/buyer/index'], resolve)
+  },
+  {
+    path: '/agriculturalTrusteeship/buyerWaitBill',
+    name: 'agriculturalTrusteeshipBuyerWaitBill',
+    meta: {
+      title: '等待处理',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/agriculturalTrusteeship/buyer/waitBill'], resolve)
+  },
+  {
+    path: '/agriculturalTrusteeship/buyerAllBill',
+    name: 'agriculturalTrusteeshipBuyerAllBill',
+    meta: {
+      title: '所有订单',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/agriculturalTrusteeship/buyer/allBill'], resolve)
+  },
+  {
+    path: '/agriculturalTrusteeship/placeOrder',
+    name: 'agriculturalTrusteeshipPlaceOrder',
+    meta: {
+      title: '下单',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/agriculturalTrusteeship/buyer/placeOrder'], resolve)
+  },
+  {
+    path: '/agriculturalTrusteeship/billDetail',
+    name: 'agriculturalTrusteeshipBillDetail',
+    meta: {
+      title: '订单详情',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/agriculturalTrusteeship/buyer/billDetail'], resolve)
+  },
+  {
+    path: '/agriculturalTrusteeship/billDetail2',
+    name: 'agriculturalTrusteeshipBillDetail2',
+    meta: {
+      title: '订单详情',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/agriculturalTrusteeship/buyer/billDetail2'], resolve)
+  },
+  {
+    path: '/agriculturalTrusteeship/billDetail3',
+    name: 'agriculturalTrusteeshipBillDetail3',
+    meta: {
+      title: '订单详情',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/agriculturalTrusteeship/buyer/billDetail3'], resolve)
+  },
+  {
+    path: '/agriculturalTrusteeship/billDetail4',
+    name: 'agriculturalTrusteeshipBillDetail4',
+    meta: {
+      title: '订单详情',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/agriculturalTrusteeship/buyer/billDetail4'], resolve)
+  },
+  {
+    path: '/agriculturalTrusteeship/evaluate',
+    name: 'agriculturalTrusteeshipEvaluate',
+    meta: {
+      title: '服务评价',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/agriculturalTrusteeship/buyer/evaluate'], resolve)
+  },
 ];
 
 

src/views/agriculturalTrusteeship/buyer/allBill.vue

@@ -0,0 +1,403 @@
+<template>
+  <div class="home_wrapper">
+    <!--  头部开始  -->
+    <div class="header">
+      <div class="search">
+        <img src="../../../../static/images/agriculturalTrusteeship/index/search_icon_01.png" />
+        <input type="text" placeholder="输入需求进行搜索" />
+        <img src="../../../../static/images/agriculturalTrusteeship/index/search_icon_02.png" />
+      </div>
+<!--      <img src="../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_01.png" alt="" @click="show = true;">-->
+    </div>
+    <!--  头部结束  -->
+
+    <!--  导航开始  -->
+    <div class="nav">
+      <div class="date">
+        <p>2021年11月</p>
+        <span>-</span>
+        <p>2021年11月</p>
+      </div>
+      <div class="nav_list">
+        <p class="active">全部</p>
+        <p>已接单</p>
+        <p>已接单</p>
+        <p>已接单</p>
+        <p>已接单</p>
+      </div>
+    </div>
+    <!--  导航结束  -->
+
+    <!--  内容开始  -->
+    <div class="main">
+
+      <van-list
+        v-model="loading"
+        :finished="finished"
+        finished-text="没有更多了"
+      >
+  <!--            @load="onLoad"  v-for="item in 10" :key="item"-->
+        <div class="main_content_right_list">
+          <div class="main_content_right_list_header">
+            <p>灌溉</p>
+            <p>服务</p>
+            <p class="on">点击评分</p>
+          </div>
+
+          <div class="main_content_right_list_center" @click="$router.push({name:'agriculturalTrusteeshipBillDetail2'})">
+            <img src="../../../../static/images/agriculturalTrusteeship/index/test.png">
+            <div class="main_content_right_list_content">
+              <p class="tt">如果只有一行就空着啊啊啊啊啊啊啊啊啊啊啊啊</p>
+              <div class="tab">
+                <p>￥<span>165,836,365</span>.00</p>
+              </div>
+              <p class="name">
+                <span>数量：300</span>
+                <span>作物：玉米</span>
+              </p>
+            </div>
+          </div>
+          <van-cell title="买方名称" :border="false" value="张三李四联合合作社" />
+          <van-cell title="联系人" :border="false" value="林晓春" />
+          <van-cell title="联系电话" :border="false" value="165 8874 0311" />
+        </div>
+        <div class="main_content_right_list">
+          <div class="main_content_right_list_header">
+            <p>灌溉</p>
+            <p>服务</p>
+            <p class="on">已评分</p>
+          </div>
+
+          <div class="main_content_right_list_center" @click="$router.push({name:'agriculturalTrusteeshipBillDetail3'})">
+            <img src="../../../../static/images/agriculturalTrusteeship/index/test.png">
+            <div class="main_content_right_list_content">
+              <p class="tt">如果只有一行就空着啊啊啊啊啊啊啊啊啊啊啊啊</p>
+              <div class="tab">
+                <p>￥<span>165,836,365</span>.00</p>
+              </div>
+              <p class="name">
+                <span>数量：300</span>
+                <span>作物：玉米</span>
+              </p>
+            </div>
+          </div>
+          <van-cell title="买方名称" :border="false" value="张三李四联合合作社" />
+          <van-cell title="联系人" :border="false" value="林晓春" />
+          <van-cell title="联系电话" :border="false" value="165 8874 0311" />
+        </div>
+        <div class="main_content_right_list">
+          <div class="main_content_right_list_header">
+            <p>灌溉</p>
+            <p>服务</p>
+            <p class="off">已拒单</p>
+          </div>
+
+          <div class="main_content_right_list_center" @click="$router.push({name:'agriculturalTrusteeshipBillDetail4'})">
+            <img src="../../../../static/images/agriculturalTrusteeship/index/test.png">
+            <div class="main_content_right_list_content">
+              <p class="tt">如果只有一行就空着啊啊啊啊啊啊啊啊啊啊啊啊</p>
+              <div class="tab">
+                <p>￥<span>165,836,365</span>.00</p>
+              </div>
+              <p class="name">
+                <span>数量：300</span>
+                <span>作物：玉米</span>
+              </p>
+            </div>
+          </div>
+          <van-cell title="买方名称" :border="false" value="张三李四联合合作社" />
+          <van-cell title="联系人" :border="false" value="林晓春" />
+          <van-cell title="联系电话" :border="false" value="165 8874 0311" />
+        </div>
+      </van-list>
+
+    </div>
+    <!--  内容结束  -->
+
+    <buyer></buyer>
+  </div>
+</template>
+<script>
+  import Cookies from "js-cookie";
+  import buyer from "@/components/common/buyer_footer";
+
+  export default {
+    name: "agriculturalTrusteeshipIndex",
+    components: {
+      buyer,
+    },
+    data() {
+      return {
+        activeKey: 0,
+        active: 0,
+        loading: false,
+        finished: false,
+        show:true,
+        activeNames:[],
+        showDialog:false
+      };
+    },
+    created() {
+
+    },
+    methods: {
+
+    },
+  }
+</script>
+<style scoped lang="scss">
+.home_wrapper{
+  background: #F9F9F9;
+}
+  /*头部*/
+  .header{
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 2vh 4% 0vh;
+  }
+
+  .search{
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    border: 1px solid #6E93F3;
+    padding: 1PX 1PX 1PX 12PX ;
+    border-radius: 50PX;
+    /*margin-right: 30PX;*/
+    flex: 1;
+    input{
+      flex: 1;
+      background: transparent;
+      margin-left: 10PX;
+    }
+  }
+  /*导航栏目*/
+  .nav{
+    width: 94%;
+    margin: 0 auto;
+    padding: 2vh 0 0;
+    /*background: #ffffff;*/
+    /*border-radius: 10PX;*/
+    /*box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);*/
+    .date{
+      display: flex;
+      justify-content: space-around;
+      align-items: center;
+      p{
+        border-radius: 1rem;
+        padding: 5PX 0PX 5PX 5%;
+        width: 40%;
+        text-align: center;
+        color: #334281;
+        box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+        background:#D6D9E6 url("../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_date.png") 20% center no-repeat;
+      }
+    }
+    .nav_list{
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      margin-top: 2vh;
+      p{
+        background: #F0F0F0;
+        padding: 7PX 0;
+        width: 18%;
+        text-align: center;
+        color: #888888;
+        border-radius: 7PX;
+        &.active{
+          background: #E2E9FD;
+          color: #1B5DEA;
+        }
+      }
+    }
+  }
+
+  /*内容*/
+  .main{
+    width: 94%;
+    margin: 0 auto;
+    .main_content_right_list{
+      margin-top: 2vh;
+      padding: 1.5vh 3%;
+      background: #ffffff;
+      border-radius: 10PX;
+      box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+      /deep/ .van-cell{
+        padding: 0;
+        margin-top: 8PX;
+      }
+      .main_content_right_list_header{
+        display: flex;
+        margin-bottom: 1vh;
+        align-items: center;
+        p{
+          padding: 3PX 10PX;
+          border-radius: 8PX;
+          &:nth-child(1){background: #2B7EEC;color: #ffffff;}
+          &:nth-child(2){background: #E2E9FD;color: #497CE8;margin-left: 10PX;}
+        }
+        .on{
+          color: #39BD18;
+          border-radius: initial;
+          margin-left: auto;
+          padding:0 0 0 20PX;
+          background: url("../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_on.png") no-repeat left center
+        }
+        .off{
+          color: #E60505;
+          border-radius: initial;
+          margin-left: auto;
+          padding:0 0 0 20PX;
+          background: url("../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_off.png") no-repeat left center
+        }
+      }
+      .main_content_right_list_center{
+        display: flex;
+        img{
+          border-radius: 15PX;
+          margin-right: 4%;
+        }
+        .main_content_right_list_content{
+          display: flex;
+          flex-direction:column;
+          justify-content: space-between;
+          .tt{
+            color: #333333;
+            font-size: .35rem;
+          }
+          .tab{
+            display: flex;
+            justify-content: space-between;
+            p{
+              &:nth-child(1){
+                flex: 1;
+                color: #FF5E00;
+                span{
+                  font-size: .4rem;
+                }
+              }
+              &:nth-child(2){
+                span{
+                  display: inline-block;
+                  text-align: center;
+                  padding: 2PX 5PX;
+                  &:nth-child(1){
+                    color: #497CE8;
+                    background: #E2E9FD;
+                    border-top-left-radius: 10PX;
+                  }
+                  &:nth-child(2){
+                    color: #ffffff;
+                    background-image: linear-gradient(to right , #5D87FA , #5FD5F5);
+                    border-bottom-right-radius: 10PX;
+                  }
+                }
+              }
+            }
+          }
+          .name{
+            color: #7A7A7A;
+            span{
+              &:nth-child(2){
+                margin-left: 5PX;
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+
+  /*弹出层*/
+  .popup_header{
+    display: flex;
+    align-items: center;
+    color: #334281;
+    font-size: .38rem;
+    margin-bottom: 15PX;
+    img{
+      margin-right: 10PX;
+      display: block;
+    }
+    p{
+      line-height: 1;
+    }
+  }
+  .popup_content{
+    .selected{
+      .on{
+        font-size: .35rem;
+        padding: 10PX 20PX;
+        color: #334281;
+        background: url("../../../../static/images/agriculturalTrusteeship/socialization/down.png")left center no-repeat;
+      }
+      .off{
+        font-size: .35rem;
+        padding: 10PX 20PX;
+        color: #334281;
+        background: url("../../../../static/images/agriculturalTrusteeship/socialization/right.png")left center no-repeat;
+      }
+      .options{
+        display: flex;
+        justify-content: space-between;
+        flex-wrap: wrap;
+        p{
+          background: #F5F5F5;
+          color: #8F8F8F;
+          width: 30%;
+          padding: 5PX 0;
+          border-radius: 5PX;
+          text-align: center;
+          &.active{
+            background: #E2E9FD;
+            color: #1B5DEA;
+          }
+        }
+      }
+    }
+  }
+  .popup_date{
+    display: flex;
+    justify-content: space-around;
+    align-items: center;
+    p{
+      border-radius: 1rem;
+      padding: 5PX 0PX 5PX 5%;
+      width: 45%;
+      text-align: center;
+      color: #1B5DEA;
+      background:#E2E9FD url("../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_date.png") 15% center no-repeat;
+    }
+  }
+  .popup_btn{
+    position: fixed;
+    bottom: 5vh;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    width: 94%;
+    left: 3%;
+    p{
+      width: 30%;
+      padding: 7PX 0;
+      border-radius: 5rem;
+      text-align: center;
+      font-size: .35rem;
+      box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+      &:nth-child(1){
+        background: #1B5DEA;
+        color: #ffffff;
+      }
+      &:nth-child(2){
+        border: 1PX solid #1B5DEA;
+        color: #1B5DEA;
+      }
+      &:nth-child(3){
+        background-image: linear-gradient(to right , #6E93F3 , #54C6E4);
+        color: #ffffff;
+      }
+    }
+  }
+</style>

src/views/agriculturalTrusteeship/buyer/billDetail.vue

@@ -0,0 +1,371 @@
+<template>
+  <div class="home_wrapper">
+    <!--  头部开始  -->
+    <van-nav-bar
+      title="订单详情"
+      fixed
+      placeholder
+      left-arrow
+      @click-left="onClickLeft"
+    />
+    <!--  头部结束  -->
+
+    <!--  内容开始  -->
+    <div class="main">
+
+        <div class="main_content_right_list">
+          <div class="main_content_right_list_header">
+            <p class="on">商品信息</p>
+            <p>灌溉</p>
+            <p>服务</p>
+          </div>
+
+          <div class="main_content_right_list_center">
+            <img src="../../../../static/images/agriculturalTrusteeship/index/test.png">
+            <div class="main_content_right_list_content">
+              <p class="tt">如果只有一行就空着啊啊啊啊啊啊啊啊啊啊啊啊</p>
+              <div class="tab">
+                <p>￥<span>165,836,365</span>.00/亩</p>
+              </div>
+            </div>
+          </div>
+          <van-cell title="买方名称" :border="false" value="张三李四联合合作社" />
+          <van-cell title="联系人" :border="false" value="林晓春" />
+          <van-cell title="联系电话" :border="false" value="165 8874 0311" />
+        </div>
+
+        <div class="main_content_right_list">
+          <div class="main_content_right_list_header">
+            <p class="on">买家信息</p>
+          </div>
+
+          <van-cell title="联系人" :border="false" value="张三李四联合合作社" />
+          <van-cell title="联系电话" :border="false" value="林晓春" />
+          <van-cell title="服务地点" :border="false" value="165 8874 0311" />
+        </div>
+
+        <div class="main_content_right_list">
+          <div class="main_content_right_list_header">
+            <p class="on">订单信息</p>
+          </div>
+
+          <van-cell title="服务合同" :border="false" value="请输入产品名称" />
+          <van-cell title="服务作物" :border="false" value="请输入产品类型" />
+          <van-cell title="下单时间" :border="false" value="请输入二级分类" />
+          <van-cell title="服务时间" :border="false" value="请输入产品规格" />
+          <van-cell title="服务数量" :border="false" value="请输入所属主体" />
+          <van-cell title="成交金额" :border="false" value="请输入单价" />
+          <van-cell title="备注" :border="false" value="请输入数量" />
+        </div>
+
+    </div>
+
+    <!--  内容结束  -->
+  </div>
+</template>
+<script>
+  import Cookies from "js-cookie";
+
+  export default {
+    name: "agriculturalTrusteeshipIndex",
+    data() {
+      return {
+        activeKey: 0,
+        active: 0,
+        loading: false,
+        finished: false,
+        show:true,
+        activeNames:[],
+      };
+    },
+    created() {
+
+    },
+    methods: {
+
+    },
+  }
+</script>
+<style scoped lang="scss">
+.home_wrapper{
+
+}
+  /*头部*/
+  .header{
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 2vh 4% 0vh;
+  }
+
+  .search{
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    border: 1px solid #6E93F3;
+    padding: 1PX 1PX 1PX 12PX ;
+    border-radius: 50PX;
+    margin-right: 30PX;
+    flex: 1;
+    input{
+      flex: 1;
+      background: transparent;
+      margin-left: 10PX;
+    }
+  }
+  /*导航栏目*/
+  .nav{
+    width: 94%;
+    margin: 0 auto;
+    margin-top: 2vh;
+    padding: 1.5vh 3%;
+    background: #ffffff;
+    border-radius: 10PX;
+    box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+    .date{
+      display: flex;
+      justify-content: space-around;
+      align-items: center;
+      p{
+        border-radius: 1rem;
+        padding: 5PX 0PX 5PX 5%;
+        width: 40%;
+        text-align: center;
+        color: #334281;
+        box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+        background:#D6D9E6 url("../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_date.png") 20% center no-repeat;
+      }
+    }
+    .billCount {
+      display: flex;
+      text-align: center;
+      margin-top: 3vh;
+      .billCount_left{
+        width: 50%;
+        color: #1B5DEA;
+        p{
+          &:nth-child(1){
+            font-size: .45rem;
+          }
+        }
+      }
+      .billCount_right{
+        width: 50%;
+        color: #FF5E00;
+        p{
+          &:nth-child(1){
+            font-size: .45rem;
+          }
+        }
+      }
+    }
+  }
+
+  /*内容*/
+  .main{
+    width: 94%;
+    margin: 0 auto;
+    .main_content_right_list{
+      margin-top: 2vh;
+      padding: 1.5vh 3%;
+      background: #ffffff;
+      border-radius: 10PX;
+      /*box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);*/
+      /deep/ .van-cell{
+        padding: 0;
+        margin-top: 10PX;
+      }
+      .main_content_right_list_header{
+        display: flex;
+        margin-bottom: 1vh;
+        align-items: center;
+        p{
+          padding: 3PX 10PX;
+          border-radius: 8PX;
+          &:nth-child(2){background: #2B7EEC;color: #ffffff;margin-left: auto;}
+          &:nth-child(3){background: #E2E9FD;color: #497CE8;margin-left: 10PX;}
+        }
+        .on{
+          color: #334281;
+          border-radius: initial;
+          padding:0 0 0 20PX;
+          font-size: 0.35rem;
+          background: url("../../../../static/images/agriculturalTrusteeship/socialization/bill_icon_01.png") no-repeat left center
+        }
+        .off{
+          color: #E60505;
+          border-radius: initial;
+          margin-left: auto;
+          padding:0 0 0 15PX;
+          background: url("../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_off.png") no-repeat left center
+        }
+      }
+      .main_content_right_list_center{
+        display: flex;
+        img{
+          border-radius: 15PX;
+          margin-right: 4%;
+        }
+        .main_content_right_list_content{
+          display: flex;
+          flex-direction:column;
+          justify-content: space-between;
+          .tt{
+            color: #333333;
+            font-size: .35rem;
+          }
+          .tab{
+            display: flex;
+            justify-content: space-between;
+            p{
+              &:nth-child(1){
+                flex: 1;
+                color: #FF5E00;
+                span{
+                  font-size: .4rem;
+                }
+              }
+              &:nth-child(2){
+                span{
+                  display: inline-block;
+                  text-align: center;
+                  padding: 2PX 5PX;
+                  &:nth-child(1){
+                    color: #497CE8;
+                    background: #E2E9FD;
+                    border-top-left-radius: 10PX;
+                  }
+                  &:nth-child(2){
+                    color: #ffffff;
+                    background-image: linear-gradient(to right , #5D87FA , #5FD5F5);
+                    border-bottom-right-radius: 10PX;
+                  }
+                }
+              }
+            }
+          }
+          .name{
+            color: #7A7A7A;
+            span{
+              &:nth-child(2){
+                margin-left: 5PX;
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+
+  /*弹出层*/
+  .popup_header{
+    display: flex;
+    align-items: center;
+    color: #334281;
+    font-size: .38rem;
+    margin-bottom: 15PX;
+    img{
+      margin-right: 10PX;
+      display: block;
+    }
+    p{
+      line-height: 1;
+    }
+  }
+  .popup_content{
+    .selected{
+      .on{
+        font-size: .35rem;
+        padding: 10PX 20PX;
+        color: #334281;
+        background: url("../../../../static/images/agriculturalTrusteeship/socialization/down.png")left center no-repeat;
+      }
+      .off{
+        font-size: .35rem;
+        padding: 10PX 20PX;
+        color: #334281;
+        background: url("../../../../static/images/agriculturalTrusteeship/socialization/right.png")left center no-repeat;
+      }
+      .options{
+        display: flex;
+        justify-content: space-between;
+        flex-wrap: wrap;
+        p{
+          background: #F5F5F5;
+          color: #8F8F8F;
+          width: 30%;
+          padding: 5PX 0;
+          border-radius: 5PX;
+          text-align: center;
+          &.active{
+            background: #E2E9FD;
+            color: #1B5DEA;
+          }
+        }
+      }
+    }
+  }
+  .popup_date{
+    display: flex;
+    justify-content: space-around;
+    align-items: center;
+    p{
+      border-radius: 1rem;
+      padding: 5PX 0PX 5PX 5%;
+      width: 45%;
+      text-align: center;
+      color: #1B5DEA;
+      background:#E2E9FD url("../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_date.png") 15% center no-repeat;
+    }
+  }
+  .popup_btn{
+    position: fixed;
+    bottom: 5vh;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    width: 94%;
+    left: 3%;
+    p{
+      width: 30%;
+      padding: 7PX 0;
+      border-radius: 5rem;
+      text-align: center;
+      font-size: .35rem;
+      box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+      &:nth-child(1){
+        background: #1B5DEA;
+        color: #ffffff;
+      }
+      &:nth-child(2){
+        border: 1PX solid #1B5DEA;
+        color: #1B5DEA;
+      }
+      &:nth-child(3){
+        background-image: linear-gradient(to right , #6E93F3 , #54C6E4);
+        color: #ffffff;
+      }
+    }
+  }
+.main_btn{
+  display: flex;
+  justify-content: space-around;
+  padding: 4vh 0;
+  p{
+    font-size: .4rem;
+    width: 35%;
+    text-align: center;
+    padding: 10PX 0;
+    border-radius: 5rem;
+    box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+    &:nth-child(1){
+      background: #334281;
+      color: #ffffff;
+    }
+    &:nth-child(2){
+      background: #D1D5E4;
+      color: #334281;
+    }
+  }
+}
+</style>

src/views/agriculturalTrusteeship/buyer/billDetail2.vue

@@ -0,0 +1,394 @@
+<template>
+  <div class="home_wrapper">
+    <!--  头部开始  -->
+    <van-nav-bar
+      title="订单详情"
+      fixed
+      placeholder
+      left-arrow
+      @click-left="onClickLeft"
+    />
+    <!--  头部结束  -->
+
+    <!--  内容开始  -->
+    <div class="main">
+
+        <div class="main_content_right_list">
+          <div class="main_content_right_list_header">
+            <p class="on">商品信息</p>
+            <p>灌溉</p>
+            <p>服务</p>
+          </div>
+
+          <div class="main_content_right_list_center">
+            <img src="../../../../static/images/agriculturalTrusteeship/index/test.png">
+            <div class="main_content_right_list_content">
+              <p class="tt">如果只有一行就空着啊啊啊啊啊啊啊啊啊啊啊啊</p>
+              <div class="tab">
+                <p>￥<span>165,836,365</span>.00/亩</p>
+              </div>
+            </div>
+          </div>
+          <van-cell title="买方名称" :border="false" value="张三李四联合合作社" />
+          <van-cell title="联系人" :border="false" value="林晓春" />
+          <van-cell title="联系电话" :border="false" value="165 8874 0311" />
+        </div>
+
+        <div class="main_content_right_list">
+          <div class="main_content_right_list_header">
+            <p class="on">买家信息</p>
+          </div>
+
+          <van-cell title="联系人" :border="false" value="张三李四联合合作社" />
+          <van-cell title="联系电话" :border="false" value="林晓春" />
+          <van-cell title="服务地点" :border="false" value="165 8874 0311" />
+        </div>
+
+        <div class="main_content_right_list">
+          <div class="main_content_right_list_header">
+            <p class="on">订单信息</p>
+          </div>
+
+          <van-cell title="接单时间" :border="false" value="接单时间" />
+          <van-cell title="服务合同" :border="false" value="服务合同" />
+          <van-cell title="服务作物" :border="false" value="服务作物" />
+          <van-cell title="下单时间" :border="false" value="下单时间" />
+          <van-cell title="服务时间" :border="false" value="请输入产品规格" />
+          <van-cell title="服务数量" :border="false" value="请输入所属主体" />
+          <van-cell title="成交金额" :border="false" value="请输入单价" />
+          <van-cell title="备注" :border="false" value="请输入数量" />
+        </div>
+
+    </div>
+
+    <!--  内容结束  -->
+    <div class="footer">
+      <p>温馨提示：请在服务完成后进行评分</p>
+      <img src="../../../../static/images/agriculturalTrusteeship/buyer/buyer_icon_02.png" @click="$router.push({name:'agriculturalTrusteeshipEvaluate'})">
+    </div>
+  </div>
+</template>
+<script>
+  import Cookies from "js-cookie";
+
+  export default {
+    name: "agriculturalTrusteeshipIndex",
+    data() {
+      return {
+        activeKey: 0,
+        active: 0,
+        loading: false,
+        finished: false,
+        show:true,
+        activeNames:[],
+      };
+    },
+    created() {
+
+    },
+    methods: {
+
+    },
+  }
+</script>
+<style scoped lang="scss">
+.home_wrapper{
+
+}
+  /*头部*/
+  .header{
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 2vh 4% 0vh;
+  }
+
+  .search{
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    border: 1px solid #6E93F3;
+    padding: 1PX 1PX 1PX 12PX ;
+    border-radius: 50PX;
+    margin-right: 30PX;
+    flex: 1;
+    input{
+      flex: 1;
+      background: transparent;
+      margin-left: 10PX;
+    }
+  }
+  /*导航栏目*/
+  .nav{
+    width: 94%;
+    margin: 0 auto;
+    margin-top: 2vh;
+    padding: 1.5vh 3%;
+    background: #ffffff;
+    border-radius: 10PX;
+    box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+    .date{
+      display: flex;
+      justify-content: space-around;
+      align-items: center;
+      p{
+        border-radius: 1rem;
+        padding: 5PX 0PX 5PX 5%;
+        width: 40%;
+        text-align: center;
+        color: #334281;
+        box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+        background:#D6D9E6 url("../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_date.png") 20% center no-repeat;
+      }
+    }
+    .billCount {
+      display: flex;
+      text-align: center;
+      margin-top: 3vh;
+      .billCount_left{
+        width: 50%;
+        color: #1B5DEA;
+        p{
+          &:nth-child(1){
+            font-size: .45rem;
+          }
+        }
+      }
+      .billCount_right{
+        width: 50%;
+        color: #FF5E00;
+        p{
+          &:nth-child(1){
+            font-size: .45rem;
+          }
+        }
+      }
+    }
+  }
+
+  /*内容*/
+  .main{
+    width: 94%;
+    margin: 0 auto;
+    padding-bottom: 15vh;
+    .main_content_right_list{
+      margin-top: 2vh;
+      padding: 1.5vh 3%;
+      background: #ffffff;
+      border-radius: 10PX;
+      /*box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);*/
+      /deep/ .van-cell{
+        padding: 0;
+        margin-top: 10PX;
+      }
+      .main_content_right_list_header{
+        display: flex;
+        margin-bottom: 1vh;
+        align-items: center;
+        p{
+          padding: 3PX 10PX;
+          border-radius: 8PX;
+          &:nth-child(2){background: #2B7EEC;color: #ffffff;margin-left: auto;}
+          &:nth-child(3){background: #E2E9FD;color: #497CE8;margin-left: 10PX;}
+        }
+        .on{
+          color: #334281;
+          border-radius: initial;
+          padding:0 0 0 20PX;
+          font-size: 0.35rem;
+          background: url("../../../../static/images/agriculturalTrusteeship/socialization/bill_icon_01.png") no-repeat left center
+        }
+        .off{
+          color: #E60505;
+          border-radius: initial;
+          margin-left: auto;
+          padding:0 0 0 15PX;
+          background: url("../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_off.png") no-repeat left center
+        }
+      }
+      .main_content_right_list_center{
+        display: flex;
+        img{
+          border-radius: 15PX;
+          margin-right: 4%;
+        }
+        .main_content_right_list_content{
+          display: flex;
+          flex-direction:column;
+          justify-content: space-between;
+          .tt{
+            color: #333333;
+            font-size: .35rem;
+          }
+          .tab{
+            display: flex;
+            justify-content: space-between;
+            p{
+              &:nth-child(1){
+                flex: 1;
+                color: #FF5E00;
+                span{
+                  font-size: .4rem;
+                }
+              }
+              &:nth-child(2){
+                span{
+                  display: inline-block;
+                  text-align: center;
+                  padding: 2PX 5PX;
+                  &:nth-child(1){
+                    color: #497CE8;
+                    background: #E2E9FD;
+                    border-top-left-radius: 10PX;
+                  }
+                  &:nth-child(2){
+                    color: #ffffff;
+                    background-image: linear-gradient(to right , #5D87FA , #5FD5F5);
+                    border-bottom-right-radius: 10PX;
+                  }
+                }
+              }
+            }
+          }
+          .name{
+            color: #7A7A7A;
+            span{
+              &:nth-child(2){
+                margin-left: 5PX;
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+
+  /*弹出层*/
+  .popup_header{
+    display: flex;
+    align-items: center;
+    color: #334281;
+    font-size: .38rem;
+    margin-bottom: 15PX;
+    img{
+      margin-right: 10PX;
+      display: block;
+    }
+    p{
+      line-height: 1;
+    }
+  }
+  .popup_content{
+    .selected{
+      .on{
+        font-size: .35rem;
+        padding: 10PX 20PX;
+        color: #334281;
+        background: url("../../../../static/images/agriculturalTrusteeship/socialization/down.png")left center no-repeat;
+      }
+      .off{
+        font-size: .35rem;
+        padding: 10PX 20PX;
+        color: #334281;
+        background: url("../../../../static/images/agriculturalTrusteeship/socialization/right.png")left center no-repeat;
+      }
+      .options{
+        display: flex;
+        justify-content: space-between;
+        flex-wrap: wrap;
+        p{
+          background: #F5F5F5;
+          color: #8F8F8F;
+          width: 30%;
+          padding: 5PX 0;
+          border-radius: 5PX;
+          text-align: center;
+          &.active{
+            background: #E2E9FD;
+            color: #1B5DEA;
+          }
+        }
+      }
+    }
+  }
+  .popup_date{
+    display: flex;
+    justify-content: space-around;
+    align-items: center;
+    p{
+      border-radius: 1rem;
+      padding: 5PX 0PX 5PX 5%;
+      width: 45%;
+      text-align: center;
+      color: #1B5DEA;
+      background:#E2E9FD url("../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_date.png") 15% center no-repeat;
+    }
+  }
+  .popup_btn{
+    position: fixed;
+    bottom: 5vh;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    width: 94%;
+    left: 3%;
+    p{
+      width: 30%;
+      padding: 7PX 0;
+      border-radius: 5rem;
+      text-align: center;
+      font-size: .35rem;
+      box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+      &:nth-child(1){
+        background: #1B5DEA;
+        color: #ffffff;
+      }
+      &:nth-child(2){
+        border: 1PX solid #1B5DEA;
+        color: #1B5DEA;
+      }
+      &:nth-child(3){
+        background-image: linear-gradient(to right , #6E93F3 , #54C6E4);
+        color: #ffffff;
+      }
+    }
+  }
+.main_btn{
+  display: flex;
+  justify-content: space-around;
+  padding: 4vh 0;
+  p{
+    font-size: .4rem;
+    width: 35%;
+    text-align: center;
+    padding: 10PX 0;
+    border-radius: 5rem;
+    box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+    &:nth-child(1){
+      background: #334281;
+      color: #ffffff;
+    }
+    &:nth-child(2){
+      background: #D1D5E4;
+      color: #334281;
+    }
+  }
+}
+.footer{
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  background: #ffffff;
+  position: fixed;
+  bottom: 0;
+  padding: 1vh 4%;
+  width: 100%;
+  p{
+    color: #989898;
+    background: #F2F2F2;
+    padding: 5PX 10PX;
+    text-align: center;
+    border-radius: 8PX;
+  }
+}
+</style>

src/views/agriculturalTrusteeship/buyer/billDetail3.vue

@@ -0,0 +1,332 @@
+<template>
+  <div class="home_wrapper">
+    <!--  头部开始  -->
+    <van-nav-bar
+      title="订单详情"
+      fixed
+      placeholder
+      left-arrow
+      @click-left="onClickLeft"
+    />
+    <!--  头部结束  -->
+
+    <!--  内容开始  -->
+    <div class="main">
+
+        <p class="type">已评分<span>评分时间：2022.11.12</span></p>
+        <div class="main_content_right_list first">
+          <div class="main_content_right_list_header">
+            <p class="on">商品信息</p>
+            <p>灌溉</p>
+            <p>服务</p>
+          </div>
+
+          <div class="main_content_right_list_center">
+            <img src="../../../../static/images/agriculturalTrusteeship/index/test.png">
+            <div class="main_content_right_list_content">
+              <p class="tt">如果只有一行就空着啊啊啊啊啊啊啊啊啊啊啊啊</p>
+              <div class="tab">
+                <p>￥<span>165,836,365</span>.00/亩</p>
+              </div>
+            </div>
+          </div>
+          <van-cell title="买方名称" :border="false" value="张三李四联合合作社" />
+          <van-cell title="联系人" :border="false" value="林晓春" />
+          <van-cell title="联系电话" :border="false" value="165 8874 0311" />
+        </div>
+
+        <div class="main_content_right_list">
+          <div class="main_content_right_list_header">
+            <p class="on">评价信息</p>
+          </div>
+
+          <van-cell title="实际服务数量" :border="false" value="张三李四联合合作社" />
+          <van-cell title="实际服务费用" :border="false" value="林晓春" />
+          <van-cell title="服务评分" :border="false" value="165 8874 0311" />
+          <van-cell title="服务评价" :border="false" value="165 8874 0311" />
+        </div>
+
+        <div class="main_content_right_list">
+          <div class="main_content_right_list_header">
+            <p class="on">买家信息</p>
+          </div>
+
+          <van-cell title="联系人" :border="false" value="张三李四联合合作社" />
+          <van-cell title="联系电话" :border="false" value="林晓春" />
+          <van-cell title="服务地点" :border="false" value="165 8874 0311" />
+        </div>
+
+        <div class="main_content_right_list">
+          <div class="main_content_right_list_header">
+            <p class="on">订单信息</p>
+          </div>
+
+          <van-cell title="接单时间" :border="false" value="接单时间" />
+          <van-cell title="服务合同" :border="false" value="服务合同" />
+          <van-cell title="服务作物" :border="false" value="服务作物" />
+          <van-cell title="下单时间" :border="false" value="下单时间" />
+          <van-cell title="服务时间" :border="false" value="请输入产品规格" />
+          <van-cell title="服务数量" :border="false" value="请输入所属主体" />
+          <van-cell title="成交金额" :border="false" value="请输入单价" />
+          <van-cell title="备注" :border="false" value="请输入数量" />
+        </div>
+
+    </div>
+
+    <!--  内容结束  -->
+  </div>
+</template>
+<script>
+  import Cookies from "js-cookie";
+
+  export default {
+    name: "agriculturalTrusteeshipIndex",
+    data() {
+      return {
+        activeKey: 0,
+        active: 0,
+        loading: false,
+        finished: false,
+        show:true,
+        activeNames:[],
+      };
+    },
+    created() {
+
+    },
+    methods: {
+
+    },
+  }
+</script>
+<style scoped lang="scss">
+.home_wrapper{
+
+}
+  /*头部*/
+  .header{
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 2vh 4% 0vh;
+  }
+
+  .search{
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    border: 1px solid #6E93F3;
+    padding: 1PX 1PX 1PX 12PX ;
+    border-radius: 50PX;
+    margin-right: 30PX;
+    flex: 1;
+    input{
+      flex: 1;
+      background: transparent;
+      margin-left: 10PX;
+    }
+  }
+  /*导航栏目*/
+  .nav{
+    width: 94%;
+    margin: 0 auto;
+    margin-top: 2vh;
+    padding: 1.5vh 3%;
+    background: #ffffff;
+    border-radius: 10PX;
+    box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+    .date{
+      display: flex;
+      justify-content: space-around;
+      align-items: center;
+      p{
+        border-radius: 1rem;
+        padding: 5PX 0PX 5PX 5%;
+        width: 40%;
+        text-align: center;
+        color: #334281;
+        box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+        background:#D6D9E6 url("../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_date.png") 20% center no-repeat;
+      }
+    }
+    .billCount {
+      display: flex;
+      text-align: center;
+      margin-top: 3vh;
+      .billCount_left{
+        width: 50%;
+        color: #1B5DEA;
+        p{
+          &:nth-child(1){
+            font-size: .45rem;
+          }
+        }
+      }
+      .billCount_right{
+        width: 50%;
+        color: #FF5E00;
+        p{
+          &:nth-child(1){
+            font-size: .45rem;
+          }
+        }
+      }
+    }
+  }
+
+  /*内容*/
+  .main{
+    width: 94%;
+    margin: 0 auto;
+    padding-bottom: 2vh;
+    .main_content_right_list{
+      padding: 1.5vh 3%;
+      background: #ffffff;
+      border-radius: 10PX;
+      margin-bottom: 2vh;
+      /*box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);*/
+      &.first{
+        border-top-left-radius: initial;
+        border-top-right-radius: initial;
+      }
+      /deep/ .van-cell{
+        padding: 0;
+        margin-top: 10PX;
+      }
+      .main_content_right_list_header{
+        display: flex;
+        margin-bottom: 1vh;
+        align-items: center;
+        p{
+          padding: 3PX 10PX;
+          border-radius: 8PX;
+          &:nth-child(2){background: #2B7EEC;color: #ffffff;margin-left: auto;}
+          &:nth-child(3){background: #E2E9FD;color: #497CE8;margin-left: 10PX;}
+        }
+        .on{
+          color: #334281;
+          border-radius: initial;
+          padding:0 0 0 20PX;
+          font-size: 0.35rem;
+          background: url("../../../../static/images/agriculturalTrusteeship/socialization/bill_icon_01.png") no-repeat left center
+        }
+        .off{
+          color: #E60505;
+          border-radius: initial;
+          margin-left: auto;
+          padding:0 0 0 15PX;
+          background: url("../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_off.png") no-repeat left center
+        }
+      }
+      .main_content_right_list_center{
+        display: flex;
+        img{
+          border-radius: 15PX;
+          margin-right: 4%;
+        }
+        .main_content_right_list_content{
+          display: flex;
+          flex-direction:column;
+          justify-content: space-between;
+          .tt{
+            color: #333333;
+            font-size: .35rem;
+          }
+          .tab{
+            display: flex;
+            justify-content: space-between;
+            p{
+              &:nth-child(1){
+                flex: 1;
+                color: #FF5E00;
+                span{
+                  font-size: .4rem;
+                }
+              }
+              &:nth-child(2){
+                span{
+                  display: inline-block;
+                  text-align: center;
+                  padding: 2PX 5PX;
+                  &:nth-child(1){
+                    color: #497CE8;
+                    background: #E2E9FD;
+                    border-top-left-radius: 10PX;
+                  }
+                  &:nth-child(2){
+                    color: #ffffff;
+                    background-image: linear-gradient(to right , #5D87FA , #5FD5F5);
+                    border-bottom-right-radius: 10PX;
+                  }
+                }
+              }
+            }
+          }
+          .name{
+            color: #7A7A7A;
+            span{
+              &:nth-child(2){
+                margin-left: 5PX;
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+
+  /*弹出层*/
+.main_btn{
+  display: flex;
+  justify-content: space-around;
+  padding: 4vh 0;
+  p{
+    font-size: .4rem;
+    width: 35%;
+    text-align: center;
+    padding: 10PX 0;
+    border-radius: 5rem;
+    box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+    &:nth-child(1){
+      background: #334281;
+      color: #ffffff;
+    }
+    &:nth-child(2){
+      background: #D1D5E4;
+      color: #334281;
+    }
+  }
+}
+.footer{
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  background: #ffffff;
+  position: fixed;
+  bottom: 0;
+  padding: 1vh 4%;
+  width: 100%;
+  p{
+    color: #989898;
+    background: #F2F2F2;
+    padding: 5PX 10PX;
+    text-align: center;
+    border-radius: 8PX;
+  }
+}
+  .type{
+    background: #22D863;
+    font-size: .4rem;
+    display: flex;
+    justify-content: space-between;
+    margin-top: 2vh;
+    color: #ffffff;
+    padding: 10PX 3%;
+    border-top-left-radius: 10PX;
+    border-top-right-radius: 10PX;
+    align-items: center;
+    span{
+      font-size: .35rem;
+    }
+  }
+</style>

src/views/agriculturalTrusteeship/buyer/billDetail4.vue

@@ -0,0 +1,320 @@
+<template>
+  <div class="home_wrapper">
+    <!--  头部开始  -->
+    <van-nav-bar
+      title="订单详情"
+      fixed
+      placeholder
+      left-arrow
+      @click-left="onClickLeft"
+    />
+    <!--  头部结束  -->
+
+    <!--  内容开始  -->
+    <div class="main">
+
+        <p class="type">卖家已拒单<span>拒单时间：2022.11.12</span></p>
+        <div class="main_content_right_list first">
+          <div class="main_content_right_list_header">
+            <p class="on">商品信息</p>
+            <p>灌溉</p>
+            <p>服务</p>
+          </div>
+
+          <div class="main_content_right_list_center">
+            <img src="../../../../static/images/agriculturalTrusteeship/index/test.png">
+            <div class="main_content_right_list_content">
+              <p class="tt">如果只有一行就空着啊啊啊啊啊啊啊啊啊啊啊啊</p>
+              <div class="tab">
+                <p>￥<span>165,836,365</span>.00/亩</p>
+              </div>
+            </div>
+          </div>
+          <van-cell title="买方名称" :border="false" value="张三李四联合合作社" />
+          <van-cell title="联系人" :border="false" value="林晓春" />
+          <van-cell title="联系电话" :border="false" value="165 8874 0311" />
+        </div>
+
+        <div class="main_content_right_list">
+          <div class="main_content_right_list_header">
+            <p class="on">买家信息</p>
+          </div>
+
+          <van-cell title="联系人" :border="false" value="张三李四联合合作社" />
+          <van-cell title="联系电话" :border="false" value="林晓春" />
+          <van-cell title="服务地点" :border="false" value="165 8874 0311" />
+        </div>
+
+        <div class="main_content_right_list">
+          <div class="main_content_right_list_header">
+            <p class="on">订单信息</p>
+          </div>
+
+          <van-cell title="服务合同" :border="false" value="服务合同" />
+          <van-cell title="服务作物" :border="false" value="服务作物" />
+          <van-cell title="下单时间" :border="false" value="下单时间" />
+          <van-cell title="服务时间" :border="false" value="请输入产品规格" />
+          <van-cell title="服务数量" :border="false" value="请输入所属主体" />
+          <van-cell title="成交金额" :border="false" value="请输入单价" />
+          <van-cell title="备注" :border="false" value="请输入数量" />
+        </div>
+
+    </div>
+
+    <!--  内容结束  -->
+  </div>
+</template>
+<script>
+  import Cookies from "js-cookie";
+
+  export default {
+    name: "agriculturalTrusteeshipIndex",
+    data() {
+      return {
+        activeKey: 0,
+        active: 0,
+        loading: false,
+        finished: false,
+        show:true,
+        activeNames:[],
+      };
+    },
+    created() {
+
+    },
+    methods: {
+
+    },
+  }
+</script>
+<style scoped lang="scss">
+.home_wrapper{
+
+}
+  /*头部*/
+  .header{
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 2vh 4% 0vh;
+  }
+
+  .search{
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    border: 1px solid #6E93F3;
+    padding: 1PX 1PX 1PX 12PX ;
+    border-radius: 50PX;
+    margin-right: 30PX;
+    flex: 1;
+    input{
+      flex: 1;
+      background: transparent;
+      margin-left: 10PX;
+    }
+  }
+  /*导航栏目*/
+  .nav{
+    width: 94%;
+    margin: 0 auto;
+    margin-top: 2vh;
+    padding: 1.5vh 3%;
+    background: #ffffff;
+    border-radius: 10PX;
+    box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+    .date{
+      display: flex;
+      justify-content: space-around;
+      align-items: center;
+      p{
+        border-radius: 1rem;
+        padding: 5PX 0PX 5PX 5%;
+        width: 40%;
+        text-align: center;
+        color: #334281;
+        box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+        background:#D6D9E6 url("../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_date.png") 20% center no-repeat;
+      }
+    }
+    .billCount {
+      display: flex;
+      text-align: center;
+      margin-top: 3vh;
+      .billCount_left{
+        width: 50%;
+        color: #1B5DEA;
+        p{
+          &:nth-child(1){
+            font-size: .45rem;
+          }
+        }
+      }
+      .billCount_right{
+        width: 50%;
+        color: #FF5E00;
+        p{
+          &:nth-child(1){
+            font-size: .45rem;
+          }
+        }
+      }
+    }
+  }
+
+  /*内容*/
+  .main{
+    width: 94%;
+    margin: 0 auto;
+    padding-bottom: 2vh;
+    .main_content_right_list{
+      padding: 1.5vh 3%;
+      background: #ffffff;
+      border-radius: 10PX;
+      margin-bottom: 2vh;
+      /*box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);*/
+      &.first{
+        border-top-left-radius: initial;
+        border-top-right-radius: initial;
+      }
+      /deep/ .van-cell{
+        padding: 0;
+        margin-top: 10PX;
+      }
+      .main_content_right_list_header{
+        display: flex;
+        margin-bottom: 1vh;
+        align-items: center;
+        p{
+          padding: 3PX 10PX;
+          border-radius: 8PX;
+          &:nth-child(2){background: #2B7EEC;color: #ffffff;margin-left: auto;}
+          &:nth-child(3){background: #E2E9FD;color: #497CE8;margin-left: 10PX;}
+        }
+        .on{
+          color: #334281;
+          border-radius: initial;
+          padding:0 0 0 20PX;
+          font-size: 0.35rem;
+          background: url("../../../../static/images/agriculturalTrusteeship/socialization/bill_icon_01.png") no-repeat left center
+        }
+        .off{
+          color: #E60505;
+          border-radius: initial;
+          margin-left: auto;
+          padding:0 0 0 15PX;
+          background: url("../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_off.png") no-repeat left center
+        }
+      }
+      .main_content_right_list_center{
+        display: flex;
+        img{
+          border-radius: 15PX;
+          margin-right: 4%;
+        }
+        .main_content_right_list_content{
+          display: flex;
+          flex-direction:column;
+          justify-content: space-between;
+          .tt{
+            color: #333333;
+            font-size: .35rem;
+          }
+          .tab{
+            display: flex;
+            justify-content: space-between;
+            p{
+              &:nth-child(1){
+                flex: 1;
+                color: #FF5E00;
+                span{
+                  font-size: .4rem;
+                }
+              }
+              &:nth-child(2){
+                span{
+                  display: inline-block;
+                  text-align: center;
+                  padding: 2PX 5PX;
+                  &:nth-child(1){
+                    color: #497CE8;
+                    background: #E2E9FD;
+                    border-top-left-radius: 10PX;
+                  }
+                  &:nth-child(2){
+                    color: #ffffff;
+                    background-image: linear-gradient(to right , #5D87FA , #5FD5F5);
+                    border-bottom-right-radius: 10PX;
+                  }
+                }
+              }
+            }
+          }
+          .name{
+            color: #7A7A7A;
+            span{
+              &:nth-child(2){
+                margin-left: 5PX;
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+
+  /*弹出层*/
+.main_btn{
+  display: flex;
+  justify-content: space-around;
+  padding: 4vh 0;
+  p{
+    font-size: .4rem;
+    width: 35%;
+    text-align: center;
+    padding: 10PX 0;
+    border-radius: 5rem;
+    box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+    &:nth-child(1){
+      background: #334281;
+      color: #ffffff;
+    }
+    &:nth-child(2){
+      background: #D1D5E4;
+      color: #334281;
+    }
+  }
+}
+.footer{
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  background: #ffffff;
+  position: fixed;
+  bottom: 0;
+  padding: 1vh 4%;
+  width: 100%;
+  p{
+    color: #989898;
+    background: #F2F2F2;
+    padding: 5PX 10PX;
+    text-align: center;
+    border-radius: 8PX;
+  }
+}
+  .type{
+    background: #D83B22;
+    font-size: .4rem;
+    display: flex;
+    justify-content: space-between;
+    margin-top: 2vh;
+    color: #ffffff;
+    padding: 10PX 3%;
+    border-top-left-radius: 10PX;
+    border-top-right-radius: 10PX;
+    align-items: center;
+    span{
+      font-size: .35rem;
+    }
+  }
+</style>

src/views/agriculturalTrusteeship/buyer/evaluate.vue

@@ -0,0 +1,195 @@
+<template>
+  <div class="home_wrapper">
+    <!--  头部开始  -->
+    <van-nav-bar
+      title="服务评分 "
+      fixed
+      placeholder
+      left-arrow
+      @click-left="onClickLeft"
+    />
+    <!--  头部结束  -->
+
+    <!--  内容开始  -->
+    <div class="main">
+
+        <div class="main_content_right_list">
+          <div class="main_content_right_list_center">
+            <img src="../../../../static/images/agriculturalTrusteeship/index/test.png">
+            <div class="main_content_right_list_content">
+              <p class="tt">如果只有一行就空着啊啊啊啊啊啊啊啊啊啊啊啊</p>
+              <div class="tab">
+                <p>￥<span>165,836,365</span>.00/亩</p>
+              </div>
+            </div>
+          </div>
+        </div>
+
+
+        <div class="main_content_right_list">
+          <van-field label="实际服务数量" :border="false" input-align="right" placeholder="实际服务数量" />
+          <van-field label="实际服务费用" :border="false" input-align="right" placeholder="实际服务费用" />
+          <van-field label="服务评分" :border="false" input-align="right" placeholder="服务评分" />
+          <van-field label="服务评价" :border="false" input-align="right" placeholder="服务评价" />
+        </div>
+
+    </div>
+
+    <!--  内容结束  -->
+
+    <div class="main_btn">
+      <p>确定</p>
+      <p>取消</p>
+    </div>
+
+  </div>
+</template>
+<script>
+  import Cookies from "js-cookie";
+
+  export default {
+    name: "agriculturalTrusteeshipIndex",
+    data() {
+      return {
+        activeKey: 0,
+        active: 0,
+        loading: false,
+        finished: false,
+        show:true,
+        activeNames:[],
+      };
+    },
+    created() {
+
+    },
+    methods: {
+
+    },
+  }
+</script>
+<style scoped lang="scss">
+.home_wrapper{
+
+}
+  /*内容*/
+  .main{
+    width: 94%;
+    margin: 0 auto;
+    padding-bottom: 5vh;
+    .main_content_right_list{
+      margin-top: 2vh;
+      padding: 1.5vh 3%;
+      background: #ffffff;
+      border-radius: 10PX;
+      /*box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);*/
+      /deep/ .van-cell{
+        padding: 0;
+        margin-top: 10PX;
+        &:first-child{
+          margin-top: 0;
+        }
+      }
+      .main_content_right_list_header{
+        display: flex;
+        margin-bottom: 1vh;
+        align-items: center;
+        p{
+          padding: 3PX 10PX;
+          border-radius: 8PX;
+          &:nth-child(2){background: #2B7EEC;color: #ffffff;margin-left: auto;}
+          &:nth-child(3){background: #E2E9FD;color: #497CE8;margin-left: 10PX;}
+        }
+        .on{
+          color: #334281;
+          border-radius: initial;
+          padding:0 0 0 20PX;
+          font-size: 0.35rem;
+          background: url("../../../../static/images/agriculturalTrusteeship/socialization/bill_icon_01.png") no-repeat left center
+        }
+        .off{
+          color: #E60505;
+          border-radius: initial;
+          margin-left: auto;
+          padding:0 0 0 15PX;
+          background: url("../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_off.png") no-repeat left center
+        }
+      }
+      .main_content_right_list_center{
+        display: flex;
+        img{
+          border-radius: 15PX;
+          margin-right: 4%;
+        }
+        .main_content_right_list_content{
+          display: flex;
+          flex-direction:column;
+          justify-content: space-between;
+          .tt{
+            color: #333333;
+            font-size: .35rem;
+          }
+          .tab{
+            display: flex;
+            justify-content: space-between;
+            p{
+              &:nth-child(1){
+                flex: 1;
+                color: #FF5E00;
+                span{
+                  font-size: .4rem;
+                }
+              }
+              &:nth-child(2){
+                span{
+                  display: inline-block;
+                  text-align: center;
+                  padding: 2PX 5PX;
+                  &:nth-child(1){
+                    color: #497CE8;
+                    background: #E2E9FD;
+                    border-top-left-radius: 10PX;
+                  }
+                  &:nth-child(2){
+                    color: #ffffff;
+                    background-image: linear-gradient(to right , #5D87FA , #5FD5F5);
+                    border-bottom-right-radius: 10PX;
+                  }
+                }
+              }
+            }
+          }
+          .name{
+            color: #7A7A7A;
+            span{
+              &:nth-child(2){
+                margin-left: 5PX;
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+
+.main_btn{
+  display: flex;
+  justify-content: space-around;
+  padding: 4vh 0;
+  p{
+    font-size: .4rem;
+    width: 35%;
+    text-align: center;
+    padding: 10PX 0;
+    border-radius: 5rem;
+    box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+    &:nth-child(1){
+      background: #334281;
+      color: #ffffff;
+    }
+    &:nth-child(2){
+      background: #D1D5E4;
+      color: #334281;
+    }
+  }
+}
+</style>

src/views/agriculturalTrusteeship/buyer/index.vue

@@ -0,0 +1,381 @@
+<template>
+  <div class="home_wrapper">
+    <!--  头部开始  -->
+    <div class="header">
+      <img src="../../../../static/images/agriculturalTrusteeship/index/header.png">
+      <div class="header_box" @click="$router.push({name:'agriculturalTrusteeshipLogin'})">
+        <p>林万金<span>15835691254</span><img src="../../../../static/images/agriculturalTrusteeship/buyer/buyer_icon_01.png" alt=""></p>
+        <p>北京市海淀区丁春路165街玉龙苑9区2单元10...</p>
+
+      </div>
+    </div>
+    <!--  头部结束  -->
+
+    <!--  导航开始  -->
+    <div class="nav">
+      <van-grid :column-num="4" :border="false">
+        <van-grid-item :to="{name:'agriculturalTrusteeshipSocietyList'}">
+          <img src="../../../../static/images/agriculturalTrusteeship/index/nav_01.png"/>
+          <p>社会化</p>
+        </van-grid-item>
+        <van-grid-item :to="{name:'lawEnforcementCaseStatistics'}">
+          <img src="../../../../static/images/agriculturalTrusteeship/index/nav_02.png"/>
+          <p>农担</p>
+        </van-grid-item>
+        <van-grid-item :to="{name:'lawEnforcementCaseDistributionMap'}">
+          <img src="../../../../static/images/agriculturalTrusteeship/index/nav_03.png"/>
+          <p>贷款</p>
+        </van-grid-item>
+        <van-grid-item :to="{name:'agriculturalTrusteeshipInsuranceList'}">
+          <img src="../../../../static/images/agriculturalTrusteeship/index/nav_04.png"/>
+          <p>保险</p>
+        </van-grid-item>
+      </van-grid>
+
+      <div class="nav_notice_box">
+        <van-notice-bar left-icon="../../../../static/images/agriculturalTrusteeship/index/notice_icon.png" mode="link" :scrollable="false" background="#E2E9FD" color="#334281">
+          <van-swipe
+            vertical
+            class="notice-swipe"
+            :autoplay="3000"
+            :show-indicators="false"
+          >
+            <van-swipe-item>12.0版本上线啦！点击查看更改内容~</van-swipe-item>
+            <van-swipe-item>12.1版本上线啦！点击查看更改内容~</van-swipe-item>
+            <van-swipe-item>12.2版本上线啦！点击查看更改内容~</van-swipe-item>
+          </van-swipe>
+        </van-notice-bar>
+      </div>
+    </div>
+    <!--  导航结束  -->
+
+    <!--  内容开始  -->
+    <div class="main">
+      <div class="main_header">
+        <p>社会化服务产品</p>
+        <p>河东河西村</p>
+      </div>
+      <div class="search">
+        <img src="../../../../static/images/agriculturalTrusteeship/index/search_icon_01.png" />
+        <input type="text" placeholder="输入需求进行搜索" />
+        <img src="../../../../static/images/agriculturalTrusteeship/index/search_icon_02.png" />
+      </div>
+
+      <div class="main_content">
+        <div class="main_content_left">
+          <van-sidebar v-model="activeKey">
+            <van-sidebar-item title="全套服务" />
+            <van-sidebar-item title="开垦" />
+            <van-sidebar-item title="除草" />
+            <van-sidebar-item title="播种" />
+            <van-sidebar-item title="灌溉" />
+            <van-sidebar-item title="开垦" />
+            <van-sidebar-item title="除草" />
+            <van-sidebar-item title="播种" />
+            <van-sidebar-item title="灌溉" />
+            <van-sidebar-item title="开垦" />
+            <van-sidebar-item title="除草" />
+            <van-sidebar-item title="播种" />
+            <van-sidebar-item title="灌溉" />
+          </van-sidebar>
+        </div>
+        <div class="main_content_right">
+          <div class="main_content_right_header">
+            <p class="main_content_right_header_tit">灌溉</p>
+            <van-tabs v-model="active" animated>
+              <van-tab title="评分排序"></van-tab>
+              <van-tab title="销量排序"></van-tab>
+            </van-tabs>
+          </div>
+          <div class="main_content_right_nav">
+            <p>服务</p>
+            <p>服务</p>
+            <p>服务</p>
+            <p>服务</p>
+            <p>服务</p>
+          </div>
+
+          <van-list
+            v-model="loading"
+            :finished="finished"
+            finished-text="没有更多了"
+          >
+<!--            @load="onLoad"-->
+            <div class="main_content_right_list" v-for="item in 10" :key="item" @click="$router.push({name:'agriculturalTrusteeshipPlaceOrder'})">
+              <img src="../../../../static/images/agriculturalTrusteeship/index/test.png">
+              <div class="main_content_right_list_content">
+                <p class="tt">如果只有一行就空着啊啊啊啊啊啊啊啊啊啊啊啊</p>
+                <div class="tab">
+                  <p>￥<span>66</span>.00/亩</p>
+                  <p><span>销 600</span><span>分 4.7</span></p>
+                </div>
+                <p class="name">张三社会服务旗舰店</p>
+              </div>
+            </div>
+          </van-list>
+
+        </div>
+      </div>
+
+    </div>
+    <!--  内容结束  -->
+
+    <img src="../../../../static/images/agriculturalTrusteeship/index/index_btn_icon_01.png" class="pc"/>
+
+    <buyer></buyer>
+  </div>
+</template>
+<script>
+  import Cookies from "js-cookie";
+  import buyer from "@/components/common/buyer_footer";
+  export default {
+    name: "agriculturalTrusteeshipBuyIndex",
+    components: {
+      buyer,
+    },
+    data() {
+      return {
+        activeKey: 0,
+        active: 0,
+        loading: false,
+        finished: false,
+      };
+    },
+    created() {
+
+    },
+    methods: {
+
+    },
+  }
+</script>
+<style scoped lang="scss">
+.home_wrapper{
+
+}
+  /*头部*/
+  .header{
+    display: flex;
+    align-items: center;
+    background-image: linear-gradient(to right , #6E93F3 , #7E89E9 , #54C6E4);
+    padding: 4vh 4% 2vh;
+    .header_box{
+      margin-left: 4%;
+      flex: 1;
+      p{
+        &:nth-child(1){
+          color: #ffffff;
+          font-size: .45rem;
+          display: flex;
+          align-items: center;
+          span{
+            background: rgba(255,255,255,0.8) url("../../../../static/images/agriculturalTrusteeship/socialization/user_icon_07.png") 10PX center no-repeat;
+            background-size: 12PX;
+            color: #1E67FF;
+            font-size: 0.35rem;
+            padding: 0 8PX 0 25PX;
+            border-radius: 5PX;
+            margin-left: 10PX;
+          }
+          img{
+            margin-left: auto;
+          }
+        }
+        &:nth-child(2){
+          color: #E5E5E5;
+          margin-top: .5vh;
+        }
+      }
+    }
+  }
+
+  /*导航栏目*/
+  .nav{
+    background-image: linear-gradient(to right , #6E93F3 , #7E89E9 , #54C6E4);
+    .van-grid{
+      border-top-left-radius: 25PX;
+      border-top-right-radius: 25PX;
+      overflow: hidden;
+    }
+    .nav_notice_box{
+      background: #ffffff;
+      padding:.5vh 0 1vh;
+    }
+    /deep/ .van-notice-bar{
+      width: 94%;
+      margin: 0 auto;
+      border-radius: 5PX;
+      .notice-swipe {
+        height: 40px;
+        line-height: 42px;
+      }
+    }
+  }
+
+  /*内容*/
+  .main{
+    background: #ffffff;
+    .main_header{
+      display: flex;
+      padding: 0 4% 1vh;
+      justify-content: space-between;
+      align-items: center;
+      p{
+        color: #334281;
+        &:nth-child(1){
+          font-size: .4rem;
+        }
+        &:nth-child(2){
+          font-size: .35rem;
+          background: url("../../../../static/images/agriculturalTrusteeship/index/address_icon.png") no-repeat left center;
+          padding: 5PX 0 5PX 22PX;
+
+        }
+      }
+    }
+    .search{
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      width: 92%;
+      margin: 0PX auto;
+      border: 1px solid #6E93F3;
+      padding: 1PX 1PX 1PX 12PX ;
+      border-radius: 50PX;
+      input{
+        flex: 1;
+        background: transparent;
+        margin-left: 10PX;
+      }
+    }
+    /deep/ .van-tabs--line .van-tabs__wrap{
+      border-radius: 100rem;
+      height: 25PX;
+    }
+    /deep/ .van-tab{
+      z-index: 1;
+      color: #8F8F8F;
+      padding: 5PX 10PX;
+    }
+    /deep/ .van-tab--active{
+      color: #334281;
+    }
+    /deep/ .van-tabs__nav{
+      background: #ECECEC;
+    }
+    /deep/ .van-tabs__nav--line{
+      padding: 0;
+    }
+    /deep/ .van-tabs__line{
+      background: #D6D9E6;
+      border-radius: 100rem;
+      z-index: 0;
+      width: 50%;
+      height: 100%;
+      bottom: 0;
+    }
+    .main_content{
+      display: flex;
+      width: 96%;
+      margin-top: 2vh;
+      height: 56.8vh;
+      overflow: hidden;
+      .van-sidebar-item{
+        text-align: center;
+      }
+      /deep/ .van-sidebar-item--select::before{
+        display: none;
+      }
+      .main_content_left{
+        border-top-right-radius: 15PX;
+        height: 100%;
+        overflow-y: scroll;
+      }
+      .main_content_right{
+        flex: 1;
+        padding-left: 4%;
+        height: 100%;
+        overflow-y: scroll;
+        .main_content_right_header{
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+          .main_content_right_header_tit{
+            font-size: .4rem;
+            color: #1A1D4A;
+          }
+        }
+        .main_content_right_nav{
+          display: flex;
+          justify-content: space-between;
+          margin-top: 2vh;
+          p{
+            padding: 5PX 10PX;
+            background: #F5F5F5;
+            color: #8F8F8F;
+            border-radius: 4PX;
+          }
+        }
+        .main_content_right_list{
+          display: flex;
+          margin-top: 2vh;
+          img{
+            border-radius: 15PX;
+            margin-right: 4%;
+          }
+          .main_content_right_list_content{
+            display: flex;
+            flex-direction:column;
+            justify-content: space-between;
+            .tt{
+              color: #333333;
+              font-size: .35rem;
+            }
+            .tab{
+              display: flex;
+              justify-content: space-between;
+              p{
+                &:nth-child(1){
+                  flex: 1;
+                  color: #FF5E00;
+                  span{
+                    font-size: .4rem;
+                  }
+                }
+                &:nth-child(2){
+                  span{
+                    display: inline-block;
+                    text-align: center;
+                    padding: 2PX 5PX;
+                    &:nth-child(1){
+                      color: #497CE8;
+                      background: #E2E9FD;
+                      border-top-left-radius: 10PX;
+                    }
+                    &:nth-child(2){
+                      color: #ffffff;
+                      background-image: linear-gradient(to right , #5D87FA , #5FD5F5);
+                      border-bottom-right-radius: 10PX;
+                    }
+                  }
+                }
+              }
+            }
+            .name{
+              color: #8F8F8F;
+              background: url("../../../../static/images/agriculturalTrusteeship/index/name_icon.png") no-repeat left center;
+              padding-left: 14PX;
+            }
+          }
+        }
+      }
+    }
+  }
+
+  /*飘窗*/
+  .pc{
+    position: absolute;
+    bottom: 10vh;
+    right: 0;
+  }
+</style>

src/views/agriculturalTrusteeship/buyer/placeOrder.vue

@@ -0,0 +1,375 @@
+<template>
+  <div class="home_wrapper">
+    <!--  头部开始  -->
+    <van-nav-bar
+      title="确认订单"
+      fixed
+      placeholder
+      left-arrow
+      @click-left="onClickLeft"
+    />
+    <!--  头部结束  -->
+
+    <!--  内容开始  -->
+    <div class="main">
+
+        <div class="main_content_right_list">
+          <div class="main_content_right_list_header">
+            <p class="on">商品信息</p>
+            <p>灌溉</p>
+            <p>服务</p>
+          </div>
+
+          <div class="main_content_right_list_center">
+            <img src="../../../../static/images/agriculturalTrusteeship/index/test.png">
+            <div class="main_content_right_list_content">
+              <p class="tt">如果只有一行就空着啊啊啊啊啊啊啊啊啊啊啊啊</p>
+              <div class="tab">
+                <p>￥<span>165,836,365</span>.00/亩</p>
+              </div>
+            </div>
+          </div>
+          <van-cell title="买方名称" :border="false" value="张三李四联合合作社" />
+          <van-cell title="联系人" :border="false" value="林晓春" />
+          <van-cell title="联系电话" :border="false" value="165 8874 0311" />
+        </div>
+
+        <div class="main_content_right_list">
+          <div class="main_content_right_list_header">
+            <p class="on">买家信息</p>
+          </div>
+
+          <van-cell title="联系人" :border="false" value="张三李四联合合作社" />
+          <van-cell title="联系电话" :border="false" value="林晓春" />
+          <van-cell title="服务地点" :border="false" value="165 8874 0311" />
+        </div>
+
+        <div class="main_content_right_list">
+          <div class="main_content_right_list_header">
+            <p class="on">订单信息</p>
+          </div>
+
+          <van-field label="服务合同" :border="false" input-align="right" placeholder="请输入产品名称" />
+          <van-field label="服务作物" :border="false" input-align="right" placeholder="请输入产品类型" />
+          <van-field label="下单时间" :border="false" input-align="right" placeholder="请输入二级分类" />
+          <van-field label="服务时间" :border="false" input-align="right" placeholder="请输入产品规格" />
+          <van-field label="服务数量" :border="false" input-align="right" placeholder="请输入所属主体" />
+          <van-field label="成交金额" :border="false" input-align="right" placeholder="请输入单价" />
+          <van-field label="备注" :border="false" input-align="right" placeholder="请输入数量" />
+        </div>
+
+    </div>
+
+    <div class="main_btn">
+      <p>下单</p>
+      <p>取消</p>
+    </div>
+    <!--  内容结束  -->
+  </div>
+</template>
+<script>
+  import Cookies from "js-cookie";
+
+  export default {
+    name: "agriculturalTrusteeshipIndex",
+    data() {
+      return {
+        activeKey: 0,
+        active: 0,
+        loading: false,
+        finished: false,
+        show:true,
+        activeNames:[],
+      };
+    },
+    created() {
+
+    },
+    methods: {
+
+    },
+  }
+</script>
+<style scoped lang="scss">
+.home_wrapper{
+
+}
+  /*头部*/
+  .header{
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 2vh 4% 0vh;
+  }
+
+  .search{
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    border: 1px solid #6E93F3;
+    padding: 1PX 1PX 1PX 12PX ;
+    border-radius: 50PX;
+    margin-right: 30PX;
+    flex: 1;
+    input{
+      flex: 1;
+      background: transparent;
+      margin-left: 10PX;
+    }
+  }
+  /*导航栏目*/
+  .nav{
+    width: 94%;
+    margin: 0 auto;
+    margin-top: 2vh;
+    padding: 1.5vh 3%;
+    background: #ffffff;
+    border-radius: 10PX;
+    box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+    .date{
+      display: flex;
+      justify-content: space-around;
+      align-items: center;
+      p{
+        border-radius: 1rem;
+        padding: 5PX 0PX 5PX 5%;
+        width: 40%;
+        text-align: center;
+        color: #334281;
+        box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+        background:#D6D9E6 url("../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_date.png") 20% center no-repeat;
+      }
+    }
+    .billCount {
+      display: flex;
+      text-align: center;
+      margin-top: 3vh;
+      .billCount_left{
+        width: 50%;
+        color: #1B5DEA;
+        p{
+          &:nth-child(1){
+            font-size: .45rem;
+          }
+        }
+      }
+      .billCount_right{
+        width: 50%;
+        color: #FF5E00;
+        p{
+          &:nth-child(1){
+            font-size: .45rem;
+          }
+        }
+      }
+    }
+  }
+
+  /*内容*/
+  .main{
+    width: 94%;
+    margin: 0 auto;
+    .main_content_right_list{
+      margin-top: 2vh;
+      padding: 1.5vh 3%;
+      background: #ffffff;
+      border-radius: 10PX;
+      /*box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);*/
+      /deep/ .van-cell{
+        padding: 0;
+        margin-top: 10PX;
+      }
+      .main_content_right_list_header{
+        display: flex;
+        margin-bottom: 1vh;
+        align-items: center;
+        p{
+          padding: 3PX 10PX;
+          border-radius: 8PX;
+          &:nth-child(2){background: #2B7EEC;color: #ffffff;margin-left: auto;}
+          &:nth-child(3){background: #E2E9FD;color: #497CE8;margin-left: 10PX;}
+        }
+        .on{
+          color: #334281;
+          border-radius: initial;
+          padding:0 0 0 20PX;
+          font-size: 0.35rem;
+          background: url("../../../../static/images/agriculturalTrusteeship/socialization/bill_icon_01.png") no-repeat left center
+        }
+        .off{
+          color: #E60505;
+          border-radius: initial;
+          margin-left: auto;
+          padding:0 0 0 15PX;
+          background: url("../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_off.png") no-repeat left center
+        }
+      }
+      .main_content_right_list_center{
+        display: flex;
+        img{
+          border-radius: 15PX;
+          margin-right: 4%;
+        }
+        .main_content_right_list_content{
+          display: flex;
+          flex-direction:column;
+          justify-content: space-between;
+          .tt{
+            color: #333333;
+            font-size: .35rem;
+          }
+          .tab{
+            display: flex;
+            justify-content: space-between;
+            p{
+              &:nth-child(1){
+                flex: 1;
+                color: #FF5E00;
+                span{
+                  font-size: .4rem;
+                }
+              }
+              &:nth-child(2){
+                span{
+                  display: inline-block;
+                  text-align: center;
+                  padding: 2PX 5PX;
+                  &:nth-child(1){
+                    color: #497CE8;
+                    background: #E2E9FD;
+                    border-top-left-radius: 10PX;
+                  }
+                  &:nth-child(2){
+                    color: #ffffff;
+                    background-image: linear-gradient(to right , #5D87FA , #5FD5F5);
+                    border-bottom-right-radius: 10PX;
+                  }
+                }
+              }
+            }
+          }
+          .name{
+            color: #7A7A7A;
+            span{
+              &:nth-child(2){
+                margin-left: 5PX;
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+
+  /*弹出层*/
+  .popup_header{
+    display: flex;
+    align-items: center;
+    color: #334281;
+    font-size: .38rem;
+    margin-bottom: 15PX;
+    img{
+      margin-right: 10PX;
+      display: block;
+    }
+    p{
+      line-height: 1;
+    }
+  }
+  .popup_content{
+    .selected{
+      .on{
+        font-size: .35rem;
+        padding: 10PX 20PX;
+        color: #334281;
+        background: url("../../../../static/images/agriculturalTrusteeship/socialization/down.png")left center no-repeat;
+      }
+      .off{
+        font-size: .35rem;
+        padding: 10PX 20PX;
+        color: #334281;
+        background: url("../../../../static/images/agriculturalTrusteeship/socialization/right.png")left center no-repeat;
+      }
+      .options{
+        display: flex;
+        justify-content: space-between;
+        flex-wrap: wrap;
+        p{
+          background: #F5F5F5;
+          color: #8F8F8F;
+          width: 30%;
+          padding: 5PX 0;
+          border-radius: 5PX;
+          text-align: center;
+          &.active{
+            background: #E2E9FD;
+            color: #1B5DEA;
+          }
+        }
+      }
+    }
+  }
+  .popup_date{
+    display: flex;
+    justify-content: space-around;
+    align-items: center;
+    p{
+      border-radius: 1rem;
+      padding: 5PX 0PX 5PX 5%;
+      width: 45%;
+      text-align: center;
+      color: #1B5DEA;
+      background:#E2E9FD url("../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_date.png") 15% center no-repeat;
+    }
+  }
+  .popup_btn{
+    position: fixed;
+    bottom: 5vh;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    width: 94%;
+    left: 3%;
+    p{
+      width: 30%;
+      padding: 7PX 0;
+      border-radius: 5rem;
+      text-align: center;
+      font-size: .35rem;
+      box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+      &:nth-child(1){
+        background: #1B5DEA;
+        color: #ffffff;
+      }
+      &:nth-child(2){
+        border: 1PX solid #1B5DEA;
+        color: #1B5DEA;
+      }
+      &:nth-child(3){
+        background-image: linear-gradient(to right , #6E93F3 , #54C6E4);
+        color: #ffffff;
+      }
+    }
+  }
+.main_btn{
+  display: flex;
+  justify-content: space-around;
+  padding: 4vh 0;
+  p{
+    font-size: .4rem;
+    width: 35%;
+    text-align: center;
+    padding: 10PX 0;
+    border-radius: 5rem;
+    box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+    &:nth-child(1){
+      background: #334281;
+      color: #ffffff;
+    }
+    &:nth-child(2){
+      background: #D1D5E4;
+      color: #334281;
+    }
+  }
+}
+</style>

src/views/agriculturalTrusteeship/buyer/waitBill.vue

@@ -0,0 +1,207 @@
+<template>
+  <div class="home_wrapper">
+    <!--  头部开始  -->
+    <div class="header">
+      <p>待处理订单</p>
+      <p>共20个新订单</p>
+    </div>
+    <!--  头部结束  -->
+
+    <!--  内容开始  -->
+    <div class="main">
+
+      <van-list
+        v-model="loading"
+        :finished="finished"
+        finished-text="没有更多了"
+      >
+  <!--            @load="onLoad"-->
+        <div class="main_content_right_list" v-for="item in 10" :key="item" @click="$router.push({name:'agriculturalTrusteeshipBillDetail'})">
+          <div class="main_content_right_list_header">
+            <p>灌溉</p>
+            <p>服务</p>
+            <p>2022.03.15</p>
+          </div>
+
+          <div class="main_content_right_list_center">
+            <img src="../../../../static/images/agriculturalTrusteeship/index/test.png">
+            <div class="main_content_right_list_content">
+              <p class="tt">如果只有一行就空着啊啊啊啊啊啊啊啊啊啊啊啊</p>
+              <div class="tab">
+                <p>￥<span>165,836,365</span>.00</p>
+              </div>
+              <p class="name">
+                <span>数量：300</span>
+                <span>作物：玉米</span>
+              </p>
+            </div>
+          </div>
+          <van-cell title="买方名称" :border="false" value="张三李四联合合作社" />
+          <van-cell title="联系人" :border="false" value="林晓春" />
+          <van-cell title="联系电话" :border="false" value="165 8874 0311" />
+        </div>
+      </van-list>
+
+    </div>
+    <!--  内容结束  -->
+
+    <buyer></buyer>
+  </div>
+</template>
+<script>
+  import Cookies from "js-cookie";
+  import buyer from "@/components/common/buyer_footer";
+
+  export default {
+    name: "agriculturalTrusteeshipIndex",
+    components: {
+      buyer,
+    },
+    data() {
+      return {
+        activeKey: 0,
+        active: 0,
+        loading: false,
+        finished: false,
+        showDialog:false
+      };
+    },
+    created() {
+
+    },
+    methods: {
+      openDialog(val){
+        this.showDialog = val
+      },
+    },
+  }
+</script>
+<style scoped lang="scss">
+.home_wrapper{
+  background: #F9F9F9;
+}
+  /*头部*/
+  .header{
+    display: flex;
+    align-items: end;
+    justify-content: space-between;
+    padding: 2vh 4% 0vh;
+    p{
+      &:nth-child(1){
+        color: #334281;
+        font-size: .45rem;
+      }
+      &:nth-child(2){
+        color: #7A7A7A;
+        margin-top: .5vh;
+      }
+    }
+  }
+
+  /*导航栏目*/
+  .nav{
+    background-image: linear-gradient(to right , #6E93F3 , #7E89E9 , #54C6E4);
+    .van-grid{
+      border-top-left-radius: 25PX;
+      border-top-right-radius: 25PX;
+      overflow: hidden;
+    }
+    .nav_notice_box{
+      background: #ffffff;
+      padding:.5vh 0 1vh;
+    }
+    /deep/ .van-notice-bar{
+      width: 94%;
+      margin: 0 auto;
+      border-radius: 5PX;
+      .notice-swipe {
+        height: 40px;
+        line-height: 42px;
+      }
+    }
+  }
+
+  /*内容*/
+  .main{
+    width: 94%;
+    margin: 0 auto;
+    .main_content_right_list{
+      margin-top: 2vh;
+      padding: 1.5vh 3%;
+      background: #ffffff;
+      border-radius: 10PX;
+      box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+      /deep/ .van-cell{
+        padding: 0;
+        margin-top: 8PX;
+      }
+      .main_content_right_list_header{
+        display: flex;
+        margin-bottom: 1vh;
+        align-items: center;
+        p{
+          padding: 3PX 10PX;
+          border-radius: 8PX;
+          &:nth-child(1){background: #2B7EEC;color: #ffffff;}
+          &:nth-child(2){background: #E2E9FD;color: #497CE8;margin-left: 10PX;}
+          &:nth-child(3){color: #334281;margin-left: auto;padding:0 0 0 15PX;background: url("../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_clock.png") no-repeat left center}
+        }
+      }
+      .main_content_right_list_center{
+        display: flex;
+        img{
+          border-radius: 15PX;
+          margin-right: 4%;
+        }
+        .main_content_right_list_content{
+          display: flex;
+          flex-direction:column;
+          justify-content: space-between;
+          .tt{
+            color: #333333;
+            font-size: .35rem;
+          }
+          .tab{
+            display: flex;
+            justify-content: space-between;
+            p{
+              &:nth-child(1){
+                flex: 1;
+                color: #FF5E00;
+                span{
+                  font-size: .4rem;
+                }
+              }
+              &:nth-child(2){
+                span{
+                  display: inline-block;
+                  text-align: center;
+                  padding: 2PX 5PX;
+                  &:nth-child(1){
+                    color: #497CE8;
+                    background: #E2E9FD;
+                    border-top-left-radius: 10PX;
+                  }
+                  &:nth-child(2){
+                    color: #ffffff;
+                    background-image: linear-gradient(to right , #5D87FA , #5FD5F5);
+                    border-bottom-right-radius: 10PX;
+                  }
+                }
+              }
+            }
+          }
+          .name{
+            color: #7A7A7A;
+            span{
+              &:nth-child(2){
+                margin-left: 5PX;
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+
+</style>

src/views/agriculturalTrusteeship/login.vue

@@ -13,9 +13,9 @@
     <!--  头部结束  -->
 
     <!--  登陆选择开始  -->
-    <div class="main" style="display: none;">
+    <div class="main">
       <div class="nav">
-        <div class="nav_content">
+        <div class="nav_content" @click="$router.push({name:'agriculturalTrusteeshipBuyerIndex'})">
           <div>
             <p class="nav_name_01">买家登录</p>
             <p class="nav_text">登录后支持下单操作</p>
@@ -25,7 +25,7 @@
       </div>
 
       <div class="nav">
-        <div class="nav_content">
+        <div class="nav_content" @click="$router.push({name:'agriculturalTrusteeshipSocializationIndex'})" >
           <div>
             <p class="nav_name_02">社会化服务组织登录</p>
             <p class="nav_text">登录发布社会化服务及相关产品</p>
@@ -61,7 +61,7 @@
     <!--  登陆选择结束  -->
 
     <!--  登录开始  -->
-    <div class="login_main" :style="{'position': position,'top':top,'transform':transform,'left':left}">
+    <div class="login_main" style="display: none;" :style="{'position': position,'top':top,'transform':transform,'left':left}">
       <van-tabs v-model="active" animated color="#1E67FF" background="transparent" title-active-color="#1E67FF" @change="tabsChange">
         <van-tab name="login" title="登录">
           <van-field v-model="value1" center :border="false" placeholder="请输入用户名" >

src/views/agriculturalTrusteeship/shop/shopAdd.vue

@@ -0,0 +1,88 @@
+<template>
+  <div class="home_wrapper">
+    <!--  头部开始  -->
+    <van-nav-bar
+      title="发布商品"
+      fixed
+      placeholder
+      left-arrow
+      @click-left="onClickLeft"
+    />
+    <!--  头部结束  -->
+
+
+    <!--  内容开始  -->
+    <div class="main">
+      <van-field label="产品名称" input-align="right" placeholder="请输入产品名称" />
+      <van-field label="产品类型" input-align="right" placeholder="请输入产品类型" />
+      <van-field label="简介" input-align="right" placeholder="请输入简介" />
+      <van-field label="图片" :border="false" input-align="right" readonly />
+      <div style="padding: 0 4% 2vh;">
+        <van-uploader />
+      </div>
+    </div>
+
+    <div class="main_btn">
+      <p>发布</p>
+    </div>
+    <!--  内容结束  -->
+  </div>
+</template>
+<script>
+  import Cookies from "js-cookie";
+  export default {
+    name: "agriculturalTrusteeshipSocializationRelease",
+    data() {
+      return {
+        activeKey: 0,
+        active: 0,
+        loading: false,
+        finished: false,
+        center: { lng: 122.089726, lat: 37.540728 }, //经纬度
+        zoom: 15, //地图展示级别
+        showDialog:false
+      };
+    },
+    created() {
+
+    },
+    methods: {
+
+    },
+  }
+</script>
+<style scoped lang="scss">
+.home_wrapper{
+  background: #F6F6F6;
+  min-height: 100vh;
+}
+.main{
+  width: 92%;
+  margin: 0 auto;
+  margin-top: 2vh;
+  border-radius: 10PX;
+  overflow: hidden;
+  background-color: #FFF;
+}
+  .main_btn{
+    display: flex;
+    justify-content: space-around;
+    padding: 4vh 0;
+    p{
+      font-size: .4rem;
+      width: 35%;
+      text-align: center;
+      padding: 10PX 0;
+      border-radius: 5rem;
+      box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+      &:nth-child(1){
+        background: #334281;
+        color: #ffffff;
+      }
+      &:nth-child(2){
+        background: #D1D5E4;
+        color: #334281;
+      }
+    }
+  }
+</style>

src/views/agriculturalTrusteeship/shop/shopList.vue

@@ -56,7 +56,7 @@
       <van-tabs v-model="active" sticky animated>
         <van-tab title="售卖中">
 
-          <img src="../../../../static/images/agriculturalTrusteeship/insurance/shop_icon_add.png" style="margin: 0 auto;display: block;width: 94%;">
+          <img src="../../../../static/images/agriculturalTrusteeship/insurance/shop_icon_add.png" style="margin: 0 auto;display: block;width: 94%;" @click="$router.push({name:'agriculturalTrusteeshipShopAdd'})">
 
           <van-list
             v-model="loading"

src/views/agriculturalTrusteeship/socialization/bill.vue

@@ -0,0 +1,431 @@
+<template>
+  <div class="home_wrapper">
+    <!--  头部开始  -->
+    <div class="header">
+      <div class="search">
+        <img src="../../../../static/images/agriculturalTrusteeship/index/search_icon_01.png" />
+        <input type="text" placeholder="输入需求进行搜索" />
+        <img src="../../../../static/images/agriculturalTrusteeship/index/search_icon_02.png" />
+      </div>
+      <img src="../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_01.png" alt="" @click="show = true;">
+    </div>
+    <!--  头部结束  -->
+
+    <!--  导航开始  -->
+    <div class="nav">
+      <div class="date">
+        <p>2021年11月</p>
+        <span>-</span>
+        <p>2021年11月</p>
+      </div>
+      <div class="billCount">
+        <div class="billCount_left">
+          <p>654</p>
+          <p>成交订单</p>
+        </div>
+        <div class="billCount_right">
+          <p>361,654,523.00</p>
+          <p>收入金额</p>
+        </div>
+      </div>
+    </div>
+    <!--  导航结束  -->
+
+    <!--  内容开始  -->
+    <div class="main">
+
+      <van-list
+        v-model="loading"
+        :finished="finished"
+        finished-text="没有更多了"
+      >
+  <!--            @load="onLoad"-->
+        <div class="main_content_right_list" v-for="item in 10" :key="item">
+          <div class="main_content_right_list_header">
+            <p>灌溉</p>
+            <p>服务</p>
+            <p class="on">已结单</p>
+          </div>
+
+          <div class="main_content_right_list_center" @click="$router.push({name:'agriculturalTrusteeshipSocializationBillDetail'})">
+            <img src="../../../../static/images/agriculturalTrusteeship/index/test.png">
+            <div class="main_content_right_list_content">
+              <p class="tt">如果只有一行就空着啊啊啊啊啊啊啊啊啊啊啊啊</p>
+              <div class="tab">
+                <p>￥<span>165,836,365</span>.00</p>
+              </div>
+              <p class="name">
+                <span>数量：300</span>
+                <span>作物：玉米</span>
+              </p>
+            </div>
+          </div>
+          <van-cell title="买方名称" :border="false" value="张三李四联合合作社" />
+          <van-cell title="联系人" :border="false" value="林晓春" />
+          <van-cell title="联系电话" :border="false" value="165 8874 0311" />
+        </div>
+      </van-list>
+
+    </div>
+    <!--  内容结束  -->
+    <van-popup v-model="show" position="right" round style="height:100vh;width: 80%;padding: 4vh 3%;">
+      <div class="popup_header">
+        <img src="../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_01.png" width="15" alt="">
+        <p>筛选</p>
+      </div>
+      <div class="popup_content">
+        <div class="selected">
+          <p class="off">全套服务</p>
+        </div>
+        <div class="selected">
+          <p class="off">灌溉</p>
+        </div>
+        <div class="selected">
+          <p class="off">除草</p>
+        </div>
+        <div class="selected">
+          <p class="on">播种</p>
+          <div class="options">
+            <p class="active">全部</p>
+            <p>服务</p>
+            <p>种子</p>
+          </div>
+        </div>
+        <div class="selected">
+          <p class="on">施肥</p>
+          <div class="options">
+            <p>全部</p>
+            <p>服务</p>
+            <p>种子</p>
+          </div>
+        </div>
+      </div>
+      <div class="popup_header" style="margin-top: 4vh;">
+        <img src="../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_01.png" width="15" alt="">
+        <p>时间</p>
+      </div>
+      <div class="popup_date">
+        <p>2021年11月</p>
+        <span>-</span>
+        <p>2021年11月</p>
+      </div>
+      <div class="popup_header" style="margin-top: 4vh;">
+        <img src="../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_01.png" width="15" alt="">
+        <p>状态</p>
+      </div>
+      <div class="popup_content">
+        <div class="selected">
+          <div class="options">
+            <p class="active">全部</p>
+            <p>服务</p>
+            <p>种子</p>
+          </div>
+        </div>
+      </div>
+
+      <div class="popup_btn">
+        <p>确定</p>
+        <p>取消</p>
+        <p>重置</p>
+      </div>
+    </van-popup>
+    <agr></agr>
+    <transition name="van-fade">
+      <dialogClose v-show="showDialog"></dialogClose>
+    </transition>
+  </div>
+</template>
+<script>
+  import Cookies from "js-cookie";
+  import agr from "@/components/common/agr_footer";
+  import dialogClose from "@/components/agriculturalTrusteeship/dialog";
+
+  export default {
+    name: "agriculturalTrusteeshipIndex",
+    components: {
+      agr,
+      dialogClose
+    },
+    data() {
+      return {
+        activeKey: 0,
+        active: 0,
+        loading: false,
+        finished: false,
+        show:true,
+        activeNames:[],
+        showDialog:false
+      };
+    },
+    created() {
+
+    },
+    methods: {
+      openDialog(val){
+        this.showDialog = val
+      },
+    },
+  }
+</script>
+<style scoped lang="scss">
+.home_wrapper{
+
+}
+  /*头部*/
+  .header{
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 2vh 4% 0vh;
+  }
+
+  .search{
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    border: 1px solid #6E93F3;
+    padding: 1PX 1PX 1PX 12PX ;
+    border-radius: 50PX;
+    margin-right: 30PX;
+    flex: 1;
+    input{
+      flex: 1;
+      background: transparent;
+      margin-left: 10PX;
+    }
+  }
+  /*导航栏目*/
+  .nav{
+    width: 94%;
+    margin: 0 auto;
+    margin-top: 2vh;
+    padding: 1.5vh 3%;
+    background: #ffffff;
+    border-radius: 10PX;
+    box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+    .date{
+      display: flex;
+      justify-content: space-around;
+      align-items: center;
+      p{
+        border-radius: 1rem;
+        padding: 5PX 0PX 5PX 5%;
+        width: 40%;
+        text-align: center;
+        color: #334281;
+        box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+        background:#D6D9E6 url("../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_date.png") 20% center no-repeat;
+      }
+    }
+    .billCount {
+      display: flex;
+      text-align: center;
+      margin-top: 3vh;
+      .billCount_left{
+        width: 50%;
+        color: #1B5DEA;
+        p{
+          &:nth-child(1){
+            font-size: .45rem;
+          }
+        }
+      }
+      .billCount_right{
+        width: 50%;
+        color: #FF5E00;
+        p{
+          &:nth-child(1){
+            font-size: .45rem;
+          }
+        }
+      }
+    }
+  }
+
+  /*内容*/
+  .main{
+    width: 94%;
+    margin: 0 auto;
+    .main_content_right_list{
+      margin-top: 2vh;
+      padding: 1.5vh 3%;
+      background: #ffffff;
+      border-radius: 10PX;
+      box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+      /deep/ .van-cell{
+        padding: 0;
+        margin-top: 8PX;
+      }
+      .main_content_right_list_header{
+        display: flex;
+        margin-bottom: 1vh;
+        align-items: center;
+        p{
+          padding: 3PX 10PX;
+          border-radius: 8PX;
+          &:nth-child(1){background: #2B7EEC;color: #ffffff;}
+          &:nth-child(2){background: #E2E9FD;color: #497CE8;margin-left: 10PX;}
+        }
+        .on{
+          color: #39BD18;
+          border-radius: initial;
+          margin-left: auto;
+          padding:0 0 0 20PX;
+          background: url("../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_on.png") no-repeat left center
+        }
+        .off{
+          color: #E60505;
+          border-radius: initial;
+          margin-left: auto;
+          padding:0 0 0 15PX;
+          background: url("../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_off.png") no-repeat left center
+        }
+      }
+      .main_content_right_list_center{
+        display: flex;
+        img{
+          border-radius: 15PX;
+          margin-right: 4%;
+        }
+        .main_content_right_list_content{
+          display: flex;
+          flex-direction:column;
+          justify-content: space-between;
+          .tt{
+            color: #333333;
+            font-size: .35rem;
+          }
+          .tab{
+            display: flex;
+            justify-content: space-between;
+            p{
+              &:nth-child(1){
+                flex: 1;
+                color: #FF5E00;
+                span{
+                  font-size: .4rem;
+                }
+              }
+              &:nth-child(2){
+                span{
+                  display: inline-block;
+                  text-align: center;
+                  padding: 2PX 5PX;
+                  &:nth-child(1){
+                    color: #497CE8;
+                    background: #E2E9FD;
+                    border-top-left-radius: 10PX;
+                  }
+                  &:nth-child(2){
+                    color: #ffffff;
+                    background-image: linear-gradient(to right , #5D87FA , #5FD5F5);
+                    border-bottom-right-radius: 10PX;
+                  }
+                }
+              }
+            }
+          }
+          .name{
+            color: #7A7A7A;
+            span{
+              &:nth-child(2){
+                margin-left: 5PX;
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+
+  /*弹出层*/
+  .popup_header{
+    display: flex;
+    align-items: center;
+    color: #334281;
+    font-size: .38rem;
+    margin-bottom: 15PX;
+    img{
+      margin-right: 10PX;
+      display: block;
+    }
+    p{
+      line-height: 1;
+    }
+  }
+  .popup_content{
+    .selected{
+      .on{
+        font-size: .35rem;
+        padding: 10PX 20PX;
+        color: #334281;
+        background: url("../../../../static/images/agriculturalTrusteeship/socialization/down.png")left center no-repeat;
+      }
+      .off{
+        font-size: .35rem;
+        padding: 10PX 20PX;
+        color: #334281;
+        background: url("../../../../static/images/agriculturalTrusteeship/socialization/right.png")left center no-repeat;
+      }
+      .options{
+        display: flex;
+        justify-content: space-between;
+        flex-wrap: wrap;
+        p{
+          background: #F5F5F5;
+          color: #8F8F8F;
+          width: 30%;
+          padding: 5PX 0;
+          border-radius: 5PX;
+          text-align: center;
+          &.active{
+            background: #E2E9FD;
+            color: #1B5DEA;
+          }
+        }
+      }
+    }
+  }
+  .popup_date{
+    display: flex;
+    justify-content: space-around;
+    align-items: center;
+    p{
+      border-radius: 1rem;
+      padding: 5PX 0PX 5PX 5%;
+      width: 45%;
+      text-align: center;
+      color: #1B5DEA;
+      background:#E2E9FD url("../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_date.png") 15% center no-repeat;
+    }
+  }
+  .popup_btn{
+    position: fixed;
+    bottom: 5vh;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    width: 94%;
+    left: 3%;
+    p{
+      width: 30%;
+      padding: 7PX 0;
+      border-radius: 5rem;
+      text-align: center;
+      font-size: .35rem;
+      box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+      &:nth-child(1){
+        background: #1B5DEA;
+        color: #ffffff;
+      }
+      &:nth-child(2){
+        border: 1PX solid #1B5DEA;
+        color: #1B5DEA;
+      }
+      &:nth-child(3){
+        background-image: linear-gradient(to right , #6E93F3 , #54C6E4);
+        color: #ffffff;
+      }
+    }
+  }
+</style>

src/views/agriculturalTrusteeship/socialization/billDetail.vue

@@ -0,0 +1,375 @@
+<template>
+  <div class="home_wrapper">
+    <!--  头部开始  -->
+    <van-nav-bar
+      title="订单详情"
+      fixed
+      placeholder
+      left-arrow
+      @click-left="onClickLeft"
+    />
+    <!--  头部结束  -->
+
+    <!--  内容开始  -->
+    <div class="main">
+
+        <div class="main_content_right_list">
+          <div class="main_content_right_list_header">
+            <p class="on">商品信息</p>
+            <p>灌溉</p>
+            <p>服务</p>
+          </div>
+
+          <div class="main_content_right_list_center">
+            <img src="../../../../static/images/agriculturalTrusteeship/index/test.png">
+            <div class="main_content_right_list_content">
+              <p class="tt">如果只有一行就空着啊啊啊啊啊啊啊啊啊啊啊啊</p>
+              <div class="tab">
+                <p>￥<span>165,836,365</span>.00/亩</p>
+              </div>
+            </div>
+          </div>
+          <van-cell title="买方名称" :border="false" value="张三李四联合合作社" />
+          <van-cell title="联系人" :border="false" value="林晓春" />
+          <van-cell title="联系电话" :border="false" value="165 8874 0311" />
+        </div>
+
+        <div class="main_content_right_list">
+          <div class="main_content_right_list_header">
+            <p class="on">买家信息</p>
+          </div>
+
+          <van-cell title="联系人" :border="false" value="张三李四联合合作社" />
+          <van-cell title="联系电话" :border="false" value="林晓春" />
+          <van-cell title="服务地点" :border="false" value="165 8874 0311" />
+        </div>
+
+        <div class="main_content_right_list">
+          <div class="main_content_right_list_header">
+            <p class="on">订单信息</p>
+          </div>
+
+          <van-cell title="服务合同" :border="false" value="张三李四联合合作社" />
+          <van-cell title="服务作物" :border="false" value="林晓春" />
+          <van-cell title="下单时间" :border="false" value="165 8874 0311" />
+          <van-cell title="服务时间" :border="false" value="165 8874 0311" />
+          <van-cell title="服务数量" :border="false" value="165 8874 0311" />
+          <van-cell title="成交金额" :border="false" value="165 8874 0311" />
+          <van-cell title="备注" :border="false" value="165 8874 0311" />
+        </div>
+
+    </div>
+
+    <div class="main_btn">
+      <p>接单</p>
+      <p>拒单</p>
+    </div>
+    <!--  内容结束  -->
+  </div>
+</template>
+<script>
+  import Cookies from "js-cookie";
+
+  export default {
+    name: "agriculturalTrusteeshipIndex",
+    data() {
+      return {
+        activeKey: 0,
+        active: 0,
+        loading: false,
+        finished: false,
+        show:true,
+        activeNames:[],
+      };
+    },
+    created() {
+
+    },
+    methods: {
+
+    },
+  }
+</script>
+<style scoped lang="scss">
+.home_wrapper{
+
+}
+  /*头部*/
+  .header{
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 2vh 4% 0vh;
+  }
+
+  .search{
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    border: 1px solid #6E93F3;
+    padding: 1PX 1PX 1PX 12PX ;
+    border-radius: 50PX;
+    margin-right: 30PX;
+    flex: 1;
+    input{
+      flex: 1;
+      background: transparent;
+      margin-left: 10PX;
+    }
+  }
+  /*导航栏目*/
+  .nav{
+    width: 94%;
+    margin: 0 auto;
+    margin-top: 2vh;
+    padding: 1.5vh 3%;
+    background: #ffffff;
+    border-radius: 10PX;
+    box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+    .date{
+      display: flex;
+      justify-content: space-around;
+      align-items: center;
+      p{
+        border-radius: 1rem;
+        padding: 5PX 0PX 5PX 5%;
+        width: 40%;
+        text-align: center;
+        color: #334281;
+        box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+        background:#D6D9E6 url("../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_date.png") 20% center no-repeat;
+      }
+    }
+    .billCount {
+      display: flex;
+      text-align: center;
+      margin-top: 3vh;
+      .billCount_left{
+        width: 50%;
+        color: #1B5DEA;
+        p{
+          &:nth-child(1){
+            font-size: .45rem;
+          }
+        }
+      }
+      .billCount_right{
+        width: 50%;
+        color: #FF5E00;
+        p{
+          &:nth-child(1){
+            font-size: .45rem;
+          }
+        }
+      }
+    }
+  }
+
+  /*内容*/
+  .main{
+    width: 94%;
+    margin: 0 auto;
+    .main_content_right_list{
+      margin-top: 2vh;
+      padding: 1.5vh 3%;
+      background: #ffffff;
+      border-radius: 10PX;
+      /*box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);*/
+      /deep/ .van-cell{
+        padding: 0;
+        margin-top: 8PX;
+      }
+      .main_content_right_list_header{
+        display: flex;
+        margin-bottom: 1vh;
+        align-items: center;
+        p{
+          padding: 3PX 10PX;
+          border-radius: 8PX;
+          &:nth-child(2){background: #2B7EEC;color: #ffffff;margin-left: auto;}
+          &:nth-child(3){background: #E2E9FD;color: #497CE8;margin-left: 10PX;}
+        }
+        .on{
+          color: #334281;
+          border-radius: initial;
+          padding:0 0 0 20PX;
+          font-size: 0.35rem;
+          background: url("../../../../static/images/agriculturalTrusteeship/socialization/bill_icon_01.png") no-repeat left center
+        }
+        .off{
+          color: #E60505;
+          border-radius: initial;
+          margin-left: auto;
+          padding:0 0 0 15PX;
+          background: url("../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_off.png") no-repeat left center
+        }
+      }
+      .main_content_right_list_center{
+        display: flex;
+        img{
+          border-radius: 15PX;
+          margin-right: 4%;
+        }
+        .main_content_right_list_content{
+          display: flex;
+          flex-direction:column;
+          justify-content: space-between;
+          .tt{
+            color: #333333;
+            font-size: .35rem;
+          }
+          .tab{
+            display: flex;
+            justify-content: space-between;
+            p{
+              &:nth-child(1){
+                flex: 1;
+                color: #FF5E00;
+                span{
+                  font-size: .4rem;
+                }
+              }
+              &:nth-child(2){
+                span{
+                  display: inline-block;
+                  text-align: center;
+                  padding: 2PX 5PX;
+                  &:nth-child(1){
+                    color: #497CE8;
+                    background: #E2E9FD;
+                    border-top-left-radius: 10PX;
+                  }
+                  &:nth-child(2){
+                    color: #ffffff;
+                    background-image: linear-gradient(to right , #5D87FA , #5FD5F5);
+                    border-bottom-right-radius: 10PX;
+                  }
+                }
+              }
+            }
+          }
+          .name{
+            color: #7A7A7A;
+            span{
+              &:nth-child(2){
+                margin-left: 5PX;
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+
+  /*弹出层*/
+  .popup_header{
+    display: flex;
+    align-items: center;
+    color: #334281;
+    font-size: .38rem;
+    margin-bottom: 15PX;
+    img{
+      margin-right: 10PX;
+      display: block;
+    }
+    p{
+      line-height: 1;
+    }
+  }
+  .popup_content{
+    .selected{
+      .on{
+        font-size: .35rem;
+        padding: 10PX 20PX;
+        color: #334281;
+        background: url("../../../../static/images/agriculturalTrusteeship/socialization/down.png")left center no-repeat;
+      }
+      .off{
+        font-size: .35rem;
+        padding: 10PX 20PX;
+        color: #334281;
+        background: url("../../../../static/images/agriculturalTrusteeship/socialization/right.png")left center no-repeat;
+      }
+      .options{
+        display: flex;
+        justify-content: space-between;
+        flex-wrap: wrap;
+        p{
+          background: #F5F5F5;
+          color: #8F8F8F;
+          width: 30%;
+          padding: 5PX 0;
+          border-radius: 5PX;
+          text-align: center;
+          &.active{
+            background: #E2E9FD;
+            color: #1B5DEA;
+          }
+        }
+      }
+    }
+  }
+  .popup_date{
+    display: flex;
+    justify-content: space-around;
+    align-items: center;
+    p{
+      border-radius: 1rem;
+      padding: 5PX 0PX 5PX 5%;
+      width: 45%;
+      text-align: center;
+      color: #1B5DEA;
+      background:#E2E9FD url("../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_date.png") 15% center no-repeat;
+    }
+  }
+  .popup_btn{
+    position: fixed;
+    bottom: 5vh;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    width: 94%;
+    left: 3%;
+    p{
+      width: 30%;
+      padding: 7PX 0;
+      border-radius: 5rem;
+      text-align: center;
+      font-size: .35rem;
+      box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+      &:nth-child(1){
+        background: #1B5DEA;
+        color: #ffffff;
+      }
+      &:nth-child(2){
+        border: 1PX solid #1B5DEA;
+        color: #1B5DEA;
+      }
+      &:nth-child(3){
+        background-image: linear-gradient(to right , #6E93F3 , #54C6E4);
+        color: #ffffff;
+      }
+    }
+  }
+.main_btn{
+  display: flex;
+  justify-content: space-around;
+  padding: 4vh 0;
+  p{
+    font-size: .4rem;
+    width: 35%;
+    text-align: center;
+    padding: 10PX 0;
+    border-radius: 5rem;
+    box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+    &:nth-child(1){
+      background: #334281;
+      color: #ffffff;
+    }
+    &:nth-child(2){
+      background: #D1D5E4;
+      color: #334281;
+    }
+  }
+}
+</style>

src/views/agriculturalTrusteeship/socialization/draft.vue

@@ -0,0 +1,170 @@
+<template>
+  <div class="home_wrapper">
+    <!--  头部开始  -->
+    <van-nav-bar
+      title="草稿箱"
+      fixed
+      placeholder
+      left-arrow
+      @click-left="onClickLeft"
+    />
+    <!--  头部结束  -->
+
+    <!--  内容开始  -->
+    <div class="main">
+
+      <van-list
+        v-model="loading"
+        :finished="finished"
+        finished-text="没有更多了"
+      >
+  <!--            @load="onLoad"-->
+        <div class="main_content_right_list" v-for="item in 10" :key="item" @click="$router.push({name:'agriculturalTrusteeshipSocializationDraftEdit'})">
+          <div class="main_content_right_list_center">
+            <img src="../../../../static/images/agriculturalTrusteeship/index/test.png" width="80">
+            <div class="main_content_right_list_content">
+              <p class="tt">如果只有一行就空着啊啊啊啊啊啊啊啊啊啊啊啊</p>
+              <p class="name">2022.03.15</p>
+            </div>
+          </div>
+        </div>
+      </van-list>
+
+    </div>
+    <!--  内容结束  -->
+  </div>
+</template>
+<script>
+  import Cookies from "js-cookie";
+  import agr from "@/components/common/agr_footer";
+  import dialogClose from "@/components/agriculturalTrusteeship/dialog";
+
+  export default {
+    name: "agriculturalTrusteeshipIndex",
+    components: {
+      agr,
+      dialogClose
+    },
+    data() {
+      return {
+        activeKey: 0,
+        active: 0,
+        loading: false,
+        finished: false,
+        showDialog:false
+      };
+    },
+    created() {
+
+    },
+    methods: {
+      openDialog(val){
+        this.showDialog = val
+      },
+    },
+  }
+</script>
+<style scoped lang="scss">
+.home_wrapper{
+
+}
+  /*头部*/
+  .header{
+    display: flex;
+    align-items: end;
+    justify-content: space-between;
+    padding: 2vh 4% 0vh;
+    p{
+      &:nth-child(1){
+        color: #334281;
+        font-size: .45rem;
+      }
+      &:nth-child(2){
+        color: #7A7A7A;
+        margin-top: .5vh;
+      }
+    }
+  }
+
+  /*内容*/
+  .main{
+    width: 94%;
+    margin: 0 auto;
+    .main_content_right_list{
+      margin-top: 2vh;
+      padding: 1.5vh 3%;
+      background: #ffffff;
+      border-radius: 10PX;
+      /*box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);*/
+      /deep/ .van-cell{
+        padding: 0;
+        margin-top: 8PX;
+      }
+      .main_content_right_list_header{
+        display: flex;
+        margin-bottom: 1vh;
+        align-items: center;
+        p{
+          padding: 3PX 10PX;
+          border-radius: 8PX;
+          &:nth-child(1){background: #2B7EEC;color: #ffffff;}
+          &:nth-child(2){background: #E2E9FD;color: #497CE8;margin-left: 10PX;}
+          &:nth-child(3){color: #334281;margin-left: auto;padding:0 0 0 15PX;background: url("../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_clock.png") no-repeat left center}
+        }
+      }
+      .main_content_right_list_center{
+        display: flex;
+        img{
+          border-radius: 15PX;
+          margin-right: 4%;
+        }
+        .main_content_right_list_content{
+          display: flex;
+          flex-direction:column;
+          justify-content: space-between;
+          .tt{
+            color: #333333;
+            font-size: .35rem;
+          }
+          .tab{
+            display: flex;
+            justify-content: space-between;
+            p{
+              &:nth-child(1){
+                flex: 1;
+                color: #FF5E00;
+                span{
+                  font-size: .4rem;
+                }
+              }
+              &:nth-child(2){
+                span{
+                  display: inline-block;
+                  text-align: center;
+                  padding: 2PX 5PX;
+                  &:nth-child(1){
+                    color: #497CE8;
+                    background: #E2E9FD;
+                    border-top-left-radius: 10PX;
+                  }
+                  &:nth-child(2){
+                    color: #ffffff;
+                    background-image: linear-gradient(to right , #5D87FA , #5FD5F5);
+                    border-bottom-right-radius: 10PX;
+                  }
+                }
+              }
+            }
+          }
+          .name{
+            color: #334281;
+            margin-left: auto;
+            padding:0 0 0 15PX;
+            background: url("../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_clock.png") no-repeat left center
+          }
+        }
+      }
+    }
+  }
+
+</style>

src/views/agriculturalTrusteeship/socialization/draftEdit.vue

@@ -0,0 +1,106 @@
+<template>
+  <div class="home_wrapper">
+    <!--  头部开始  -->
+    <van-nav-bar
+      title="发布商品"
+      fixed
+      placeholder
+      left-arrow
+      @click-left="onClickLeft"
+    />
+    <!--  头部结束  -->
+
+
+    <!--  内容开始  -->
+    <div class="main">
+      <van-field label="产品名称" input-align="right" placeholder="请输入产品名称" />
+      <van-field label="产品类型" input-align="right" placeholder="请输入产品类型" />
+      <van-field label="二级分类" input-align="right" placeholder="请输入二级分类" />
+      <van-field label="产品规格" input-align="right" placeholder="请输入产品规格" />
+      <van-field label="所属主体" input-align="right" placeholder="请输入所属主体" />
+      <van-field label="单价" input-align="right" placeholder="请输入单价" />
+      <van-field label="数量" input-align="right" placeholder="请输入数量" />
+      <van-field label="联系电话" input-align="right" placeholder="请输入联系电话" />
+      <van-field label="联系人" input-align="right" placeholder="请输入联系人" />
+      <van-field label="服务区域" input-align="right" placeholder="请输入服务区域" />
+      <van-field label="地址" input-align="right" placeholder="请输入地址" />
+      <van-field label="简介" input-align="right" placeholder="请输入简介" />
+      <van-field label="详情" input-align="right" placeholder="请输入详情" />
+      <van-field label="图片" :border="false" input-align="right" placeholder="请输入图片" />
+      <div style="padding: 0 4% 2vh;">
+        <van-uploader />
+      </div>
+    </div>
+
+    <div class="main">
+      <baidu-map :center="center" panBy="[50,50]" :zoom="zoom" :scroll-wheel-zoom="true" :pinch-to-zoom="true" map-type="BMAP_NORMAL_MAP" style="height:25vh" >
+        <!-- 必须给容器指高度，不然地图将显示在一个高度为0的容器中，看不到 -->
+        <bm-marker :position="center" :dragging="true" animation="BMAP_ANIMATION_BOUNCE" :icon="{url: '../../../../static/images/lawEnforcement/new/address.gif', size: {width: 50, height: 50}}"></bm-marker>
+      </baidu-map>
+    </div>
+
+    <div class="main_btn">
+      <p>发布</p>
+      <p>存稿</p>
+    </div>
+    <!--  内容结束  -->
+  </div>
+</template>
+<script>
+  import Cookies from "js-cookie";
+  export default {
+    name: "agriculturalTrusteeshipSocializationRelease",
+    data() {
+      return {
+        activeKey: 0,
+        active: 0,
+        loading: false,
+        finished: false,
+        center: { lng: 122.089726, lat: 37.540728 }, //经纬度
+        zoom: 15, //地图展示级别
+        showDialog:false
+      };
+    },
+    created() {
+
+    },
+    methods: {
+
+    },
+  }
+</script>
+<style scoped lang="scss">
+.home_wrapper{
+  background: #F6F6F6;
+  min-height: 100vh;
+}
+.main{
+  width: 92%;
+  margin: 0 auto;
+  margin-top: 2vh;
+  border-radius: 10PX;
+  overflow: hidden;
+  background-color: #FFF;
+}
+  .main_btn{
+    display: flex;
+    justify-content: space-around;
+    padding: 4vh 0;
+    p{
+      font-size: .4rem;
+      width: 35%;
+      text-align: center;
+      padding: 10PX 0;
+      border-radius: 5rem;
+      box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+      &:nth-child(1){
+        background: #334281;
+        color: #ffffff;
+      }
+      &:nth-child(2){
+        background: #E60505;
+        color: #ffffff;
+      }
+    }
+  }
+</style>

src/views/agriculturalTrusteeship/socialization/index.vue

@@ -0,0 +1,212 @@
+<template>
+  <div class="home_wrapper">
+    <!--  头部开始  -->
+    <div class="header">
+      <p>待处理订单</p>
+      <p>共20个新订单</p>
+    </div>
+    <!--  头部结束  -->
+
+    <!--  内容开始  -->
+    <div class="main">
+
+      <van-list
+        v-model="loading"
+        :finished="finished"
+        finished-text="没有更多了"
+      >
+  <!--            @load="onLoad"-->
+        <div class="main_content_right_list" v-for="item in 10" :key="item">
+          <div class="main_content_right_list_header">
+            <p>灌溉</p>
+            <p>服务</p>
+            <p>2022.03.15</p>
+          </div>
+
+          <div class="main_content_right_list_center">
+            <img src="../../../../static/images/agriculturalTrusteeship/index/test.png">
+            <div class="main_content_right_list_content">
+              <p class="tt">如果只有一行就空着啊啊啊啊啊啊啊啊啊啊啊啊</p>
+              <div class="tab">
+                <p>￥<span>165,836,365</span>.00</p>
+              </div>
+              <p class="name">
+                <span>数量：300</span>
+                <span>作物：玉米</span>
+              </p>
+            </div>
+          </div>
+          <van-cell title="买方名称" :border="false" value="张三李四联合合作社" />
+          <van-cell title="联系人" :border="false" value="林晓春" />
+          <van-cell title="联系电话" :border="false" value="165 8874 0311" />
+        </div>
+      </van-list>
+
+    </div>
+    <!--  内容结束  -->
+
+    <agr></agr>
+    <transition name="van-fade">
+      <dialogClose v-show="showDialog"></dialogClose>
+    </transition>
+  </div>
+</template>
+<script>
+  import Cookies from "js-cookie";
+  import agr from "@/components/common/agr_footer";
+  import dialogClose from "@/components/agriculturalTrusteeship/dialog";
+
+  export default {
+    name: "agriculturalTrusteeshipIndex",
+    components: {
+      agr,
+      dialogClose
+    },
+    data() {
+      return {
+        activeKey: 0,
+        active: 0,
+        loading: false,
+        finished: false,
+        showDialog:false
+      };
+    },
+    created() {
+
+    },
+    methods: {
+      openDialog(val){
+        this.showDialog = val
+      },
+    },
+  }
+</script>
+<style scoped lang="scss">
+.home_wrapper{
+
+}
+  /*头部*/
+  .header{
+    display: flex;
+    align-items: end;
+    justify-content: space-between;
+    padding: 2vh 4% 0vh;
+    p{
+      &:nth-child(1){
+        color: #334281;
+        font-size: .45rem;
+      }
+      &:nth-child(2){
+        color: #7A7A7A;
+        margin-top: .5vh;
+      }
+    }
+  }
+
+  /*导航栏目*/
+  .nav{
+    background-image: linear-gradient(to right , #6E93F3 , #7E89E9 , #54C6E4);
+    .van-grid{
+      border-top-left-radius: 25PX;
+      border-top-right-radius: 25PX;
+      overflow: hidden;
+    }
+    .nav_notice_box{
+      background: #ffffff;
+      padding:.5vh 0 1vh;
+    }
+    /deep/ .van-notice-bar{
+      width: 94%;
+      margin: 0 auto;
+      border-radius: 5PX;
+      .notice-swipe {
+        height: 40px;
+        line-height: 42px;
+      }
+    }
+  }
+
+  /*内容*/
+  .main{
+    width: 94%;
+    margin: 0 auto;
+    .main_content_right_list{
+      margin-top: 2vh;
+      padding: 1.5vh 3%;
+      background: #ffffff;
+      border-radius: 10PX;
+      box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+      /deep/ .van-cell{
+        padding: 0;
+        margin-top: 8PX;
+      }
+      .main_content_right_list_header{
+        display: flex;
+        margin-bottom: 1vh;
+        align-items: center;
+        p{
+          padding: 3PX 10PX;
+          border-radius: 8PX;
+          &:nth-child(1){background: #2B7EEC;color: #ffffff;}
+          &:nth-child(2){background: #E2E9FD;color: #497CE8;margin-left: 10PX;}
+          &:nth-child(3){color: #334281;margin-left: auto;padding:0 0 0 15PX;background: url("../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_clock.png") no-repeat left center}
+        }
+      }
+      .main_content_right_list_center{
+        display: flex;
+        img{
+          border-radius: 15PX;
+          margin-right: 4%;
+        }
+        .main_content_right_list_content{
+          display: flex;
+          flex-direction:column;
+          justify-content: space-between;
+          .tt{
+            color: #333333;
+            font-size: .35rem;
+          }
+          .tab{
+            display: flex;
+            justify-content: space-between;
+            p{
+              &:nth-child(1){
+                flex: 1;
+                color: #FF5E00;
+                span{
+                  font-size: .4rem;
+                }
+              }
+              &:nth-child(2){
+                span{
+                  display: inline-block;
+                  text-align: center;
+                  padding: 2PX 5PX;
+                  &:nth-child(1){
+                    color: #497CE8;
+                    background: #E2E9FD;
+                    border-top-left-radius: 10PX;
+                  }
+                  &:nth-child(2){
+                    color: #ffffff;
+                    background-image: linear-gradient(to right , #5D87FA , #5FD5F5);
+                    border-bottom-right-radius: 10PX;
+                  }
+                }
+              }
+            }
+          }
+          .name{
+            color: #7A7A7A;
+            span{
+              &:nth-child(2){
+                margin-left: 5PX;
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+
+</style>

src/views/agriculturalTrusteeship/socialization/project.vue

@@ -0,0 +1,471 @@
+<template>
+  <div class="home_wrapper">
+    <!--  头部开始  -->
+    <div class="header">
+      <div class="header_left" @click="onClickLeft">
+        <p>张三服务合作社</p>
+      </div>
+      <p class="header_right">
+        <img src="../../../../static/images/agriculturalTrusteeship/socialization/socialization_icon_photo.png" />
+      </p>
+    </div>
+    <!--  头部结束  -->
+
+    <!--  内容开始  -->
+    <div class="main">
+      <van-tabs v-model="active" sticky animated>
+        <van-tab title="服务组织">
+            <div class="search">
+              <img src="../../../../static/images/agriculturalTrusteeship/index/search_icon_01.png" />
+              <input type="text" placeholder="输入需求进行搜索" />
+              <img src="../../../../static/images/agriculturalTrusteeship/index/search_icon_02.png" />
+            </div>
+
+            <div class="main_content">
+              <div class="main_content_left">
+                <van-sidebar v-model="activeKey">
+                  <van-sidebar-item title="全套服务" />
+                  <van-sidebar-item title="开垦" />
+                  <van-sidebar-item title="除草" />
+                  <van-sidebar-item title="播种" />
+                  <van-sidebar-item title="灌溉" />
+                  <van-sidebar-item title="开垦" />
+                  <van-sidebar-item title="除草" />
+                  <van-sidebar-item title="播种" />
+                  <van-sidebar-item title="灌溉" />
+                  <van-sidebar-item title="开垦" />
+                  <van-sidebar-item title="除草" />
+                  <van-sidebar-item title="播种" />
+                  <van-sidebar-item title="灌溉" />
+                </van-sidebar>
+              </div>
+              <div class="main_content_right">
+                <div class="main_content_right_header">
+                  <p class="main_content_right_header_tit">灌溉</p>
+                  <van-tabs v-model="active" animated>
+                    <van-tab title="评分排序"></van-tab>
+                    <van-tab title="销量排序"></van-tab>
+                  </van-tabs>
+                </div>
+                <div class="main_content_right_nav">
+                  <p>服务</p>
+                  <p>服务</p>
+                  <p>服务</p>
+                  <p>服务</p>
+                  <p>服务</p>
+                </div>
+
+                <van-list
+                  v-model="loading"
+                  :finished="finished"
+                  finished-text="没有更多了"
+                >
+                  <!--            @load="onLoad"-->
+                  <div class="main_content_right_list" v-for="item in 10" :key="item" @click="$router.push({name:'agriculturalTrusteeshipSocializationProjectDetail'})">
+                    <img src="../../../../static/images/agriculturalTrusteeship/index/test.png">
+                    <div class="main_content_right_list_content">
+                      <p class="tt">如果只有一行就空着啊啊啊啊啊啊啊啊啊啊啊啊</p>
+                      <div class="tab">
+                        <p>￥<span>66</span>.00/亩</p>
+                        <p><span>销 600</span><span>分 4.7</span></p>
+                      </div>
+                      <div class="btn">
+                        <img src="../../../../static/images/agriculturalTrusteeship/insurance/shop_icon_02.png" />
+                        <img src="../../../../static/images/agriculturalTrusteeship/insurance/shop_icon_01.png" />
+                      </div>
+                    </div>
+                  </div>
+                </van-list>
+
+              </div>
+            </div>
+        </van-tab>
+        <van-tab title="服务项目">
+          <div class="search">
+            <img src="../../../../static/images/agriculturalTrusteeship/index/search_icon_01.png" />
+            <input type="text" placeholder="输入需求进行搜索" />
+            <img src="../../../../static/images/agriculturalTrusteeship/index/search_icon_02.png" />
+          </div>
+
+          <div class="main_content">
+            <div class="main_content_left">
+              <van-sidebar v-model="activeKey">
+                <van-sidebar-item title="全套服务" />
+                <van-sidebar-item title="开垦" />
+                <van-sidebar-item title="除草" />
+                <van-sidebar-item title="播种" />
+                <van-sidebar-item title="灌溉" />
+                <van-sidebar-item title="开垦" />
+                <van-sidebar-item title="除草" />
+                <van-sidebar-item title="播种" />
+                <van-sidebar-item title="灌溉" />
+                <van-sidebar-item title="开垦" />
+                <van-sidebar-item title="除草" />
+                <van-sidebar-item title="播种" />
+                <van-sidebar-item title="灌溉" />
+              </van-sidebar>
+            </div>
+            <div class="main_content_right">
+              <div class="main_content_right_header">
+                <p class="main_content_right_header_tit">灌溉</p>
+                <van-tabs v-model="active" animated>
+                  <van-tab title="评分排序"></van-tab>
+                  <van-tab title="销量排序"></van-tab>
+                </van-tabs>
+              </div>
+              <div class="main_content_right_nav">
+                <p>服务</p>
+                <p>服务</p>
+                <p>服务</p>
+                <p>服务</p>
+                <p>服务</p>
+              </div>
+
+              <van-list
+                v-model="loading"
+                :finished="finished"
+                finished-text="没有更多了"
+              >
+                <!--            @load="onLoad"-->
+                <div class="main_content_right_list" v-for="item in 10" :key="item">
+                  <img src="../../../../static/images/agriculturalTrusteeship/index/test.png">
+                  <div class="main_content_right_list_content">
+                    <p class="tt">如果只有一行就空着啊啊啊啊啊啊啊啊啊啊啊啊</p>
+                    <div class="tab">
+                      <p>￥<span>66</span>.00/亩</p>
+                      <p><span>销 600</span><span>分 4.7</span></p>
+                    </div>
+                    <div class="btn">
+                      <img src="../../../../static/images/agriculturalTrusteeship/insurance/shop_icon_03.png" />
+                      <img src="../../../../static/images/agriculturalTrusteeship/insurance/shop_icon_01.png" />
+                    </div>
+                  </div>
+                </div>
+              </van-list>
+
+            </div>
+          </div>
+
+        </van-tab>
+      </van-tabs>
+    </div>
+    <!--  内容结束  -->
+
+    <agr></agr>
+    <transition name="van-fade">
+      <dialogClose v-show="showDialog"></dialogClose>
+    </transition>
+  </div>
+</template>
+<script>
+  import Cookies from "js-cookie";
+  import agr from "@/components/common/agr_footer";
+  import dialogClose from "@/components/agriculturalTrusteeship/dialog";
+  export default {
+    name: "agriculturalTrusteeshipInsuranceList",
+    components: {
+      agr,
+      dialogClose
+    },
+    data() {
+      return {
+        activeKey: 0,
+        active: 0,
+        loading: false,
+        finished: false,
+        showDialog:false
+      };
+    },
+    created() {
+
+    },
+    methods: {
+      openDialog(val){
+        this.showDialog = val
+      },
+    },
+  }
+</script>
+<style scoped lang="scss">
+  .home_wrapper{
+    background: url("../../../../static/images/agriculturalTrusteeship/insurance/society_list_head.png") no-repeat;
+  }
+  /*头部*/
+  .header{
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 2vh 4% 2vh;
+    .header_left{
+      display: flex;
+      align-items: center;
+      p{
+        font-size: .4rem;
+        color: #ffffff;
+        line-height: 1;
+        margin-left: 10PX;
+      }
+    }
+    .header_right{
+      font-size: .35rem;
+    }
+  }
+
+  /* 内容 */
+  .main{
+    /deep/ .van-tabs__nav{
+      border-top-left-radius: 25PX;
+      border-top-right-radius: 25PX;
+      overflow: hidden;
+    }
+    /deep/ .van-tabs__line{
+      background: #334281!important;
+    }
+    /deep/ .van-tab--active{
+      color: #334281;
+    }
+    /deep/ .van-tabs__content{
+      background: #ffffff;
+      padding-top: 2vh;
+    }
+    .search{
+       display: flex;
+       justify-content: space-between;
+       align-items: center;
+       width: 92%;
+       margin: 0PX auto;
+       border: 1px solid #6E93F3;
+       padding: 1PX 1PX 1PX 12PX ;
+       border-radius: 50PX;
+       input{
+         flex: 1;
+         background: transparent;
+         margin-left: 10PX;
+       }
+    }
+    .content{
+      width: 92%;
+      margin: 0 auto;
+      box-shadow: 0px 0px 10PX rgba(0,0,0,0.1);
+      border-radius: 10PX;
+      margin-top: 2vh;
+      padding: 1.5vh 4%;
+      .content_tt{
+        font-size: .35rem;
+        margin-bottom: 1vh;
+      }
+      .tt_box{
+        border-bottom: 1PX solid #D1D8EB;
+        padding-bottom: 1.5vh;
+        .tab_box{
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+          .tab_left{
+            display: flex;
+            p{
+              &:nth-child(1){
+                border-right: 1px solid;
+                padding-right: 8PX;
+                margin-right: 8PX;
+              }
+              span{
+                color: #2B7EEC;
+              }
+              line-height: 1;
+            }
+
+          }
+          .tab_right{
+            display: flex;
+            p{
+              background: #F3F6FE;
+              padding: 5PX 10PX;
+              color: #497CE8;
+              line-height: 1;
+              border-radius: 5PX;
+              margin-left: 10PX;
+            }
+          }
+        }
+      }
+      .content_con{
+        display: flex;
+        justify-content: space-between;
+        margin-top: 1.5vh;
+        .content_con_left{
+          display: flex;
+          flex-direction:column;
+          justify-content: space-between;
+          p{
+            font-size: .35rem;
+            padding-left: 18PX;
+            &:nth-child(1){
+              background: url("../../../../static/images/agriculturalTrusteeship/insurance/insurance_list_project.png") no-repeat left center;
+            }
+            &:nth-child(2){
+              background: url("../../../../static/images/agriculturalTrusteeship/insurance/insurance_list_name.png") no-repeat left center;
+            }
+            &:nth-child(3){
+              background: url("../../../../static/images/agriculturalTrusteeship/insurance/insurance_list_iphone.png") no-repeat left center;
+            }
+          }
+        }
+        .content_con_right{
+          display: flex;
+          justify-content: end;
+          align-items: center;
+          img{
+            border-radius: 10PX;
+            width: 40%;
+            margin-left: 5%;
+            box-shadow: 0px 5PX 10PX rgba(0,0,0,0.2);
+            &:last-child{
+              width: auto;
+              box-shadow: none;
+            }
+          }
+        }
+      }
+    }
+    .main_content{
+      display: flex;
+      width: 96%;
+      margin-top: 2vh;
+      height: 79.7vh;
+      overflow: hidden;
+      .van-sidebar-item{
+        text-align: center;
+      }
+      /deep/ .van-sidebar-item--select::before{
+        display: none;
+      }
+      .main_content_left{
+        border-top-right-radius: 15PX;
+        height: 100%;
+        overflow-y: scroll;
+      }
+      .main_content_right{
+        flex: 1;
+        padding-left: 4%;
+        height: 100%;
+        overflow-y: scroll;
+        .main_content_right_header{
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+          /deep/ .van-tabs--line .van-tabs__wrap{
+            border-radius: 100rem!important;
+            height: 25PX;
+          }
+          /deep/ .van-tab{
+            z-index: 1;
+            color: #8F8F8F;
+            padding: 5PX 10PX;
+          }
+          /deep/ .van-tab--active{
+            color: #334281!important;
+          }
+          /deep/ .van-tabs__nav{
+            background: #ECECEC!important;
+            border-radius: initial;
+          }
+          /deep/ .van-tabs__nav--line{
+            padding: 0;
+          }
+          /deep/ .van-tabs__content{
+            padding: 0;
+          }
+          /deep/ .van-tabs__line{
+            background: #D6D9E6!important;
+            border-radius: 100rem!important;
+            z-index: 0;
+            width: 50%;
+            height: 100%;
+            bottom: 0;
+          }
+          .main_content_right_header_tit{
+            font-size: .4rem;
+            color: #1A1D4A;
+          }
+        }
+        .main_content_right_nav{
+          display: flex;
+          justify-content: space-between;
+          margin-top: 2vh;
+          p{
+            padding: 5PX 10PX;
+            background: #F5F5F5;
+            color: #8F8F8F;
+            border-radius: 4PX;
+          }
+        }
+        .main_content_right_list{
+          display: flex;
+          margin-top: 2vh;
+          width: 100%;
+          img{
+            border-radius: 15PX;
+            margin-right: 4%;
+            width: auto;
+          }
+          .main_content_right_list_content{
+            display: flex;
+            flex-direction:column;
+            justify-content: space-between;
+            .tt{
+              color: #333333;
+              font-size: .35rem;
+            }
+            .tab{
+              display: flex;
+              justify-content: space-between;
+              p{
+                &:nth-child(1){
+                  flex: 1;
+                  color: #FF5E00;
+                  span{
+                    font-size: .4rem;
+                  }
+                }
+                &:nth-child(2){
+                  flex: 1;
+                  span{
+                    width: 50%;
+                    display: inline-block;
+                    text-align: center;
+                    padding: 2PX 2PX;
+                    &:nth-child(1){
+                      color: #497CE8;
+                      background: #E2E9FD;
+                      border-top-left-radius: 10PX;
+                    }
+                    &:nth-child(2){
+                      color: #ffffff;
+                      background-image: linear-gradient(to right , #5D87FA , #5FD5F5);
+                      border-bottom-right-radius: 10PX;
+                    }
+                  }
+                }
+              }
+            }
+            .btn{
+              display: flex;
+              align-items: center;
+              justify-content: space-between;
+              img{
+                width: 45%;
+                margin: 0;
+              }
+            }
+            .name{
+              color: #8F8F8F;
+              background: url("../../../../static/images/agriculturalTrusteeship/index/name_icon.png") no-repeat left center;
+              padding-left: 14PX;
+            }
+          }
+        }
+      }
+    }
+  }
+</style>

src/views/agriculturalTrusteeship/socialization/projectDetail.vue

@@ -0,0 +1,207 @@
+<template>
+  <div class="home_wrapper">
+    <!--  头部开始  -->
+    <div class="header">
+      <div class="header_left" @click="onClickLeft">
+        <img src="../../../../static/images/agriculturalTrusteeship/return.png">
+      </div>
+      <div class="header_right" @click="onClickLeft">
+        <img src="../../../../static/images/agriculturalTrusteeship/share.png">
+      </div>
+    </div>
+    <!--  头部结束  -->
+
+    <!--  内容开始  -->
+    <div class="main">
+      <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
+        <van-swipe-item><img src="../../../../static/images/agriculturalTrusteeship/test3.png"></van-swipe-item>
+        <van-swipe-item><img src="../../../../static/images/agriculturalTrusteeship/test3.png"></van-swipe-item>
+        <van-swipe-item><img src="../../../../static/images/agriculturalTrusteeship/test3.png"></van-swipe-item>
+        <van-swipe-item><img src="../../../../static/images/agriculturalTrusteeship/test3.png"></van-swipe-item>
+      </van-swipe>
+
+      <div class="main_content">
+        <div class="tab">
+          <p>￥<span>66</span>.00/亩</p>
+          <p><span>销 600</span><span>分 4.7</span></p>
+        </div>
+        <p class="tt">农业保险玉米保险30/亩小麦50/亩大豆60/亩</p>
+        <p class="name">张三社会服务旗舰店</p>
+      </div>
+
+      <div class="main_box">
+        <van-cell title="产品类型" :border="false" value="内容" />
+        <van-cell title="产品规格" :border="false" value="内容" />
+        <van-cell title="产品数量" :border="false" value="内容" />
+        <van-cell title="服务区域" :border="false" value="内容" />
+        <van-cell title="产品简介" :border="false" value="内容" />
+        <van-cell title="公司地址" :border="false" value="内容" />
+      </div>
+
+      <div class="main_box">
+        <van-cell title="联系人" :border="false" value="内容" />
+        <van-cell title="联系方式" :border="false" value="内容" />
+      </div>
+
+      <div class="main_box" style="padding: 0;">
+        <baidu-map :center="center" panBy="[50,50]" :zoom="zoom" :scroll-wheel-zoom="true" :pinch-to-zoom="true" map-type="BMAP_NORMAL_MAP" style="height:25vh" >
+          <!-- 必须给容器指高度，不然地图将显示在一个高度为0的容器中，看不到 -->
+          <bm-geolocation anchor="BMAP_ANCHOR_BOTTOM_RIGHT" :showAddressBar="true" :autoLocation="true"></bm-geolocation>
+          <bm-marker :position="center" :dragging="true" animation="BMAP_ANIMATION_BOUNCE" :icon="{url: '../../../../static/images/lawEnforcement/new/address.gif', size: {width: 50, height: 50}}"></bm-marker>
+        </baidu-map>
+      </div>
+    </div>
+    <!--  内容结束  -->
+
+    <!--  底部提交按钮  -->
+<!--    <div class="footer">-->
+<!--      <p>温馨提示：下单前请先与商家沟通联系</p>-->
+<!--      <img src="../../../../static/images/agriculturalTrusteeship/insurance/submit_shop_btn.png">-->
+<!--    </div>-->
+  </div>
+</template>
+<script>
+  import Cookies from "js-cookie";
+  export default {
+    name: "agriculturalTrusteeshipInsuranceDetail",
+    data() {
+      return {
+        activeKey: 0,
+        active: 0,
+        loading: false,
+        finished: false,
+        center: { lng: 122.089726, lat: 37.540728 }, //经纬度
+        zoom: 15, //地图展示级别
+      };
+    },
+    created() {
+
+    },
+    methods: {
+
+    },
+  }
+</script>
+<style scoped lang="scss">
+.home_wrapper{
+  padding-bottom: 15vh;
+}
+  /*头部*/
+  .header{
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 2vh 4% 2vh;
+    position: absolute;
+    top: 0;
+    z-index: 99999999;
+    width: 100%;
+    .header_left{
+      display: flex;
+      align-items: center;
+      p{
+        font-size: .4rem;
+        color: #ffffff;
+        line-height: 1;
+        margin-left: 10PX;
+      }
+    }
+    .header_right{
+
+    }
+  }
+
+  /* 内容 */
+  .main{
+    .my-swipe .van-swipe-item {
+      color: #fff;
+      font-size: 20px;
+      text-align: center;
+    }
+    .main_content{
+      background: #ffffff;
+      padding: 2vh 4%;
+      width: 92%;
+      margin: 0 auto;
+      border-radius: 10PX;
+      margin-top: 2vh;
+      box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
+      .tt{
+        font-size: .4rem;
+        margin-bottom: 10PX;
+      }
+      .name{
+        color: #4E7FFF;
+        background: url("../../../../static/images/agriculturalTrusteeship/index/name_icon.png") no-repeat left center;
+        padding-left: 18PX;
+      }
+      .tab{
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        margin-bottom: 10PX;
+        p{
+          &:nth-child(1){
+            flex: 1;
+            color: #FF5E00;
+            span{
+              font-size: .45rem;
+            }
+          }
+          &:nth-child(2){
+            span{
+              display: inline-block;
+              text-align: center;
+              padding: 2PX 10PX;
+              &:nth-child(1){
+                color: #497CE8;
+                background: #E2E9FD;
+                border-top-left-radius: 10PX;
+              }
+              &:nth-child(2){
+                color: #ffffff;
+                background-image: linear-gradient(to right , #5D87FA , #5FD5F5);
+                border-bottom-right-radius: 10PX;
+              }
+            }
+          }
+        }
+      }
+    }
+    .main_box{
+      width: 92%;
+      margin: 0 auto;
+      margin-top: 2vh;
+      border-radius: 10PX;
+      box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
+      overflow: hidden;
+      background-color: #FFF;
+      padding: 2vh 4%;
+      /deep/ .van-cell{
+        padding: 0;
+        margin-bottom: 10PX;
+        &:last-child{
+          margin-bottom: 0;
+        }
+      }
+    }
+  }
+
+  .footer{
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    background: #ffffff;
+    position: fixed;
+    bottom: 0;
+    padding: 1vh 4%;
+    width: 100%;
+    p{
+      color: #989898;
+      background: #F2F2F2;
+      padding: 5PX 10PX;
+      text-align: center;
+      border-radius: 8PX;
+    }
+  }
+</style>

src/views/agriculturalTrusteeship/socialization/release.vue

@@ -0,0 +1,106 @@
+<template>
+  <div class="home_wrapper">
+    <!--  头部开始  -->
+    <van-nav-bar
+      title="发布商品"
+      fixed
+      placeholder
+      left-arrow
+      @click-left="onClickLeft"
+    />
+    <!--  头部结束  -->
+
+
+    <!--  内容开始  -->
+    <div class="main">
+      <van-field label="产品名称" input-align="right" placeholder="请输入产品名称" />
+      <van-field label="产品类型" input-align="right" placeholder="请输入产品类型" />
+      <van-field label="二级分类" input-align="right" placeholder="请输入二级分类" />
+      <van-field label="产品规格" input-align="right" placeholder="请输入产品规格" />
+      <van-field label="所属主体" input-align="right" placeholder="请输入所属主体" />
+      <van-field label="单价" input-align="right" placeholder="请输入单价" />
+      <van-field label="数量" input-align="right" placeholder="请输入数量" />
+      <van-field label="联系电话" input-align="right" placeholder="请输入联系电话" />
+      <van-field label="联系人" input-align="right" placeholder="请输入联系人" />
+      <van-field label="服务区域" input-align="right" placeholder="请输入服务区域" />
+      <van-field label="地址" input-align="right" placeholder="请输入地址" />
+      <van-field label="简介" input-align="right" placeholder="请输入简介" />
+      <van-field label="详情" input-align="right" placeholder="请输入详情" />
+      <van-field label="图片" :border="false" input-align="right" placeholder="请输入图片" />
+      <div style="padding: 0 4% 2vh;">
+        <van-uploader />
+      </div>
+    </div>
+
+    <div class="main">
+      <baidu-map :center="center" panBy="[50,50]" :zoom="zoom" :scroll-wheel-zoom="true" :pinch-to-zoom="true" map-type="BMAP_NORMAL_MAP" style="height:25vh" >
+        <!-- 必须给容器指高度，不然地图将显示在一个高度为0的容器中，看不到 -->
+        <bm-marker :position="center" :dragging="true" animation="BMAP_ANIMATION_BOUNCE" :icon="{url: '../../../../static/images/lawEnforcement/new/address.gif', size: {width: 50, height: 50}}"></bm-marker>
+      </baidu-map>
+    </div>
+
+    <div class="main_btn">
+      <p>发布</p>
+      <p>存稿</p>
+    </div>
+    <!--  内容结束  -->
+  </div>
+</template>
+<script>
+  import Cookies from "js-cookie";
+  export default {
+    name: "agriculturalTrusteeshipSocializationRelease",
+    data() {
+      return {
+        activeKey: 0,
+        active: 0,
+        loading: false,
+        finished: false,
+        center: { lng: 122.089726, lat: 37.540728 }, //经纬度
+        zoom: 15, //地图展示级别
+        showDialog:false
+      };
+    },
+    created() {
+
+    },
+    methods: {
+
+    },
+  }
+</script>
+<style scoped lang="scss">
+.home_wrapper{
+  background: #F6F6F6;
+  min-height: 100vh;
+}
+.main{
+  width: 92%;
+  margin: 0 auto;
+  margin-top: 2vh;
+  border-radius: 10PX;
+  overflow: hidden;
+  background-color: #FFF;
+}
+  .main_btn{
+    display: flex;
+    justify-content: space-around;
+    padding: 4vh 0;
+    p{
+      font-size: .4rem;
+      width: 35%;
+      text-align: center;
+      padding: 10PX 0;
+      border-radius: 5rem;
+      box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+      &:nth-child(1){
+        background: #334281;
+        color: #ffffff;
+      }
+      &:nth-child(2){
+        background: #D1D5E4;
+        color: #334281;
+      }
+    }
+  }
+</style>

src/views/agriculturalTrusteeship/socialization/user.vue

@@ -0,0 +1,180 @@
+<template>
+  <div class="home_wrapper">
+    <!--  头部开始  -->
+    <div class="header">
+      <div class="header_left" @click="onClickLeft">
+        <img src="../../../../static/images/agriculturalTrusteeship/return.png">
+        <p>退出登录</p>
+      </div>
+    </div>
+    <!--  头部结束  -->
+
+    <div class="nav">
+      <div class="content">
+        <van-grid :column-num="4" :border="false">
+          <van-grid-item>
+            <img src="../../../../static/images/agriculturalTrusteeship/socialization/user_nav_01.png" alt="">
+            <p class="nav_num">3,501</p>
+            <p>已成交</p>
+          </van-grid-item>
+          <van-grid-item>
+            <img src="../../../../static/images/agriculturalTrusteeship/socialization/user_nav_02.png" alt="">
+            <p class="nav_num">3,501</p>
+            <p>待处理</p>
+          </van-grid-item>
+          <van-grid-item>
+            <img src="../../../../static/images/agriculturalTrusteeship/socialization/user_nav_04.png" alt="">
+            <p class="nav_num">3,501</p>
+            <p>已拒单</p>
+          </van-grid-item>
+          <van-grid-item>
+            <img src="../../../../static/images/agriculturalTrusteeship/socialization/user_nav_03.png" alt="">
+            <p class="nav_num" style="color: #FF5D00">3,501</p>
+            <p style="color: #FF5D00">总收入</p>
+          </van-grid-item>
+        </van-grid>
+      </div>
+    </div>
+
+    <!--  内容开始  -->
+    <div class="main">
+      <div class="main_content">
+        <van-cell :border="false" center>
+          <template #title>
+            <p class="tt">公司信息</p>
+          </template>
+          <template #right-icon>
+            <img src="../../../../static/images/agriculturalTrusteeship/insurance/shop_icon_edit.png" @click="$router.push({name:'agriculturalTrusteeshipSocializationUserEdit'})">
+          </template>
+        </van-cell>
+
+        <div class="main_box" style="margin-top: 0;">
+          <van-field label="主体名称" left-icon="../../../../static/images/agriculturalTrusteeship/socialization/user_icon_01.png" :border="false" input-align="right" value="内容" />
+          <van-field label="主体类别" left-icon="../../../../static/images/agriculturalTrusteeship/socialization/user_icon_02.png" :border="false" input-align="right" value="内容" />
+          <van-field label="生产种类" left-icon="../../../../static/images/agriculturalTrusteeship/socialization/user_icon_03.png" :border="false" input-align="right" value="内容" />
+          <van-field label="成立时间" left-icon="../../../../static/images/agriculturalTrusteeship/socialization/user_icon_04.png" :border="false" input-align="right" value="内容" />
+          <van-field label="示范类型" left-icon="../../../../static/images/agriculturalTrusteeship/socialization/user_icon_05.png" :border="false" input-align="right" value="内容" />
+          <van-field label="负责人" left-icon="../../../../static/images/agriculturalTrusteeship/socialization/user_icon_06.png" :border="false" input-align="right" value="内容" />
+          <van-field label="联系电话" left-icon="../../../../static/images/agriculturalTrusteeship/socialization/user_icon_07.png" :border="false" input-align="right" value="内容" />
+        </div>
+
+        <div class="main_box">
+          <baidu-map :center="center" panBy="[50,50]" :zoom="zoom" :scroll-wheel-zoom="true" :pinch-to-zoom="true" map-type="BMAP_NORMAL_MAP" style="height:25vh" >
+            <!-- 必须给容器指高度，不然地图将显示在一个高度为0的容器中，看不到 -->
+            <bm-marker :position="center" :dragging="true" animation="BMAP_ANIMATION_BOUNCE" :icon="{url: '../../../../static/images/lawEnforcement/new/address.gif', size: {width: 50, height: 50}}"></bm-marker>
+          </baidu-map>
+        </div>
+      </div>
+    </div>
+    <!--  内容结束  -->
+
+    <agr></agr>
+    <transition name="van-fade">
+      <dialogClose v-show="showDialog"></dialogClose>
+    </transition>
+  </div>
+</template>
+<script>
+  import Cookies from "js-cookie";
+  import agr from "@/components/common/agr_footer";
+  import dialogClose from "@/components/agriculturalTrusteeship/dialog";
+  export default {
+    name: "agriculturalTrusteeshipInsuranceList",
+    components: {
+      agr,
+      dialogClose
+    },
+    data() {
+      return {
+        activeKey: 0,
+        active: 0,
+        loading: false,
+        finished: false,
+        center: { lng: 122.089726, lat: 37.540728 }, //经纬度
+        zoom: 15, //地图展示级别
+        showDialog:false
+      };
+    },
+    created() {
+
+    },
+    methods: {
+      openDialog(val){
+        this.showDialog = val
+      },
+    },
+  }
+</script>
+<style scoped lang="scss">
+.home_wrapper{
+  background: #ffffff;
+  min-height: 100vh;
+}
+  /*头部*/
+  .header{
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    background-image: linear-gradient(to right , #6E93F3 , #7E89E9 , #54C6E4);
+    padding: 2vh 4% 2vh;
+    .header_left{
+      display: flex;
+      align-items: center;
+      p{
+        font-size: .4rem;
+        color: #ffffff;
+        line-height: 1;
+        margin-left: 10PX;
+      }
+    }
+    .header_right{
+      font-size: .35rem;
+      background: #ffffff url("../../../../static/images/agriculturalTrusteeship/address.png") no-repeat 10PX center;
+      padding: 2PX 15PX 2PX 25PX;
+      border-radius: 50PX;
+    }
+  }
+
+  .nav{
+    background-image: linear-gradient(to right , #6E93F3 , #7E89E9 , #54C6E4);
+    padding-bottom: 15PX;
+    .content{
+      background: #ffffff;
+      width: 92%;
+      margin: 0 auto;
+      box-shadow: 0px 0px 10PX rgba(0,0,0,0.1);
+      border-radius: 25PX;
+      overflow: hidden;
+      .nav_num{
+        font-size: .4rem;
+        margin: 10PX 0 5PX;
+      }
+    }
+  }
+
+  /* 内容 */
+  .main{
+    background-image: linear-gradient(to right , #6E93F3 , #7E89E9 , #54C6E4);
+    .main_content{
+      border-top-left-radius: 25PX;
+      border-top-right-radius: 25PX;
+      overflow: hidden;
+      background: #ffffff;
+      .main_box{
+        width: 92%;
+        margin: 0 auto;
+        margin-top: 2vh;
+        border-radius: 10PX;
+        overflow: hidden;
+        background-color: #FFF;
+        /deep/ .van-cell{
+          padding: 0;
+          margin-bottom: 10PX;
+          &:last-child{
+            margin-bottom: 0;
+          }
+        }
+      }
+    }
+  }
+</style>

src/views/agriculturalTrusteeship/socialization/userEdit.vue

@@ -0,0 +1,111 @@
+<template>
+  <div class="home_wrapper">
+    <!--  头部开始  -->
+    <van-nav-bar
+      title="编辑信息"
+      fixed
+      placeholder
+      left-arrow
+      @click-left="onClickLeft"
+    />
+    <!--  头部结束  -->
+
+    <!--  内容开始  -->
+    <div class="main">
+      <van-field label="主体名称" input-align="right" placeholder="请输入主体名称" />
+      <van-field label="主体类别" input-align="right" placeholder="请输入主体类别" />
+      <van-field label="生产种类" input-align="right" placeholder="请输入生产种类" />
+      <van-field label="示范类型" input-align="right" placeholder="请输入示范类型" />
+      <van-field label="主体住址" input-align="right" placeholder="请输入主体住址" />
+      <van-field label="数量" input-align="right" placeholder="请输入数量" />
+      <van-field label="成立时间" input-align="right" placeholder="请输入成立时间" />
+      <van-field label="负责人姓名" input-align="right" placeholder="请输入负责人姓名" />
+      <van-field label="联系电话" input-align="right" placeholder="请输入联系电话" />
+      <van-field label="开户银行" input-align="right" placeholder="请输入开户银行" />
+      <van-field label="银行账号" input-align="right" placeholder="请输入银行账号" />
+      <van-field label="经营土地面积(亩)" input-align="right" placeholder="请输入经营土地面积(亩)" />
+      <van-field label="成员出资总额" input-align="right" placeholder="请输入成员出资总额" />
+      <van-field label="成员个数" input-align="right" placeholder="请输入成员个数" />
+      <van-field label="非成员个数" input-align="right" placeholder="请输入非成员个数" />
+      <van-field label="带动农户数量（个）" input-align="right" placeholder="请输入带动农户数量（个）" />
+      <van-field label="网站网址" input-align="right" placeholder="请输入网站网址" />
+      <van-field label="关联账套" input-align="right" placeholder="请输入关联账套" />
+      <van-field label="服务区域" input-align="right" placeholder="请输入服务区域" />
+      <van-field label="图片" :border="false" input-align="right" placeholder="请输入图片" />
+      <div style="padding: 0 4% 2vh;">
+        <van-uploader />
+      </div>
+    </div>
+
+    <div class="main">
+      <baidu-map :center="center" panBy="[50,50]" :zoom="zoom" :scroll-wheel-zoom="true" :pinch-to-zoom="true" map-type="BMAP_NORMAL_MAP" style="height:25vh" >
+        <!-- 必须给容器指高度，不然地图将显示在一个高度为0的容器中，看不到 -->
+        <bm-marker :position="center" :dragging="true" animation="BMAP_ANIMATION_BOUNCE" :icon="{url: '../../../../static/images/lawEnforcement/new/address.gif', size: {width: 50, height: 50}}"></bm-marker>
+      </baidu-map>
+    </div>
+
+    <div class="main_btn">
+      <p>发布</p>
+      <p>存稿</p>
+    </div>
+    <!--  内容结束  -->
+  </div>
+</template>
+<script>
+  import Cookies from "js-cookie";
+  export default {
+    name: "agriculturalTrusteeshipSocializationRelease",
+    data() {
+      return {
+        activeKey: 0,
+        active: 0,
+        loading: false,
+        finished: false,
+        center: { lng: 122.089726, lat: 37.540728 }, //经纬度
+        zoom: 15, //地图展示级别
+        showDialog:false
+      };
+    },
+    created() {
+
+    },
+    methods: {
+
+    },
+  }
+</script>
+<style scoped lang="scss">
+.home_wrapper{
+  background: #F6F6F6;
+  min-height: 100vh;
+}
+.main{
+  width: 92%;
+  margin: 0 auto;
+  margin-top: 2vh;
+  border-radius: 10PX;
+  overflow: hidden;
+  background-color: #FFF;
+}
+  .main_btn{
+    display: flex;
+    justify-content: space-around;
+    padding: 4vh 0;
+    p{
+      font-size: .4rem;
+      width: 35%;
+      text-align: center;
+      padding: 10PX 0;
+      border-radius: 5rem;
+      box-shadow: 0px 3PX 6PX 0px rgba(0,0,0,0.16);
+      &:nth-child(1){
+        background: #334281;
+        color: #ffffff;
+      }
+      &:nth-child(2){
+        background: #D1D5E4;
+        color: #334281;
+      }
+    }
+  }
+</style>

src/views/lawEnforcement/caseStatistics/caseStatistics.vue

@@ -9,18 +9,19 @@
       <div class="top_main">
         <img src="../../../../static/images/lawEnforcement/icon/statistics_icon_01.png">
         <div class="main_text">
-          <p>156</p>
+          <p>{{countNum}}</p>
           <p>案件数量</p>
         </div>
         <van-popover
           v-model="showPopover"
           trigger="click"
           :actions="actions"
+          @select="changeTime"
           placement="bottom-end"
         >
           <template #reference>
             <div class="select_box">
-              <p>2022</p>
+              <p>{{query.year}}</p>
               <van-icon name="arrow-down" color="#ffffff" />
             </div>
           </template>
@@ -40,22 +41,22 @@
         <div id="main2" style="width: 100%;height: 200px;margin-top: 10px"></div>
 
         <div class="len_box">
-          <div class="len_box_01">
-            <p><i></i>计划执法</p>
-            <p>64</p>
-          </div>
-          <div class="len_box_02">
-            <p><i></i>计划执法</p>
-            <p>64</p>
-          </div>
-          <div class="len_box_03">
-            <p><i></i>计划执法</p>
-            <p>64</p>
-          </div>
-          <div class="len_box_04">
-            <p><i></i>计划执法</p>
-            <p>64</p>
+          <div class="len_box_01" v-for="( item,index ) in caseSourceArray">
+            <p><i></i>{{item.name}}</p>
+            <p>{{item.value}}</p>
           </div>
+<!--          <div class="len_box_02">-->
+<!--            <p><i></i>计划执法</p>-->
+<!--            <p>64</p>-->
+<!--          </div>-->
+<!--          <div class="len_box_03">-->
+<!--            <p><i></i>计划执法</p>-->
+<!--            <p>64</p>-->
+<!--          </div>-->
+<!--          <div class="len_box_04">-->
+<!--            <p><i></i>计划执法</p>-->
+<!--            <p>64</p>-->
+<!--          </div>-->
         </div>
 
       </div>
@@ -71,9 +72,7 @@
 </template>
 
 <script>
-  import { financePublicList,openRemove } from "@/api/sunVillage_info/fixedAssets";
-  import Cookies from "js-cookie";
-  import request from '@/utils/request'
+  import { caseNumberAll , caseTypeAccount , caseSourceTypeAccount , casePreMonthNum } from "@/api/lawEnforcement/index";
   import * as echarts from 'echarts';
   export default {
     name: "caseAllocation",
@@ -81,19 +80,48 @@
       return {
         showPopover: false,
         // 通过 actions 属性来定义菜单选项
-        actions: [{ text: '选项一' }, { text: '选项二' }, { text: '选项三' }],
+        actions: [
+          { text: '2022',value:'2022' },
+          { text: '2021',value:'2021' },
+          { text: '2020',value:'2020' },
+          { text: '2019',value:'2019' },
+          { text: '2018',value:'2018' },
+        ],
+        countNum:'',
+        query:{
+          year:'2022'
+        },
+        caseSourceArray:[]
       };
     },
     created() {
 
     },
     mounted(){
-      this.chart();
-      this.chart2();
-      this.chart3();
+      this.getNum();
     },
     methods: {
-      chart(){
+      changeTime(val){
+        console.log(val)
+        this.query.year = val.value;
+        this.getNum();
+      },
+      getNum(){
+        caseNumberAll(this.query).then(response => {
+          this.countNum = response.data;
+        })
+        caseTypeAccount(this.query).then(response => {
+          this.chart(response.data);
+        })
+        caseSourceTypeAccount(this.query).then(response => {
+          this.caseSourceArray =response.data.seriesData;
+          this.chart2(response.data);
+        })
+        casePreMonthNum(this.query).then(response => {
+          this.chart3(response.data);
+        })
+      },
+      chart(data){
         var chartDom = document.getElementById('main');
         var myChart = echarts.init(chartDom);
         var option;
@@ -106,24 +134,38 @@
             {
               type: 'pie',
               radius: ['40%', '70%'],
-              data: [
-                { value: 1048, name: '农药 1048' },
-                { value: 735, name: '种子 735' },
-                { value: 580, name: '肥料 580' },
-                { value: 484, name: '屠宰 484' },
-                { value: 300, name: '动检 300' },
-                { value: 300, name: '兽药 300' },
-                { value: 300, name: '植检 300' },
-                { value: 300, name: '饲料 300' },
-                { value: 300, name: '其他 300' },
-              ]
+              label: {
+                // alignTo: 'edge',
+                // edgeDistance: 10,
+                color: "#000",
+
+                normal: {
+                  alignTo: 'edge',
+                  edgeDistance: 10,
+                  color:'#000',
+                  formatter: "{c_set|{c}}\t{a_set|{b}}",
+                  rich: {
+                    a_set: {
+                      // color: "#ffffff",
+                      lineHeight: 20,
+                      align: "left",
+                      fontSize: 12,
+                    },
+                    c_set: {
+                      // color: "#ffffff",
+                      fontSize: 14,
+                    },
+                  },
+                },
+              },
+              data: data.seriesData
             }
           ]
         };
 
         option && myChart.setOption(option);
       },
-      chart2(){
+      chart2(data){
         var chartDom = document.getElementById('main2');
         var myChart = echarts.init(chartDom);
         var option;
@@ -136,19 +178,38 @@
             {
               type: 'pie',
               radius: ['40%', '70%'],
-              data: [
-                { value: 1048, name: '农药 1048' },
-                { value: 735, name: '种子 735' },
-                { value: 580, name: '肥料 580' },
-                { value: 484, name: '屠宰 484' },
-              ]
+              label: {
+                // alignTo: 'edge',
+                // edgeDistance: 10,
+                color: "#000",
+
+                normal: {
+                  alignTo: 'edge',
+                  edgeDistance: 10,
+                  color:'#000',
+                  formatter: "{c_set|{c}}\t{a_set|{b}}",
+                  rich: {
+                    a_set: {
+                      // color: "#ffffff",
+                      lineHeight: 20,
+                      align: "left",
+                      fontSize: 12,
+                    },
+                    c_set: {
+                      // color: "#ffffff",
+                      fontSize: 14,
+                    },
+                  },
+                },
+              },
+              data: data.seriesData
             }
           ]
         };
 
         option && myChart.setOption(option);
       },
-      chart3(){
+      chart3(data){
         var chartDom = document.getElementById('main3');
         var myChart = echarts.init(chartDom);
         var option;
@@ -163,14 +224,14 @@
           },
           xAxis: {
             type: 'category',
-            data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月']
+            data: data.xaxisData
           },
           yAxis: {
             type: 'value'
           },
           series: [
             {
-              data: [150, 230, 224, 218, 135, 147, 260, 224, 218, 135, 147, 260],
+              data: data.series,
               type: 'line'
             }
           ]
@@ -289,26 +350,46 @@
       margin-top: 8PX;
       font-size: .4rem;
     }
-  }
-  .len_box_01{
-    i{
-      background: #1CB8B1;
+    &:nth-child(1){
+      i{
+        background-color: rgb(84,112,198);
+      }
     }
-  }
-  .len_box_02{
-    i{
-      background: #508EEC;
+    &:nth-child(2){
+      i{
+        background-color: rgb(145,204,117);
+      }
     }
-  }
-  .len_box_03{
-    i{
-      background: #F68E68;
+    &:nth-child(3){
+      i{
+        background-color: rgb(250,200,88);
+      }
     }
-  }
-  .len_box_04{
-    i{
-      background: #6163B0;
+    &:nth-child(4){
+      i{
+        background-color: rgb(238,102,102);
+      }
     }
   }
+  /*.len_box_01{*/
+  /*  i{*/
+  /*    background: #1CB8B1;*/
+  /*  }*/
+  /*}*/
+  /*.len_box_02{*/
+  /*  i{*/
+  /*    background: #508EEC;*/
+  /*  }*/
+  /*}*/
+  /*.len_box_03{*/
+  /*  i{*/
+  /*    background: #F68E68;*/
+  /*  }*/
+  /*}*/
+  /*.len_box_04{*/
+  /*  i{*/
+  /*    background: #6163B0;*/
+  /*  }*/
+  /*}*/
 }
 </style>

src/views/lawEnforcement/index_new.vue

@@ -57,8 +57,8 @@
           <td rowspan="2"><img src="../../../static/images/lawEnforcement/new/index_icon_12.png" @click="$router.push({name:'lawEnforcementRecordDocument'})"></td>
         </tr>
         <tr>
-          <td><img src="../../../static/images/lawEnforcement/new/index_icon_10.png" @click="$router.push({name:'lawEnforcementRecord',query:{type:'3'}})"></td>
-          <td><img src="../../../static/images/lawEnforcement/new/index_icon_11.png" @click="$router.push({name:'lawEnforcementRecord',query:{type:'4'}})"></td>
+          <td colspan="2"><img src="../../../static/images/lawEnforcement/new/index_icon_10.png" @click="$router.push({name:'lawEnforcementRecord',query:{type:'3'}})"></td>
+<!--          <td><img src="../../../static/images/lawEnforcement/new/index_icon_11.png" @click="$router.push({name:'lawEnforcementRecord',query:{type:'4'}})"></td>-->
         </tr>
       </table>
 <!--      <van-row>-->

src/views/lawEnforcement/record/record.vue

@@ -6,107 +6,59 @@
     </div>
     <div style="height: 58px;"></div>
     <div class="main_box">
-      <van-field v-model="value" label="案件名称" placeholder="请选择案件名称" :border="false" readonly is-link @click="$router.push({name:'lawEnforcementCaseList'})" />
-      <van-field v-model="value" label="执法节点" placeholder="请选择执法节点" :border="false" readonly is-link arrow-direction="down" >
-        <template #input>
-          <van-popover
-            v-model="showPopover"
-            trigger="click"
-            :actions="actions"
-            placement="bottom-start"
-          >
-            <template #reference>
-              <p style="color: #cccccc">请选择执法节点</p>
-            </template>
-          </van-popover>
-        </template>
-      </van-field>
-      <van-field v-model="value" label="签字上传" :border="false" readonly >
-        <template #input>
-          <van-uploader v-model="fileList" multiple />
-        </template>
-      </van-field>
+      <van-field v-model="value" label="案件名称" placeholder="请选择案件名称" :border="false" readonly is-link @click="showPicker = true" />
     </div>
 
-    <div class="main_box" style="margin-top: 10px;">
-      <van-cell>
-        <template #title>
-          <van-icon name="../../../static/images/lawEnforcement/icon/record_icon_01.png" size="20"></van-icon>
-          <span class="custom-title">视频地址<i class="bgBlue"></i></span>
-        </template>
-      </van-cell>
-      <van-field type="textarea" autosize :border="false" placeholder="输入视频地址、执法文件名称等" />
-    </div>
-
-    <div class="main_box" style="margin-top: 10px;">
-      <van-cell>
-        <template #title>
-          <van-icon name="../../../static/images/lawEnforcement/icon/icon_ajwd.png" size="20"></van-icon>
-          <span class="custom-title">模板<i class="bgBlue"></i></span>
-        </template>
-      </van-cell>
-      <div class="cf">
-        <van-row>
-          <van-col :span="6">
-            <van-image src="../../../../static/images/lawEnforcement/icon/record_icon_02.png" width="50" />
+    <div class="main_box" style="margin-top: 15px">
+      <div class="peopleList">
+        <van-row v-for="(item,index) in caseDocumentList" :key="index" >
+          <van-col :span="17">
+            <img src="../../../../static/images/lawEnforcement/icon/record_icon_03.png"/>
+            <p>{{item.fileHalfName}}</p>
           </van-col>
-          <van-col :span="18">
-            <p>现场检查（勘验）笔录.docx</p>
+          <van-col :span="7">
+            <p @click="$router.push({name:'lawEnforcementRecordDetail',query:{id:item.id,fileType:item.fileType,fileHalfName:item.fileHalfName}})">预览</p>
+            <a href="">下载</a>
           </van-col>
         </van-row>
       </div>
     </div>
-
-    <div class="submit_box">
-      <p class="submitButton">保存</p>
-      <p class="submitButton">处理</p>
-    </div>
+    <van-popup v-model="showPicker" round position="bottom">
+      <van-picker
+        title="选择案件"
+        show-toolbar
+        value-key="caseName"
+        :columns="columns"
+        @cancel="showPicker = false"
+        @confirm="onConfirm"
+      />
+    </van-popup>
   </div>
 </template>
 
 <script>
-  import { getScheme } from "@/api/lawEnforcement/index";
+  import { getCaseList , getCaseDocumentList } from "@/api/lawEnforcement/index";
   export default {
     name: "programmeDetail",
     data() {
       return {
-        showPopover: false,
-        // 通过 actions 属性来定义菜单选项
-        actions: [{ text: '选项一' }, { text: '选项二' }, { text: '选项三' }],
-        showBankType:false,
-        showPayeeType:false,
-        showPicker:false,
-        form:{},
-
-        bankType:'',
-        payeeType:'',
         value:'',
-
-        bankTypeOptions:[],
-        payeeTypeOptions:[],
-        tEnforceSchemeHandlerList:[],
-        minDate: new Date(2020, 0, 1),
-        maxDate: new Date(2025, 10, 1),
-        currentDate: new Date(2021, 0, 17),
-
-        activeNames: ['1'],
-        activeNames1: ['1'],
-        activeNames2: ['1'],
-
-        fileList:[],
-        headTitle:''
+        headTitle:'',
+        showPicker:false,
+        columns:[],
+        caseDocumentList:[]
       };
     },
     created() {
-      // this.getDictionaries()
+      this.getDictionaries()
       if (this.$route.query.type == '1'){
-        this.headTitle = '现场检查（勘察）笔录';
+        this.headTitle = '勘察文书';
       }
       if (this.$route.query.type == '2'){
-        this.headTitle = '询问笔录';
+        this.headTitle = '立案文书';
       }
       if (this.$route.query.type == '3'){
-        this.headTitle = '当场行政处罚决定书';
+        this.headTitle = '取证文书';
       }
       if (this.$route.query.type == '4'){
         this.headTitle = '责令改正通知书';
@@ -114,8 +66,23 @@
     },
     methods: {
       getDictionaries(){
-        getScheme(this.$route.query.id).then((response) => {
-          this.form = response.data;
+        let query = {
+          caseProgress: parseInt(this.$route.query.type) + 1
+        }
+        getCaseList(query).then((response) => {
+          this.columns = response.data;
+        });
+      },
+      onConfirm(val){
+        console.log(val)
+        this.showPicker = false;
+        this.value = val.caseName;
+        let query = {
+          id:val.caseId,
+          caseProgress:parseInt(this.$route.query.type) + 1
+        }
+        getCaseDocumentList(query).then((response) => {
+          this.caseDocumentList = response.data;
         });
       },
       goBack(){
@@ -192,16 +159,41 @@
     margin-right: 0;
   }
   .peopleList{
-    padding-right: 3%;
+    padding: 0 3%;
+    text-align: left;
     .van-row{
-      margin-bottom: 10PX;
-      .van-col{
-        text-align: center;
-        font-size: 14PX;
+      border-bottom: 1px solid #dddddd;
+      display: flex;
+      align-items: center;
+      &:last-child{
+        border: none;
       }
-      &:first-child{
-        .van-col{
+      .van-col--17{
+        display: flex;
+        align-items: center;
+        p{
+          margin-left: 10PX;
+        }
+      }
+      .van-col--7{
+        display: flex;
+        justify-content: space-between;
+        p,a{
           color: #1D6FE9;
+          border: 1px solid #1D6FE9;
+          text-align: center;
+          border-radius: 15PX;
+          display: inline-block;
+          padding: 5px 15px;
+        }
+      }
+      .van-col{
+        text-align: left;
+        font-size: 14PX;
+        color: #333333;
+        padding: 15PX 0;
+        img{
+          display: block;
         }
       }
     }

src/views/lawEnforcement/record/recordDetail.vue

@@ -0,0 +1,424 @@
+<template>
+  <div class="app-container">
+    <div class="header_main">
+      文件预览
+      <div class="return_btn" @click="onClickLeft"></div>
+    </div>
+    <div style="height: 58px;"></div>
+    <pdf v-for="item in numPages" :key="item" :src="url" :page="item" ref="pdf"></pdf>
+  </div>
+</template>
+
+<script>
+  import { createAssistPDF,createSurveyPDF,createPutrecordPDF,createOnrecordPDF,createSamplingPDF,createTreatPDF,createDecisionPDF,createEvidencePDF,createExecutePDF,createEndingPDF,createBreakPDF,createResumePDF } from "@/api/lawEnforcement/index";
+  import pdf from 'vue-pdf'
+  export default {
+    components:{
+      pdf
+    },
+    name: "programmeDetail",
+    data() {
+      return {
+        url:'',
+        numPages: null, // pdf 总页数
+      };
+    },
+    created() {
+      const id = this.$route.query.id;
+      const fileType = this.$route.query.fileType;
+      const fileHalfName = this.$route.query.fileHalfName;
+      const baseURL = process.env.VUE_APP_BASE_API;
+      switch (fileType) {
+        case "assistFile":  // 协助调查函
+          var param = {
+            id: id,
+            fileType: fileType,
+            fileHalfName: fileHalfName,
+          };
+          createAssistPDF(param).then(response => {
+            this.url = baseURL + response.msg;
+            let loadingTask = pdf.createLoadingTask(this.url)
+            loadingTask.promise.then(pdf => {
+              this.numPages = pdf.numPages
+            })
+          });
+          break;
+        case "surveyRecordFile": // 现场检查(勘验)笔录
+        case "surveyAskRecordFile":  // 询问笔录
+          var param = {
+            id: id,
+            fileType: fileType,
+            fileHalfName: fileHalfName,
+          };
+          createSurveyPDF(param).then(response => {
+            this.url = baseURL + response.msg;
+            let loadingTask = pdf.createLoadingTask(this.url)
+            loadingTask.promise.then(pdf => {
+              this.numPages = pdf.numPages
+            })
+          });
+          break;
+        case "caseTransferLetter":  // 案件移送函
+        case "noticeOfDesignatedJurisdiction":  // 指定管辖通知书
+        case "notificationOfCaseSubmission":  // 案件交办通知书
+        case "caseTransferLetter1":  // 案件移送函
+        case "letterTransferSuspectedCriminalCase":  // 涉嫌犯罪案件移送书
+        case "noticeOfRectificationOrder": // 责令改正通知书
+        case "writtenDecisionOnAdministrativePenaltyOnTheSpot":  // 当场行政处罚决定书
+        case "noFilingExaminationAndApprovalForm":  // 不予立案审批表
+        case "revocationOfFilingApprovalForm":  // 撤销立案审批表
+        case "notPunishDecisionNotice": // 不予行政处罚决定书
+        case "caseHandlingOpinion":  // 案件处理意见书
+          var param = {
+            id: id,
+            fileType: fileType,
+            fileHalfName: fileHalfName,
+          };
+          createOnrecordPDF(param).then(response => {
+            this.url = baseURL + response.msg;
+            let loadingTask = pdf.createLoadingTask(this.url)
+            loadingTask.promise.then(pdf => {
+              this.numPages = pdf.numPages
+            })
+          });
+          break;
+        case "evidenceSaveFile": // 证据先行保存通知书
+        case "sealUpRecordFile":  // 查封(扣押)现场笔录
+        case "sealUpDecisionFile":  // 查封(扣押)决定书
+        case "sealUpDecisionGoodsList": // 查封(扣押)财物清单
+        case "removeSealupFile": // 解除查封(扣押)决定书
+        case "removeSealUpDecisionGoodsList": // 解除查封(扣押)财物清单
+        case "filingExaminationAndApprovalForm":  // 立案审批表
+          var param = {
+            id: id,
+            fileType: fileType,
+            fileHalfName: fileHalfName,
+          };
+          createPutrecordPDF(param).then(response => {
+            this.url = baseURL + response.msg;
+            let loadingTask = pdf.createLoadingTask(this.url)
+            loadingTask.promise.then(pdf => {
+              this.numPages = pdf.numPages
+            })
+          });
+          break;
+        case "productSureFile":  // 产品确认通知书
+        case "samplingRecordFile":  // 抽样取证凭证
+          var param = {
+            id: id,
+            fileType: fileType,
+            fileHalfName: fileHalfName,
+          };
+          createSamplingPDF(param).then(response => {
+            this.url = baseURL + response.msg;
+            let loadingTask = pdf.createLoadingTask(this.url)
+            loadingTask.promise.then(pdf => {
+              this.numPages = pdf.numPages
+            })
+          });
+          break;
+        case "noticeOfAdministrativePenaltyInAdvance":  // 行政处罚事先告知书(非听证)
+        case "noticeOfHearingAdministrativePenaltyInAdvance":  // 行政处罚事先告知书(听证)
+        case "noticeOfHearingOnAdministrativeTreatment":  // 行政处罚听证会通知书
+        case "administrativeDispositionHearingReport":  // 行政处罚听证会报告书
+        case "hearingRecord":  // 听证笔录
+          var param = {
+            id: id,
+            fileType: fileType,
+            fileHalfName: fileHalfName,
+          };
+          createTreatPDF(param).then(response => {
+            this.url = baseURL + response.msg;
+            let loadingTask = pdf.createLoadingTask(this.url)
+            loadingTask.promise.then(pdf => {
+              this.numPages = pdf.numPages
+            })
+          });
+          break;
+        case "caseHandlingOpinionFromTreat":  // 案件处理意见书(处理页面按钮点击)
+          var param = {
+            id: id,
+            fileType: "caseHandlingOpinion",
+            fileHalfName: fileHalfName,
+          };
+          createTreatPDF(param).then(response => {
+            this.url = baseURL + response.msg;
+            let loadingTask = pdf.createLoadingTask(this.url)
+            loadingTask.promise.then(pdf => {
+              this.numPages = pdf.numPages
+            })
+          });
+          break;
+        case "proofOfService":  // 送达回证
+        case "writtenDecisionOfAdministrativePenalty":  // 行政处罚决定书
+        case "administrativePenaltyDecisionExaminationAndApprovalForm":  // 行政处罚决定审批表
+          var param = {
+            id: id,
+            fileType: fileType,
+            fileHalfName: fileHalfName,
+          };
+          createDecisionPDF(param).then(response => {
+            this.url = baseURL + response.msg;
+            let loadingTask = pdf.createLoadingTask(this.url)
+            loadingTask.promise.then(pdf => {
+              this.numPages = pdf.numPages
+            })
+          });
+          break;
+        case "detectResultFile":  // 抽样检测结果告知书
+          var param = {
+            id: id,
+            fileType: fileType,
+            fileHalfName: fileHalfName,
+          };
+          createEvidencePDF(param).then(response => {
+            this.url = baseURL + response.msg;
+            let loadingTask = pdf.createLoadingTask(this.url)
+            loadingTask.promise.then(pdf => {
+              this.numPages = pdf.numPages
+            })
+          });
+          break;
+        case "noticeForExecutionOfAdministrativePenaltyDecision":  // 履行行政处罚决定催告书
+        case "applicationForEnforcement":  // 强制执行申请书
+        case "goodsHandleNotice":  // 登记保存物品处理通知书
+          var param = {
+            id: id,
+            fileType: fileType,
+            fileHalfName: fileHalfName,
+          };
+          createExecutePDF(param).then(response => {
+            this.url = baseURL + response.msg;
+            let loadingTask = pdf.createLoadingTask(this.url)
+            loadingTask.promise.then(pdf => {
+              this.numPages = pdf.numPages
+            })
+          });
+          break;
+        case "delayedOrStageNotice": // 延期（分期）缴纳罚款通知书
+        case "caseEndReport": // 行政处罚结案报告
+        case "punishGoodsHandleNotice": // 罚没物品处理记录
+          var param = {
+            id: id,
+            fileType: fileType,
+            fileHalfName: fileHalfName,
+          };
+          createEndingPDF(param).then(response => {
+            this.url = baseURL + response.msg;
+            let loadingTask = pdf.createLoadingTask(this.url)
+            loadingTask.promise.then(pdf => {
+              this.numPages = pdf.numPages
+            })
+          });
+          break;
+        case "breakCaseFile": // 案件中止调查决定书
+          var param = {
+            id: id,
+            fileType: fileType,
+            fileHalfName: fileHalfName,
+          };
+          createBreakPDF(param).then(response => {
+            this.url = baseURL + response.msg;
+            let loadingTask = pdf.createLoadingTask(this.url)
+            loadingTask.promise.then(pdf => {
+              this.numPages = pdf.numPages
+            })
+          });
+          break;
+        case "resumeCaseFile": // 案件恢复调查决定书
+          var param = {
+            id: id,
+            fileType: fileType,
+            fileHalfName: fileHalfName,
+          };
+          createResumePDF(param).then(response => {
+            this.url = baseURL + response.msg;
+            let loadingTask = pdf.createLoadingTask(this.url)
+            loadingTask.promise.then(pdf => {
+              this.numPages = pdf.numPages
+            })
+          });
+          break;
+      }
+
+    },
+    methods: {
+      goBack(){
+        window.history.go(-1)
+      }
+    },
+  }
+</script>
+
+<style scoped lang="scss">
+  .app-container {
+    padding: 2% 0;
+  }
+  /deep/ .van-collapse-item__content{
+    padding: 0;
+  }
+  .cf{
+    padding: 0 3%;
+    margin-top: 20PX;
+    margin-bottom: 20PX;
+    .van-row{
+      background: #F0F3F5;
+      display: flex;
+      align-items: center;
+      .van-col{
+        padding: 5PX 0;
+        font-size: 12PX!important;
+        text-align: center;
+        p{
+          color: #1D6FE9;
+          text-align: left;
+          font-size: .4rem;
+        }
+      }
+      &:first-child{
+        background: transparent;
+      }
+    }
+  }
+  .header_main{
+    height: 116px;
+    background: url('../../../../static/images/lawEnforcement/new/list_head.png') no-repeat;
+    background-size: 100% 100%;
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    font-size: 36px;
+    line-height: 116px;
+    text-align: center;
+    color: #fff;
+    z-index: 999;
+    .return_btn{
+      width: 24px;
+      height: 43.2px;
+      background: url('../../../assets/images/sunVillage_info/list_icon_5.png') center center no-repeat;
+      background-size: 20px 36px;
+      position: absolute;
+      left: 38px;
+      top: 36px;
+    }
+    .add_btn{
+      width: 56.4px;
+      height: 40.8px;
+      background: url('../../../assets/images/sunVillage_info/list_icon_9.png') center center no-repeat;
+      background-size: 47px 34px;
+      position: absolute;
+      right: 38px;
+      top: 36px;
+    }
+  }
+  /deep/ .van-radio--horizontal{
+    margin-left: 0.32rem;
+    margin-right: 0;
+  }
+  .peopleList{
+    padding: 0 3%;
+    text-align: left;
+    .van-row{
+      border-bottom: 1px solid #dddddd;
+      display: flex;
+      align-items: center;
+      &:last-child{
+        border: none;
+      }
+      .van-col--17{
+        display: flex;
+        align-items: center;
+        p{
+          margin-left: 10PX;
+        }
+      }
+      .van-col--7{
+        display: flex;
+        justify-content: space-between;
+        p{
+          color: #1D6FE9;
+          border: 1px solid #1D6FE9;
+          text-align: center;
+          border-radius: 15PX;
+          display: inline-block;
+          padding: 5px 15px;
+        }
+      }
+      .van-col{
+        text-align: left;
+        font-size: 14PX;
+        color: #333333;
+        padding: 15PX 0;
+        img{
+          display: block;
+        }
+      }
+    }
+  }
+  .main_title{
+    font-size: 0.4rem;
+    color: #1D6FE9;
+    margin: 0.2rem 6%;
+    margin-top: 0;
+    position: relative;
+  }
+  .main_box{
+    width: 96%;
+    margin: 0 auto;
+    border-radius: 10PX;
+    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
+    overflow: hidden;
+    background-color: #FFF;
+    .van-icon{
+      vertical-align: middle;
+    }
+    .custom-title{
+      font-size: 17PX;
+      color: #333333;
+      vertical-align: middle;
+      line-height: 1;
+      position: relative;
+    }
+    .tap{
+      color: #1D6FE9;
+    }
+    .bgBlue{
+      display: block;
+      position: absolute;
+      width: 17PX;
+      height: 17PX;
+      border-radius: 50%;
+      background-color: rgba(29,111,233,0.26);
+      top: -2PX;
+      right: -8PX;
+    }
+  }
+  .submitButton{
+    width: 40%;
+    margin: 0 auto;
+    background-image: linear-gradient(to right, #77A6EF , #2E79E9);
+    text-align: center;
+    color: #ffffff;
+    height: 70px;
+    line-height: 70px;
+    border-radius: 8PX;
+    margin-top: 25PX;
+    &:first-child{
+      background-image: linear-gradient(to right, #21CAC3 , #17A8A2);
+    }
+  }
+  .submit_box{
+    display: flex;
+    align-items: center;
+    justify-content: space-around;
+  }
+
+  .addFamily{
+    position: absolute;
+    top: -2px;
+    right: 0;
+    border-radius: 50%;
+  }
+
+</style>

src/views/lawEnforcement/record/recordDocument.vue

@@ -1,77 +1,76 @@
 <template>
   <div class="app-container">
     <div class="header_main">
-      文书打印
+      全部文书
       <div class="return_btn" @click="onClickLeft"></div>
     </div>
     <div style="height: 58px;"></div>
-
-    <div class="search_box">
-      <div class="search">
-        <input type="text" placeholder="请输入文书名" />
-        <img src="../../../../static/images/lawEnforcement/new/index_icon_04.png">
-      </div>
+    <div class="main_box">
+      <van-field v-model="value" label="案件名称" placeholder="请选择案件名称" :border="false" readonly is-link @click="showPicker = true" />
     </div>
 
-    <div class="main_box">
+    <div class="main_box" style="margin-top: 15px">
       <div class="peopleList">
-        <van-row v-for="(item,index) in 10" :key="index" >
-          <van-col :span="20">
+        <van-row v-for="(item,index) in caseDocumentList" :key="index" >
+          <van-col :span="17">
             <img src="../../../../static/images/lawEnforcement/icon/record_icon_03.png"/>
-            <p>指定管辖通知书</p>
+            <p>{{item.fileHalfName}}</p>
           </van-col>
-          <van-col :span="4">
-            <p>打印</p>
+          <van-col :span="7">
+            <p @click="$router.push({name:'lawEnforcementRecordDetail',query:{id:item.id,fileType:item.fileType,fileHalfName:item.fileHalfName}})">预览</p>
+            <a href="">下载</a>
           </van-col>
         </van-row>
       </div>
     </div>
-
-    <div class="submit_box">
-      <p class="submitButton">进入任务</p>
-    </div>
-
+    <van-popup v-model="showPicker" round position="bottom">
+      <van-picker
+        title="选择案件"
+        show-toolbar
+        value-key="caseName"
+        :columns="columns"
+        @cancel="showPicker = false"
+        @confirm="onConfirm"
+      />
+    </van-popup>
   </div>
 </template>
 
 <script>
-  import { getScheme } from "@/api/lawEnforcement/index";
+  import { getCaseList , getCaseDocumentList } from "@/api/lawEnforcement/index";
   export default {
     name: "programmeDetail",
     data() {
       return {
-        showPopover: false,
-        // 通过 actions 属性来定义菜单选项
-        actions: [{ text: '选项一' }, { text: '选项二' }, { text: '选项三' }],
-        checked:'',
-        showBankType:false,
-        showPayeeType:false,
-        showPicker:false,
-        form:{},
-
-        bankType:'',
-        payeeType:'',
         value:'',
-
-        bankTypeOptions:[],
-        payeeTypeOptions:[],
-        tEnforceSchemeHandlerList:[],
-        minDate: new Date(2020, 0, 1),
-        maxDate: new Date(2025, 10, 1),
-        currentDate: new Date(2021, 0, 17),
-
-        activeNames: ['1'],
-        activeNames1: ['1'],
-        activeNames2: ['1'],
+        headTitle:'',
+        showPicker:false,
+        columns:[],
+        caseDocumentList:[]
       };
     },
     created() {
-      // this.getDictionaries()
+      this.getDictionaries()
     },
     methods: {
       getDictionaries(){
-        getScheme(this.$route.query.id).then((response) => {
-          this.form = response.data;
+        let query = {
+          caseProgress: ''
+        }
+        getCaseList(query).then((response) => {
+          this.columns = response.data;
+        });
+      },
+      onConfirm(val){
+        console.log(val)
+        this.showPicker = false;
+        this.value = val.caseName;
+        let query = {
+          id:val.id,
+          caseProgress:''
+        }
+        getCaseDocumentList(query).then((response) => {
+          this.caseDocumentList = response.data;
         });
       },
       goBack(){
@@ -88,58 +87,22 @@
   /deep/ .van-collapse-item__content{
     padding: 0;
   }
-  /deep/ .van-checkbox{
-    justify-content: center;
-  }
-  .icon_box{
-    display: flex;
-    justify-content: space-around;
-  }
-  .search_box{
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    width: 92%;
-    margin: 0PX auto;
-    .select_box{
-      border: 1px solid #1D6FE9;
-      border-radius: 8PX;
-      padding: 0 12PX ;
-      background: #ffffff;
-      height: 30PX;
-      line-height: 30PX;
-      display: flex;
-      justify-content: space-around;
-      align-items: center;
-    }
-    .search{
-      background: #ffffff;
-      display: flex;
-      justify-content: space-between;
-      align-items: center;
-      width: 100%;
-      margin: 10PX auto;
-      border: 1px solid #1D6FE9;
-      padding: 1PX 1PX 1PX 12PX ;
-      border-radius: 50PX;
-      input{
-        flex: 1;
-        background: transparent;
-      }
-    }
-  }
   .cf{
     padding: 0 3%;
     margin-top: 20PX;
     margin-bottom: 20PX;
     .van-row{
       background: #F0F3F5;
+      display: flex;
+      align-items: center;
       .van-col{
         padding: 5PX 0;
         font-size: 12PX!important;
         text-align: center;
         p{
           color: #1D6FE9;
+          text-align: left;
+          font-size: .4rem;
         }
       }
       &:first-child{
@@ -193,17 +156,17 @@
       &:last-child{
         border: none;
       }
-      .van-col--20{
+      .van-col--17{
         display: flex;
         align-items: center;
         p{
           margin-left: 10PX;
         }
       }
-      .van-col--4{
+      .van-col--7{
         display: flex;
-        justify-content: right;
-        p{
+        justify-content: space-between;
+        p,a{
           color: #1D6FE9;
           border: 1px solid #1D6FE9;
           text-align: center;
@@ -262,26 +225,30 @@
     }
   }
   .submitButton{
-    width: 45%;
+    width: 40%;
     margin: 0 auto;
-    background-image: linear-gradient(to right, #2E79E9 , #77A6EF);
+    background-image: linear-gradient(to right, #77A6EF , #2E79E9);
     text-align: center;
     color: #ffffff;
     height: 70px;
     line-height: 70px;
     border-radius: 8PX;
+    margin-top: 25PX;
+    &:first-child{
+      background-image: linear-gradient(to right, #21CAC3 , #17A8A2);
+    }
   }
   .submit_box{
-    position: fixed;
-    bottom: 0;
-    width: 100%;
-    background: #ffffff;
-    padding: 25PX 0;
+    display: flex;
+    align-items: center;
+    justify-content: space-around;
   }
+
   .addFamily{
     position: absolute;
     top: -2px;
     right: 0;
     border-radius: 50%;
   }
+
 </style>

src/views/lawEnforcement/retrospect/retrospect.vue

@@ -14,10 +14,11 @@
         </van-cell>
         <van-grid :column-num="3" :border="false" square clickable>
           <van-grid-item icon="../../../static/images/lawEnforcement/new/retrospect_icon_01.png" text="农药扫码" :to="{name:'lawEnforcementRetrospectDetail'}" />
-          <van-grid-item icon="../../../static/images/lawEnforcement/new/retrospect_icon_01.png" text="种子扫码" />
-          <van-grid-item icon="../../../static/images/lawEnforcement/new/retrospect_icon_01.png" text="肥料扫码" />
-          <van-grid-item icon="../../../static/images/lawEnforcement/new/retrospect_icon_01.png" text="兽药扫码" />
-          <van-grid-item icon="../../../static/images/lawEnforcement/new/retrospect_icon_01.png" text="饲料扫码" />
+          <van-grid-item icon="../../../static/images/lawEnforcement/new/retrospect_icon_19.png" text="中国农药网" @click="linkGo('http://www.icama.org.cn/hysj/index.jhtml')" />
+          <van-grid-item icon="../../../static/images/lawEnforcement/new/retrospect_icon_20.png" text="中国种业网" @click="linkGo('http://202.127.42.145/bigdataNew/home/ManageOrg')" />
+          <van-grid-item icon="../../../static/images/lawEnforcement/new/retrospect_icon_21.png" text="中肥网" @click="linkGo('http://www.fert.cn/')" />
+          <van-grid-item icon="../../../static/images/lawEnforcement/new/retrospect_icon_22.png" text="中国兽药网" @click="linkGo('http://www.ivdc.org.cn/xxgk/syzwglpt/')" />
+          <van-grid-item icon="../../../static/images/lawEnforcement/new/retrospect_icon_23.png" text="中国饲料网" @click="linkGo('http://chinafeeddata.org.cn/admin/Login/slstk')" />
         </van-grid>
       </div>
 
@@ -76,7 +77,9 @@
 
     },
     methods: {
-
+      linkGo(url){
+        window.location.href = url;
+      }
     },
   }
 </script>

src/views/lawEnforcement/retrospect/scan.vue

@@ -18,7 +18,7 @@
 
 <script>
 
-import Scaner from '@/components/qrcode//Scaner';
+import Scaner from '@/components/qrcode/Scaner';
 import Cookies from "js-cookie";
 
 export default {

src/views/yinnong/bankAgriculture/paymentApproval/approvalApproval.vue

@@ -126,7 +126,7 @@
 </template>
 
 <script>
-  import { getTransfer , queryTransferDetail , listPayee , getProjectto , listProject , approval ,listTemplate } from "@/api/onlineHome/bankAgriculture/paymentApproval";
+  import { getTransfer , queryTransferDetail , listPayee , getProjectto , listProject ,getInfoto, approval ,listTemplate } from "@/api/onlineHome/bankAgriculture/paymentApproval";
   import {attachmentList, systemAttachment} from "../../../../api/onlineHome/bankAgriculture/paymentApproval";
   import request from '@/utils/request'
   export default {

src/views/yinnong/bankAgriculture/paymentApproval/approvalApproval11.vue

@@ -117,7 +117,7 @@
 </template>
 
 <script>
-  import { getTransfer , queryTransferDetail , listPayee , updateTransfer , getProjectto , listProject , addProjectto , customSubmit,listTemplate} from "@/api/onlineHome/bankAgriculture/paymentApproval";
+  import { getTransfer , queryTransferDetail , listPayee , updateTransfer , getProjectto , listProject , addProjectto ,getInfoto, customSubmit,listTemplate} from "@/api/onlineHome/bankAgriculture/paymentApproval";
   import request from '@/utils/request'
   import {
     approval,

src/views/yinnong/bankAgriculture/paymentApproval/approvalApproval12.vue

@@ -169,7 +169,7 @@
 </template>
 
 <script>
-  import { getTransfer , queryTransferDetail , listPayee , updateTransfer , getProjectto , listProject , addProjectto , customSubmit ,listTemplate} from "@/api/onlineHome/bankAgriculture/paymentApproval";
+  import { getTransfer , queryTransferDetail , listPayee , updateTransfer , getProjectto , listProject , addProjectto ,getInfoto, customSubmit ,listTemplate} from "@/api/onlineHome/bankAgriculture/paymentApproval";
   import request from '@/utils/request'
   import {
     approval,