新增明细账和统计填报

src/api/sunVillage_info/fixedAssets.js

@@ -437,3 +437,72 @@ export function publicPoll(id) {
     method: 'get'
   })
 }
+
+// 获取会计科目列表
+export const subjectData = (query) => {
+  return request({
+    url: '/finance/subject/listAll',
+    method: 'get',
+    params: query
+  })
+}
+
+//普通明细账接口
+export function listNormalDetails(query) {
+  return request({
+      url: '/finance/balance/listNormalDetails',
+      method: 'get',
+      params: query
+  })
+}
+//查询凭证信息明细
+export const voucherDetail = (data) => {
+  return request({
+    url: '/finance/voucher/detail',
+    method: 'get',
+    params: data
+  })
+}
+
+//统计填报列表数据
+export const statisticsList = (data) => {
+  return request({
+    url: '/entity/statistics/list',
+    method: 'get',
+    params: data
+  })
+}
+
+// 删除统计填报列表数据
+export function delStatisticsRemove(id) {
+  return request({
+    url: '/entity/statistics/remove/' + id,
+    method: 'get'
+  })
+} 
+
+//统计填报 - 模板
+export const entityStatisticsTemplate = (data) => {
+  return request({
+    url: '/entity/statistics/entityStatisticsTemplate',
+    method: 'get',
+    params: data
+  })
+}
+
+//统计填报 -保存模板
+export const entityStatisticsSave = (data) => {
+  return request({
+    url: '/entity/statistics/save',
+    method: 'post',
+    data: data
+  })
+}
+
+//统计填报 - 编辑
+export const entityStatisticsDetail = (id) => {
+  return request({
+    url: '/entity/statistics/detail/'+id,
+    method: 'get'
+  })
+}

src/router/index.js

@@ -3422,6 +3422,42 @@ export const constantRoutes = [
     },
     component: (resolve) => require(['@/views/sunVillage_info/list_register_detail'], resolve)
   },
+  { // 统计填报
+    path: '/sunVillage_info/statistical_report',
+    name: 'sunVillageInfoStatisticalReport',
+    meta: {
+      title: '统计填报',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/sunVillage_info/statistical_report'], resolve)
+  },
+  { // 统计填报--编辑
+    path: '/sunVillage_info/statistical_report_edit',
+    name: 'sunVillageInfoStatisticalReportEdit',
+    meta: {
+      title: '统计填报',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/sunVillage_info/statistical_report_edit'], resolve)
+  },
+  { //明细账
+    path: '/sunVillage_info/detailed_ledger',
+    name: 'sunVillageInfoDetailedLedger',
+    meta: {
+      title: '明细账',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/sunVillage_info/detailed_ledger'], resolve)
+  },
+  { //查看记账凭证
+    path: '/sunVillage_info/voucher',
+    name: 'sunVillageInfoVoucher',
+    meta: {
+      title: '记账凭证',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/sunVillage_info/voucher'], resolve)
+  },
   { ////阳光村务（新）-- 合同信息
     path: '/sunVillage_info/user',
     name: 'sunVillageInfoUser',

src/store/getters.js

@@ -6,7 +6,7 @@ const getters = {
   roles: state => state.user.roles,
   permissions: state => state.user.permissions,
   bookName: state => state.user.bookName,
-
+  deptName:  state => state.user.deptName,
   nickName: state => state.user.nickName,
   baseRoutingUrl: state => state.user.baseRoutingUrl,
   businessLevel: state => state.user.businessLevel,

src/store/modules/user.js

@@ -12,7 +12,7 @@ const user = {
     roles: [],
     permissions: [],
     bookName: '',
-
+    deptName:'',
     nickName: '',
     baseRoutingUrl: '',
     businessLevel: '',

src/views/sunVillage_info/detailed_ledger.vue

@@ -0,0 +1,607 @@
+<template>
+    <div class="home_wrapper">
+        <div class="header_main">
+            明细账
+            <div class="return_btn" @click="onClickLeft"></div>
+        </div>
+        <!---期间-->
+        <div class="period_main">
+            <div class="bt_title">
+                <div class="icon"></div>
+                <div class="title">期间</div>
+            </div>
+            <div class="calendar_block" @click="startDateClick">{{queryParams.startDate.replace('-','年')}}月</div>
+            <div class="to">至</div>
+            <div class="calendar_block" @click="endDateClick">{{queryParams.endDate.replace('-','年')}}月</div>
+        </div>
+        <!--科目-->
+        <div class="subject_main">
+            <div class="bt_title">
+                <div class="icon"></div>
+                <div class="title">科目</div>
+            </div>
+            <div class="subject_block" @click="subjectClick">
+                <div class="title">{{subjectText}}</div>
+                <div class="xs_icon"></div>
+            </div>
+        </div>
+        <!--内容-->
+        <div class="center_box">
+            <div class="vocher_name">
+                <van-row class="head_m">
+                    <van-col :span="14" class="year_m">
+                        <div class="year_text">2022</div>
+                        <div class="unit_m">
+                            <div class="ubs">月</div>
+                            <div class="ubs">日</div>
+                        </div>
+                    </van-col>
+                    <van-col :span="10" class="credential_m">凭证字</van-col>
+                </van-row>
+                <van-row class="vocher_mTitle" v-for="(item,index) in tableList" :key="index">
+                    <van-col :span="7">{{item.month}}</van-col>
+                    <van-col :span="7">{{item.day}}</van-col>
+                    <van-col :span="10">
+                        <div class="pz_tx" @click="subjectNameFun(item.voucherWordNum)">{{item.voucherWordNum}}</div>
+                    </van-col>
+                </van-row>
+                <!-- <van-row class="vocher_mTitle">
+                    <van-col :span="7">09</van-col>
+                    <van-col :span="7">09</van-col>
+                    <van-col :span="10">
+                        <div class="pz_tx">记-06</div>
+                    </van-col>
+                </van-row> -->
+           
+            </div>
+            <div class="vocher_content">
+                <div class="vocher_cmain">
+                    <van-row class="head_m">
+                        <van-col :span="9">摘要</van-col>
+                        <van-col :span="4">借方</van-col>
+                        <van-col :span="4">贷方</van-col>
+                        <van-col :span="3">方向</van-col>
+                        <van-col :span="4">余额</van-col>
+                    </van-row>
+                    
+                    <div class="content_m">
+                        <van-row  v-for="(item,index) in tableList" :key="index">
+                            <van-col :span="9" class="zy">{{item.voucherSummary}}</van-col>
+                            <van-col :span="4" class="je">{{item.jieAmount}}</van-col>
+                            <van-col :span="4" class="je">{{item.daiAmount}}</van-col>
+                            <van-col :span="3" class="km">{{item.balanceDirection}}</van-col>
+                            <van-col :span="4" class="je">{{item.balance}}</van-col>
+                        </van-row>
+                        <!-- <van-row >
+                            <van-col :span="9" class="zy">摘要</van-col>
+                            <van-col :span="4" class="je">200.00</van-col>
+                            <van-col :span="4" class="je">20000.00</van-col>
+                            <van-col :span="3" class="km">借</van-col>
+                            <van-col :span="4" class="je">200.00</van-col>
+                        </van-row> -->
+                   
+
+                    </div>
+                </div>
+            </div>
+        </div>
+ 
+        <!--开始日期-->
+        <van-action-sheet v-model="dateObj.startVisbile" duration="0.2" >
+            <van-datetime-picker
+                v-model="dateObj.startDate"
+                title="选择日期"
+                :min-date="dateObj.minDate"
+                :max-date="dateObj.maxDate"
+                @confirm="startConfirm"
+                @cancel	="startCancel"
+                type="year-month"
+            />
+        </van-action-sheet>
+        <!--结束日期-->
+        <van-action-sheet v-model="dateObj.endVisbile" duration="0.2" >
+            <van-datetime-picker
+                v-model="dateObj.endDate"
+                title="选择日期"
+                :min-date="dateObj.minDate"
+                :max-date="dateObj.maxDate"
+                @confirm="endConfirm"
+                @cancel	="startCancel"
+                type="year-month"
+            />
+        </van-action-sheet>
+        <!--科目选择-->
+        <van-action-sheet v-model="dateObj.subjectVisbile"  duration="0.2">
+            <van-cascader
+                v-model="cascaderValue"
+                title="请选择所在地区"
+                :options="subjectsTree"
+                @close="dateObj.subjectVisbile = false"
+                @finish="onFinish"
+                :field-names="fieldNames"
+    
+                @change="onChangeAcidentArea"
+            />
+        </van-action-sheet>
+
+
+
+    </div>
+</template>
+<script>
+import { subjectData ,getLoginBook,listNormalDetails} from "@/api/sunVillage_info/fixedAssets";
+export default {
+  name: "detailedLedger",
+  data() {
+    return{
+        //数据
+        tableList:[],
+        // 查询参数
+        queryParams: {
+            startDate:'', //开始日期
+            endDate:'',   //结束日期
+            startSubjectId:'', //开始科目
+            endSubjectId:'', //结束科目
+
+            startSubjectLevel: 1,
+            endSubjectLevel: 4,
+            filterZero: true,
+            includeNonVoucher: false,
+            groupBySubject: true
+        },
+        //日期相关
+        dateObj:{
+            //开始日期-弹窗显隐
+            startVisbile:false,
+            startDate: new Date(),
+            minDate:new Date(2018, 0, 1),
+            maxDate:new Date(2028, 5, 1),
+            //结束日期-弹窗显隐
+            endVisbile:false,
+            endDate:new Date(),
+            //科目选择
+            subjectVisbile:false
+        },
+        subjectText:'', //科目页面显示
+        SubjectsList:[], //科目选项
+        subjectsTree: [], //会计科目显示列表(树)
+        cascaderValue:"", //科目选择
+        fieldNames: {
+            text: 'label',
+            value: 'subjectId',
+            children: 'children',
+        },
+        subjectYear:''
+    }
+  },
+  mounted(){
+    //初始化账套
+    this.initLoginBook();
+
+    this.initAxios()
+  },
+  methods:{
+    initLoginBook(){
+        getLoginBook().then((res) => {
+            if (res.code == 200) {
+                let currentDays = res.data.currentDay;
+                if (currentDays == null) {
+                    this.$notify({
+                        message:'当前账套未开启!',
+                        type: 'error'
+                    });
+                    return false;
+                }
+                this.$set(this.queryParams, "startDate", currentDays);
+                this.$set(this.queryParams, "endDate", currentDays);
+
+                let dataArr = currentDays.split('-')
+                this.$set(this.dateObj, "startDate", new Date(dataArr[0], dataArr[1]-1), 1);
+                this.$set(this.dateObj, "endDate", new Date(dataArr[0], dataArr[1]-1), 1);
+
+                this.subjectYear = (currentDays.substr(0, 4));
+            }
+        })
+    },
+    initAxios(){
+        //获取会计科目列表数据
+      this.getDicts("subject_type").then((resp) => {
+        subjectData({year:this.subjectYear}).then((res) => {
+          res.rows.forEach((x) => {
+            x.label = x.subjectId + ' ' + x.subjectName
+          });
+          this.SubjectsList = res.rows;
+
+          let curObj = res.rows[0];
+          if(res.rows.length>0){
+            this.subjectText = curObj.label; 
+            this.queryParams.startSubjectId = curObj.subjectId; 
+            this.queryParams.endSubjectId = curObj.subjectId; 
+            this.cascaderValue =  curObj.subjectId; 
+            
+            this.initPage()
+            this.makeSubjectsTree(res.rows, resp.data);
+            }else{
+                this.subjectText = '暂无数据'; 
+            }
+        });
+      });
+    },
+    subjectClick(){
+        this.dateObj.subjectVisbile = true
+    },
+    makeSubjectsTree(SubjectsList, subjectTypes) {
+      let func = (pid) => {
+        let arr = null;
+        for(let v of SubjectsList)
+        {
+          let parentId = v.parentId || v.subjectId.substr(0, v.subjectId.length - 3) || null;
+          if(parentId == pid)
+          {
+            if(!arr) arr = [];
+            let a = func(v.subjectId);
+            if(a)
+              v.children = a;
+            v.label = v.subjectId + ' ' + v.subjectNameAll;
+            v.is_last = 'Y';
+            v.disabled = false;
+          
+            arr.push(v);
+          }
+        }
+        return arr;
+      };
+      let res = func(null);
+      let r = [];
+      res.forEach((x) => {
+        let subjectIdStart = x.subjectId[0];
+        let item = r.find((y) => y.subjectId == subjectIdStart);
+        if(!item)
+        {
+          let type = subjectTypes.find((y) => y.dictValue == subjectIdStart);
+          if(!type)
+            return;
+          item = {
+            subjectId: type.dictValue,
+            label: type.dictLabel,
+            sortFlag: type.dictSort,
+            is_last: 'N',
+            subjectNameAll: '',
+            children: [],
+            disabled: true
+          };
+          r.push(item);
+        }
+        item.children.push(x);
+      });
+      r.sort((a, b) => a.dictSort - b.dictSort);
+    //   console.log(r)
+      this.subjectsTree = r;
+     
+    },
+    initPage(){
+        listNormalDetails(this.queryParams).then((res)=>{
+            if(res.code == 200){
+                let content = res.rows;
+                if(content.length>0){
+                    this.tableList = content[0].list;
+                }else{
+                    this.tableList = []
+                }
+            }
+        })
+    },
+    subjectNameFun(num){
+        let endNum = num.split("-");
+        this.$router.push({
+            path: "/sunVillage_info/voucher",
+            query: {
+                vocherId: endNum[1],
+                num:encodeURI(num)
+            },
+        });
+    },
+    onFinish({ selectedOptions }){
+
+        let lastArr = selectedOptions[selectedOptions.length-1];
+        this.queryParams.startSubjectId = lastArr.subjectId
+        this.queryParams.endSubjectId = lastArr.subjectId
+        this.subjectText = lastArr.label;
+        this.initPage();
+    },
+    onChangeAcidentArea(aaa){
+        // console.log(aaa)
+    },
+    //点击开始日期--显示弹窗
+    startDateClick(){
+        this.dateObj.startVisbile = true;
+    },
+    //弹窗-开始日期-确定
+    startConfirm(value){
+        let years = this.format(value,'yyyy');
+        let months = this.format(value,'MM');
+        this.queryParams.startDate = years+'-'+months;
+
+
+        this.dateObj.startVisbile = false;
+        this.initPage();
+    },
+    //弹窗-开始日期-取消
+    startCancel(){
+        this.dateObj.startVisbile = false;
+        this.dateObj.endVisbile = false;
+    },
+    //点击结束日期-显示弹窗
+    endDateClick(){
+        this.dateObj.endVisbile = true;
+    },
+    //弹窗--结束日期-确定
+    endConfirm(value){
+        let years = this.format(value,'yyyy');
+        let months = this.format(value,'MM');
+        this.queryParams.endDate = years+'-'+months;
+
+
+        this.dateObj.endVisbile = false;
+        this.initPage();
+    }
+ 
+  }
+}
+</script>
+<style scoped lang="scss">
+.home_wrapper{
+   background: #e9e9e9;
+   min-height: 100vh;
+   width: 100vw;
+   .header_main {
+       height: 116px;
+       background: url('../../assets/images/sunVillage_info/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;
+       position: relative;
+
+       .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;
+       }
+
+   }
+   .period_main{
+        padding:28px 22px 0;
+        display: flex;
+        align-items: center;
+        .bt_title{
+            display: flex;
+            align-items: center;
+            margin-right: 15px;
+            .icon{
+                width: 50px;
+                height: 50px;
+                border-radius: 50%;
+                box-shadow: 4px 0px 7px rgba(63, 68, 75, 0.1);
+                background:#2facfe url('../../assets/images/sunVillage_info/list_icon_13.png') center center no-repeat;
+                background-size: 29px 25px;
+                margin-right: 12px;
+            }
+            .title{
+                font-size: 30px;
+                color: #2facfe;
+            }
+        }
+        .calendar_block{
+            flex: 1;
+            border-radius: 8px;
+            box-shadow: 4px 4px 7px rgba(63, 68, 75, 0.1);
+            background: #fff;
+            height: 64px;
+            font-size: 30px;
+            display: flex;
+            align-items: center;
+            letter-spacing: 2px;
+            justify-content: center;
+        }
+        .to{
+            width: 68px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            font-size: 30px;
+            color: #868686;
+        }
+   }
+   .subject_main{
+        padding:20px 22px 0;
+        display: flex;
+        align-items: center;
+        .bt_title{
+            display: flex;
+            align-items: center;
+            margin-right: 15px;
+            .icon{
+                width: 50px;
+                height: 50px;
+                border-radius: 50%;
+                box-shadow: 4px 0px 7px rgba(63, 68, 75, 0.1);
+                background:#2facfe url('../../assets/images/sunVillage_info/list_icon_13.png') center center no-repeat;
+                background-size: 29px 25px;
+                margin-right: 12px;
+            }
+            .title{
+                font-size: 30px;
+                color: #2facfe;
+            }
+        }
+        .subject_block{
+            flex: 1;
+            border-radius: 8px;
+            box-shadow: 4px 4px 7px rgba(63, 68, 75, 0.1);
+            background: #fff;
+            height: 64px;
+            display: flex;
+            padding:0 26px 0 22px;
+            align-items: center;
+            justify-content: space-between;
+            .title{
+                width: 475px;
+                height: 64px;
+                line-height: 64px;
+                font-size: 30px;
+                white-space: nowrap;
+                overflow: hidden;
+                text-overflow: ellipsis;
+                color: #2b2b2b;
+            }
+            .xs_icon{
+                width: 11px;
+                height: 23px;
+                background: url('../../assets/images/sunVillage_info/list_icon_12.png') center center no-repeat;
+                background-size: 100% 100%;
+            }
+        }
+   }
+   .center_box{
+    margin-left: 22px;
+    display: flex;
+    margin-top: 22px;
+    background: #fff;
+    border-top-left-radius: 8px;
+    border-bottom-left-radius: 8px;
+    .vocher_name{
+        width: 405px;
+        .head_m{
+            height: 110px;
+            background: #2facfe;
+            border-radius: 8px;
+            .year_m{
+                border-right: 1px solid #fff;
+                .year_text{
+                    height: 56px;
+                    display: flex;
+                    align-items: center;
+                    justify-content: center;
+                    color: #fff;
+                    font-size: 30px;
+                }
+                .unit_m{
+                    height: 54px;
+                    display: flex;
+                    align-items: center;
+                    justify-content: center;
+                    padding-bottom: 10px;
+                    .ubs{
+                        width: 94px;
+                        height: 43px;
+                        background: #cbeaff;
+                        font-size: 30px;
+                        color: #1a84c9;
+                        display: flex;
+                        align-items: center;
+                        justify-content: center;
+                        border-radius: 6px;
+                        &:nth-child(1){
+                            margin-right: 12px;
+                        }
+                    }
+                }
+            }
+            .credential_m{
+                display: flex;
+                align-items: center;
+                justify-content: center;
+                color: #fff;
+                font-size: 30px;
+                height: 110px;
+            }
+        }
+        .vocher_mTitle{
+            background: #d7e8f3;
+            .van-col{
+                height: 84px;
+                font-size: 30px;
+                display: flex;
+                align-items: center;
+                justify-content: center;
+                border-right: 1px solid #fff;
+                .pz_tx{
+                    color: #278dff;
+                    padding-bottom: 8px;
+                    border-bottom: 1px solid #278dff;
+                }
+            }
+            &:nth-child(2n-1){
+                background: #e3f4ff;
+            }
+        }
+
+    }
+    .vocher_content{
+        flex: 1;
+        overflow:hidden;
+        overflow-x: scroll;
+        // white-space:nowrap;
+        display: -webkit-box;
+        -webkit-overflow-scrolling: touch;
+        .vocher_cmain{
+            width: 1200px;
+            .head_m{
+                .van-col{
+                    height: 110px;
+                    font-size: 30px;
+                    color: #2facfe;
+                    display: flex;
+                    align-items: center;
+                    justify-content: center;
+                    border-right: 1px solid #bfbfbf;
+                    &:last-child{
+                        border-right: 0;
+                    }
+                }
+
+            }
+            .content_m{
+                
+                .van-row{
+               
+                    &:nth-child(2n-1){
+                        background: #e9e9e9;
+                    }
+                }
+                .van-col{
+                    height: 84px;
+                    font-size: 30px;
+                    padding:0 22px;
+                    display: flex;
+                    align-items: center;
+                    border-right: 1px solid #bfbfbf;
+                    &:last-child{
+                        border-right: 0 none;
+                    }
+            
+                    &.je{
+                        justify-content: flex-end;
+                    }
+                    &.km{
+                        justify-content: center;
+                    }
+                }
+                
+            }
+        }
+
+    }
+   }
+}
+</style>

src/views/sunVillage_info/index.vue

@@ -60,6 +60,8 @@
                 <router-link :to="{name:'sunVillageInfoFixedAssets'}" class="nav_item n_6">资产登记</router-link>
                 <router-link :to="{name:'sunVillageInfoInformation'}" class="nav_item n_7">合同登记</router-link>
                 <router-link :to="{name:'sunVillageInfoListRegister'}" class="nav_item n_8">零工登记</router-link>
+                <router-link :to="{name:'sunVillageInfoStatisticalReport'}" class="nav_item n_9">统计填报</router-link>
+                <router-link :to="{name:'sunVillageInfoDetailedLedger'}" class="nav_item n_10">明细账</router-link>
               </div>
             </div>
             <div class="nav_list">
@@ -258,7 +260,6 @@
         })
       },
       selectChange(val){
-        console.log(val)
         val.index == 0 ? this.$router.push({path:"/sunVillage_info/user"}) : val.index == 1 ? this.$router.push({path:"/sunVillage_info/passWord"}) : val.index == 2 ? this.logout() : '';
       }
     },
@@ -394,18 +395,31 @@
                 &.n_5 {
                     background: url('../../assets/images/sunVillage_info/index_block_05.png') no-repeat center top;
                     background-size: 50%;
+                    margin-bottom: 20PX;
                 }
                 &.n_6 {
                     background: url('../../assets/images/sunVillage_info/index_block_06.png') no-repeat center top;
                     background-size: 50%;
+                    margin-bottom: 20PX;
                 }
                 &.n_7 {
                     background: url('../../assets/images/sunVillage_info/index_block_07.png') no-repeat center top;
                     background-size: 50%;
+                    margin-bottom: 20PX;
                 }
                 &.n_8 {
                     background: url('../../assets/images/sunVillage_info/index_block_08.png') no-repeat center top;
                     background-size: 50%;
+                    margin-bottom: 20PX;
+                }
+                &.n_9 {
+                    background: url('../../assets/images/sunVillage_info/index_block_09.png') no-repeat center top;
+                    background-size: 50%;
+
+                }
+                &.n_10 {
+                    background: url('../../assets/images/sunVillage_info/index_block_10.png') no-repeat center top;
+                    background-size: 50%;
                 }
             }
           .icon{

src/views/sunVillage_info/statistical_report.vue

@@ -0,0 +1,247 @@
+<template>
+    <div class="home_wrapper">
+        <div class="header_main">
+            统计填报
+            <div class="return_btn" @click="onClickLeft"></div>
+            <div class="add_btn" @click="goAdd"></div>
+        </div>
+
+        <div class="list_main">
+          <van-list
+            v-model="loading"
+            :finished="finished"
+            finished-text="没有更多了"
+            @load="getList"
+          >
+            <!--1-->
+            <van-swipe-cell right-width="150" class="item"  v-for="(item,index) in applicationList" :key="index">
+               <div class="item_box" @click="$router.push({name:'sunVillageInfoStatisticalReportEdit',query:{id:item.id}})">
+                 <div class="head_block">
+                      <i class="icon"></i>
+                      <div class="title">{{item.templateName}}</div>
+                  </div>
+
+                  <div class="order_block">
+                        <div class="flex_block">
+                            <i class="icon icon_1"></i>
+                            <div class="text">{{item.time}}</div>
+                        </div>
+                        <div class="flex_block" v-if="item.applyUserName">
+                            <i class="icon icon_2"></i>
+                            <div class="text">{{item.applyUserName}}</div>
+                        </div>
+                        <div class="flex_block" v-if="item.processKey">
+                            <i class="icon icon_2"></i>
+                            <div class="text">{{item.processKey}}</div>
+                        </div>
+                  </div>
+               </div>
+              <template #right>
+                <div style="background-color: #ee0a24;height: 100%" @click="handleDelete(item,index)" >删除</div>
+                <router-link :to="{name:'sunVillageInfoStatisticalReportEdit',query:{id:item.id}}" style="background-color: #07c160">修改</router-link>
+              </template>
+            </van-swipe-cell>
+          </van-list>
+
+        </div>
+
+   </div>
+</template>
+
+<script>
+ import { statisticsList ,delStatisticsRemove} from "@/api/sunVillage_info/fixedAssets";
+export default {
+  name: "statisticalReport",
+  data() {
+    return {
+      loading: false,
+      finished: false,
+      applicationList:[],
+      queryParams:{
+        pageNum:1,
+        pageSize:10,
+        // orderByColumn:'createTime',
+        // isAsc:'desc',
+      },
+  
+    };
+  },
+  created() {
+    
+  },
+  methods: {
+    getList(){
+      statisticsList(this.queryParams).then((response)=>{
+        if(response.code == 200){
+          for (var i = 0; i < response.rows.length; i++) {
+            this.applicationList.push(response.rows[i]);
+          }
+     
+          if(this.applicationList.length >= response.total){
+             this.finished = true;
+             return;
+           }else{
+             this.loading = false;
+             this.queryParams.pageNum += 1 ;
+           }
+        }
+      })  
+    },
+    /** 删除按钮操作 */
+    handleDelete(row,index) {
+      const ids = row.id || this.ids;
+      this.$dialog.alert(
+         {
+           message:'是否确认删除填报信息?',
+           title:"警告",
+           showCancelButton:true,
+           confirmButtonText: "确定",
+           cancelButtonText: "取消",
+         }
+       )
+       .then(function () {
+          return delStatisticsRemove(ids)
+       })
+       .then(() => {
+        this.applicationList.splice(index, 1);
+        this.$notify({ type: 'success', message: '删除成功' });
+       })
+    },
+
+    goAdd(){
+      this.$router.push('/sunVillage_info/statistical_report_edit')
+    },
+  },
+}
+</script>
+
+<style scoped lang="scss">
+.home_wrapper{
+   background: #e9e9e9;
+   min-height: 100vh;
+   width: 100vw;
+   .header_main {
+       height: 116px;
+       background: url('../../assets/images/sunVillage_info/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;
+       position: relative;
+
+       .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;
+       }
+   }
+
+   .list_main{
+       padding:26px 22px 0;
+       .item{
+           height: 162px;
+           border-radius: 30px;
+           background: #fff;
+           box-shadow: 4px 6px 5px rgba(63, 68, 75, 0.1);
+           margin-bottom: 20px;
+           .item_box{
+             padding:25px 32px;
+           }
+           .head_block{
+               height: 62px;
+               display: flex;
+               align-items: center;
+               width: 100%;
+                .icon{
+                   width: 34px;
+                   height: 30px;
+                   background: url('../../assets/images/sunVillage_info/fixedAssets_icon_4.png') no-repeat;
+                   background-size: 100% 100%;
+                   display: block;
+                   margin-right: 12px;
+               }
+               .title{
+                   flex:1;
+                   font-size: 32px;
+                   color: #252525;
+                   overflow: hidden;
+                   text-overflow: ellipsis;
+                   white-space: nowrap;
+                   padding-right: 20px;
+
+               }
+           }
+           .order_block{
+                display: flex;
+                height: 52px;
+                padding-top: 12px;
+                font-size: 24px;
+                color: #858585;
+                align-items: center;
+                padding-bottom: 10px;
+                .flex_block{
+                    display: flex;
+                    align-items: center;
+                    justify-content: center;
+                    margin-right: 28px;
+                    height: 42px;
+                    .icon{
+                        width: 25px;
+                        height: 25px;
+                        margin-top: 3px;
+                        margin-right: 8px;
+                        &.icon_1{
+                            background:  url('../../assets/images/sunVillage_info/fixedAssets_icon_3.png') no-repeat;
+                            background-size: 100% 100%;
+                        }
+                        &.icon_2{
+                            background:  url('../../assets/images/sunVillage_info/fixedAssets_icon_5.png') no-repeat;
+                            background-size: 100% 100%;
+                        }
+                    }
+                }
+           }
+
+
+
+
+       }
+   }
+
+   /deep/ .van-swipe-cell__right{
+     display: flex;
+     align-items: center;
+     width: 150PX;
+     margin-left: 5PX;
+     a,div{
+       margin: 0;
+       display: flex;
+       align-items: center;
+       justify-content: center;
+       color: #ffffff;
+       font-size: 14PX;
+       height: 100%;
+       flex: 1;
+     }
+   }
+}
+</style>

src/views/sunVillage_info/statistical_report_edit.vue

@@ -0,0 +1,779 @@
+<template>
+    <div class="home_wrapper">
+        <div class="header_main">
+            统计填报
+            <div class="return_btn" @click="onClickLeft"></div>
+        </div>
+        <div class="template_main">
+            <div class="title_wrap">
+                <div class="icon"></div>
+                <div class="title">模板</div>
+            </div>
+            <div class="search_wrap" @click="templateClick">
+                <div class="title">{{templateValue}}</div>
+                <div class="xs_icon"></div>
+            </div>
+        </div>
+        <div class="choose_main">
+            <div class="search_wrap">
+                <div class="title">申报类型</div>
+                <div class="content" @click="typeDeclarationClick">
+                    <div class="text">{{declarationTypeValue}}</div>
+                    <div class="xs_icon"></div>
+                </div>
+            </div>
+            <div class="search_wrap">
+                <div class="title">负责人</div>
+                <div class="content">
+                    <div class="text">
+                       <input v-model="from.principalName" type="text" class="fzr" placeholder="请输入">
+                    </div>
+                    <div class="xs_icon"></div>
+                </div>
+            </div>
+        </div>
+
+
+        <!--div class="table_main">
+            <div class="head_wrap">
+               <div class="project_name">项目名称</div>
+               <div class="unit_count">计数单位</div>
+               <div class="numerical_value">数值</div>
+            </div>
+            <div class="thead_wrap">
+                <div class="basic_info">
+                    <div class="basic_title">
+                        <div class="s_title">合作社发展基本情况</div>
+                    </div>
+                    <div class="type_wrap">
+                        <div class="industry_list">
+
+                            <div class="subdivision_list">
+                                <div class="subdivision_title">行业分布</div>
+                                <div class="subdivision_main">
+                                    <div class="planting_flex">
+                                        <div class="subclass">大豆种植</div>
+                                        <div class="unit_munt">个</div>
+                                        <div class="number_value">
+                                            <van-stepper v-model="stepperValue" /> 
+                                        </div>
+                                    </div>
+                                    <div class="planting_flex">
+                                        <div class="subclass">大豆种植</div>
+                                        <div class="unit_munt">个</div>
+                                        <div class="number_value">
+                                            <van-stepper v-model="stepperValue" /> 
+                                        </div>
+                                    </div>
+
+                                </div>
+                            </div>
+                        </div>
+                        <div class="industry_list">
+                            <div class="type_project">各类合作社总数各类合</div>
+                            <div class="unit_munt">个</div>
+                            <div class="number_value">
+                                <van-stepper v-model="stepperValue" /> 
+                            </div>
+                        </div>
+                        <div class="industry_list">
+                            <div class="type_project">牧业</div>
+                            <div class="unit_munt">个</div>
+                            <div class="number_value">
+                                <van-stepper v-model="stepperValue" /> 
+                            </div>
+                        </div>
+
+                    </div>
+                </div>
+                <div class="basic_info">
+                    <div class="basic_title">
+                        <div class="s_title">合作社发展基本情况</div>
+                    </div>
+                    <div class="type_wrap">
+                        <div class="industry_list">
+
+                            <div class="subdivision_list">
+                                <div class="subdivision_title">行业分布</div>
+                                <div class="subdivision_main">
+                                    <div class="planting_flex">
+                                        <div class="subclass">大豆种植</div>
+                                        <div class="unit_munt">个</div>
+                                        <div class="number_value">
+                                            <van-stepper v-model="stepperValue" /> 
+                                        </div>
+                                    </div>
+                                    <div class="planting_flex">
+                                        <div class="subclass">大豆种植</div>
+                                        <div class="unit_munt">个</div>
+                                        <div class="number_value">
+                                            <van-stepper v-model="stepperValue" /> 
+                                        </div>
+                                    </div>
+
+                                </div>
+                            </div>
+                        </div>
+                        <div class="industry_list">
+                            <div class="type_project">各类合作社总数各类合</div>
+                            <div class="unit_munt">个</div>
+                            <div class="number_value">
+                                <van-stepper v-model="stepperValue" /> 
+                            </div>
+                        </div>
+                        <div class="industry_list">
+                            <div class="type_project">牧业</div>
+                            <div class="unit_munt">个</div>
+                            <div class="number_value">
+                                <van-stepper v-model="stepperValue" /> 
+                            </div>
+                        </div>
+
+                    </div>
+                </div>
+            </div>
+        </div-->
+
+        <div class="table_main">
+            <div class="head_wrap">
+               <div class="project_name">项目名称</div>
+               <div class="unit_count">计数单位</div>
+               <div class="numerical_value">数值</div>
+            </div>
+            <div class="thead_wrap">
+                <!---1-->
+                <div class="basic_info" v-for="(item,index) in tEntityStatisticsNumberList" :key="index" >
+                    <div class="basic_title">
+                        <div class="s_title">{{item.projectName}}</div>
+                    </div>
+                    <div class="type_wrap">
+                        <!---2--->
+                        <div class="industry_list"  v-for="(data,idx) in item.children" :key="idx">
+                            <div v-if="data.children && data.children!=null" class="industry_block">
+                                <div class="subdivision_list">
+                                    <div class="subdivision_title">{{data.projectName}}</div>
+                                    <div class="subdivision_main">
+                                        <!---3--->
+                                        <div class="planting_flex" v-for="(val,num) in data.children" :key="num">
+                                            <div class="subclass">{{val.projectName}}</div>
+                                            <div class="unit_munt">{{val.measuringUnit}}</div>
+                                            <div class="number_value">
+                                                <van-stepper v-model="val.currentYearNumber"   min="0"/> 
+                                            </div>
+                                        </div>
+                               
+
+                                    </div>
+                                </div>
+                            </div>
+                            <div v-else  class="industry_block">
+                                <div class="type_project">{{data.projectName}}</div>
+                                <div class="unit_munt">{{data.measuringUnit}}</div>
+                                <div class="number_value">
+                                    <van-stepper v-model="data.currentYearNumber" min="0" /> 
+                                </div>
+                            </div>
+
+
+                        </div>
+           
+
+                    </div>
+                </div>
+                
+            </div>
+        </div>
+
+        <div class="submit_btn">
+            <van-button type="info" @click="submitFrom" size="normal">保存填报信息</van-button>
+        </div>
+
+        <van-action-sheet v-model="popObj.typeDeclarationVisibile" duration="0.2" >
+            <van-picker
+                title="申报类型"
+                :columns="declarationTypeIdOptions"
+                show-toolbar
+                @confirm="declarationTypeIdConfirm"
+                @cancel="declarationTypeIdCancel"
+            >
+                <template #option="option">
+                <div style="display: flex; flex-direction: column; align-items: center;">
+                    <div>{{ option.dictLabel }}</div>
+                    <!-- <div>年龄：{{ option.age }}</div> -->
+                </div>
+                </template>
+            </van-picker>
+        </van-action-sheet>
+
+        <van-action-sheet v-model="popObj.templateVisbile" duration="0.2" >
+            <van-picker
+                title="模板"
+                :columns="templateOptions"
+                show-toolbar
+                @confirm="templateConfirm"
+                @cancel="templateCancel"
+                :loading="loading"
+            >
+                <template #option="option">
+                <div style="display: flex; flex-direction: column; align-items: center;">
+                    <div>{{ option.label }}</div>
+                </div>
+                </template>
+            </van-picker>
+
+        </van-action-sheet>
+    </div>
+</template>
+
+<script>
+import {entityStatisticsTemplate ,entityStatisticsSave ,entityStatisticsDetail} from "@/api/sunVillage_info/fixedAssets";
+import {getInfo} from "../../api/login";
+export default {
+  name: "statisticalReportEdit",
+  data() {
+    return {
+        stepperValue:1,
+        from:{
+            applyTime:null,
+            applyUserId:null,
+            applyUserName:null,
+            auditStatus:null,
+            createBy:null,
+            createTime:null,
+            deptId:null,
+            id:null,
+            instanceId:null,
+            processKey:null,
+            remark:null,
+            statisticsTypeId:null,
+            templateId:null, //模板id
+            updateBy:null,
+            updateTime:null,
+            templateName:null,  //模板名称
+            declarationTypeId:null, //申报类型 1 
+            principalName:null, //单位负责人  1 
+            preparer:null, //填表人  1
+            preparerDeptName:'', //填报单位 1
+            time:this.format(new Date(),'yyyy-MM-dd'), //填报时间
+            tEntityStatisticsNumberList:[]
+
+        },
+        //当前选中模板列表
+        tEntityStatisticsNumberList:[],
+        //选择模板标题
+        templateValue :'请选择模板',
+
+        popObj:{
+            typeDeclarationVisibile:false,
+            templateVisbile:false
+        },
+        // 申报类型ID字典
+        declarationTypeIdOptions: [],
+        declarationTypeValue:'请选择',
+        //申报大项--列表
+        templateOptions:[],
+        loading:true
+        
+        
+  
+    };
+  },
+  created() {
+    this.getDicts("declaration_type_id").then(response => {
+        
+        this.declarationTypeIdOptions = response.data;
+ 
+    });
+  },
+  mounted(){
+    getInfo().then(response => {
+        this.from.preparer = response.user.nickName
+        this.from.preparerDeptName = response.user.dept.deptName
+    });
+    let query = this.$route.query;
+    if(query&& query.id){
+        this.loading =true;
+        //編輯
+        let oId = this.$route.query.id;
+        entityStatisticsDetail(oId).then((res)=>{
+         
+            if(res.code == 200){
+                let content = res.data;
+                let obj = {
+                    applyTime:content.content,
+                    applyTime:content.applyTime,
+                    applyUserId:content.pplyUserId,
+                    applyUserName:content.applyUserName,
+                    auditStatus:content.auditStatus,
+                    createBy:content.createBy,
+                    createTime:content.createTime,
+                    deptId:content.deptId,
+                    id:content.id,
+                    instanceId:content.instanceId,
+                    processKey:content.processKey,
+                    remark:content.remark,
+                    statisticsTypeId:content.statisticsTypeId,
+                    templateId:content.templateId, //模板id
+                    updateBy:content.updateBy,
+                    updateTime:content.updateTime,
+                    templateName:content.templateName,  //模板名称
+                    declarationTypeId:content.declarationTypeId, //申报类型 1 
+                    principalName:content.principalName, //单位负责人  1 
+                    preparer:content.preparer, //填表人  1
+                    preparerDeptName:content.preparerDeptName, //填报单位 1
+                    time:content.time,
+                    tEntityStatisticsNumberList:content.tEntityStatisticsNumberList
+                }
+
+                //当前选择模板
+                this.tEntityStatisticsNumberList = content.tEntityStatisticsNumberList;
+                //申报类型
+                let declarationTypeObj = this.declarationTypeIdOptions.find((account) => {
+                    //model就是上面的数据源
+                    return account.dictValue == content.declarationTypeId; //筛选出匹配数据
+                });
+                //请选择模板
+                this.templateValue = content.templateName
+
+                // this.loading =false;
+                this.declarationTypeValue = declarationTypeObj.dictLabel;
+                this.from = obj;
+            }
+
+            
+        })
+    }
+        //查看
+    entityStatisticsTemplate({statisticsTypeId:1}).then((response)=>{
+        if(response.code == 200){ 
+            let content = response.data;
+
+            this.templateOptions = content.map(item => {
+                const recursionFileMap = obj => {
+                    obj.forEach((v,i)=>{
+
+                        if(v.currentYearNumber == null){
+                            v.currentYearNumber = 0;
+                        }
+                        if (v.children && v.children != null) {
+                            recursionFileMap(v.children)
+                        }
+                    })
+                }
+                recursionFileMap(item.tEntityStatisticsNumberList)
+
+                return { 
+                    value:item.templateName, 
+                    label: item.templateName,
+                    templateForm:{
+                        templateId:item.id,
+                        templateName:item.templateName,
+                        declarationTypeId:item.declarationTypeId,
+                        tEntityStatisticsNumberList:item.tEntityStatisticsNumberList
+                    }
+                };
+            });
+            this.loading =false;
+
+        }
+    })
+   
+  },
+  methods: {
+    submitFrom(){
+        this.from.tEntityStatisticsNumberList = this.tEntityStatisticsNumberList;
+        if(this.from.templateName == null){
+            this.$notify({
+                message:'请选择模板!',
+                type: 'danger'
+            });
+    
+            return false;
+        }else if(this.from.declarationTypeId == null){
+            this.$notify({
+                message:'请选择申报类型!',
+                type: 'danger'
+            });
+            return false;
+        }else if(this.from.principalName == null){
+            this.$notify({
+                message:'请填写负责人!',
+                type: 'danger'
+            });
+            return false;
+        }
+        entityStatisticsSave(this.from).then((res)=>{
+            if(res.code == 200){
+                this.$notify({
+                    message:'保存成功!',
+                    type: 'success'
+                });
+        
+            }
+        })
+    },
+    typeDeclarationClick(){
+        this.popObj.typeDeclarationVisibile = true;
+    },
+    declarationTypeIdConfirm(value,index){
+        this.from.declarationTypeId = value.dictValue;
+        this.declarationTypeValue = value.dictLabel
+        this.popObj.typeDeclarationVisibile = false;
+    },
+    declarationTypeIdCancel(){
+        this.popObj.typeDeclarationVisibile = false;
+    },
+    templateClick(){
+        this.popObj.templateVisbile = true;
+    },
+    templateConfirm(data,index){
+        this.tEntityStatisticsNumberList = data.templateForm.tEntityStatisticsNumberList;
+ 
+        this.templateValue = data.label;
+        this.from.templateName = data.label;
+        this.popObj.templateVisbile = false;
+    },
+    templateCancel(){
+        this.popObj.templateVisbile = false;
+    }
+
+  
+  },
+}
+</script>
+
+<style scoped lang="scss">
+.home_wrapper{
+   background: #e9e9e9;
+   min-height: 100vh;
+   width: 100vw;
+   .header_main {
+       height: 116px;
+       background: url('../../assets/images/sunVillage_info/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;
+       position: relative;
+
+       .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;
+       }
+
+    
+   }
+   .template_main{
+        padding:30px 24px 0;
+        display: flex;
+        margin-bottom: 20px;
+        align-items: center;
+        .title_wrap{
+            display: flex;
+            align-items: center;
+            padding-right: 15px;
+            .icon{
+                width: 50px;
+                height: 50px;
+                border-radius: 50%;
+                box-shadow: 4px 0px 7px rgba(63, 68, 75, 0.1);
+                background:#2facfe url('../../assets/images/sunVillage_info/list_icon_11.png') center center no-repeat;
+                background-size: 27px 27px;
+                margin-right: 12px;
+            }
+            .title{
+                font-size: 30px;
+                color: #2facfe;
+            }
+        }
+        .search_wrap{
+            flex: 1;
+            height: 64px;
+            border-radius: 8px;
+            box-shadow: 4px 4px 7px rgba(63, 68, 75, 0.1);
+            background: #fff;
+            display: flex;
+            padding:0 26px 0 22px;
+            align-items: center;
+            justify-content: space-between;
+
+         
+            .title{
+                width: 465px;
+                height: 64px;
+                line-height: 64px;
+                font-size: 30px;
+                white-space: nowrap;
+                overflow: hidden;
+                text-overflow: ellipsis;
+                color: #2b2b2b;
+            }
+            .xs_icon{
+                width: 11px;
+                height: 23px;
+                background: url('../../assets/images/sunVillage_info/list_icon_12.png') center center no-repeat;
+                background-size: 100% 100%;
+            }
+
+            
+        }
+   }
+   .choose_main{
+        padding:0 24px;
+        display: flex;
+        justify-content: space-between;
+        margin-bottom: 26px;
+        .search_wrap{
+            height: 64px;
+            width: 48.5%;
+            border-radius: 8px;
+            box-shadow: 4px 4px 7px rgba(63, 68, 75, 0.1);
+            background: #fff;
+            display: flex;
+            .title{
+                width: 145px;
+                font-size: 30px;
+                color: #fff;
+                background: #2facfe;
+                border-top-left-radius: 8px;
+                border-bottom-left-radius: 8px;
+                display: flex;
+                justify-content: center;
+                align-items: center;
+            }
+            .content{
+                flex: 1;
+                padding:0 20px 0 10px;
+                display: flex;
+                align-items: center;
+                justify-content: space-between;
+                .text{
+                    width: 150px;
+                    // line-height: 64px;
+                    font-size: 30px;
+                    white-space: nowrap;
+                    text-align: center;
+                    overflow: hidden;
+                    text-overflow: ellipsis;
+                    .fzr{
+                        width: 150px;
+                    }
+                }
+                .xs_icon{
+                    width: 11px;
+                    height: 23px;
+                    background: url('../../assets/images/sunVillage_info/list_icon_12.png') center center no-repeat;
+                    background-size: 100% 100%;
+                }
+            }
+        }
+        
+   }
+   .table_main{
+        padding:20px  0 0 24px;
+        div{
+            box-sizing: border-box;
+        }
+        .head_wrap{
+            height: 69px;
+            display: flex;
+            font-size: 30px;
+            background: #fff;
+            color: #2facfe;
+            border-top-left-radius: 8px;
+            border-bottom-left-radius: 8px;
+            .project_name,
+            .unit_count,
+            .numerical_value{
+                display: flex;
+                align-items: center;
+                justify-content: center;
+            }
+            .project_name{
+                width: 314px;
+                background: #2facfe;
+                color: #fff;
+                border-radius: 8px;
+            }
+            .unit_count{
+                width: 173px;
+                border-right: 1px solid #0469ab;
+            }
+            .numerical_value{
+                width: 239px;
+            }
+        }
+
+        .thead_wrap{
+            .basic_info{
+                display: flex;
+                .basic_title{
+                   width: 63px;
+                   display: flex;
+                   align-items: center;
+                   justify-content: center;
+                   background: #6ac1fa;
+                   border-right: 1px solid #0469ab;
+                   border-bottom: 1px solid #0469ab;
+                   .s_title{
+                        width: 28px;
+                        font-size: 28px;
+                        padding:14px 0;
+                   }
+                }
+
+                .type_wrap{
+                    flex: 1;
+                    display: flex;
+                    flex-wrap: wrap;
+                    .industry_list{
+                        width: 100%;
+                        display: flex;
+                        border-bottom: 1px solid #0469ab;
+                        min-height: 75px;
+                        .industry_block{
+                            flex: 1;
+                            display: flex;
+                        }
+                        .type_project,
+                        .unit_munt,
+                        .number_value{
+                            display: flex;
+                            justify-content: center;
+                            align-items: center;
+                        }
+
+                        .type_project{
+                            width: 251px;
+                            font-size: 28px;
+                            background: #aad8f6;
+                            padding:0 14px;
+                            font-size: 28px;
+                            border-right: 1px solid #0469ab;
+                        }
+                        .unit_munt{
+                            width: 173px;
+                            font-size: 28px;
+                            border-right: 1px solid #0469ab;
+                        }
+                        .number_value{
+                            width: 239px;
+                           
+                        }
+
+
+                        .subdivision_list{
+                            flex: 1;
+                            display: flex;
+                            .subdivision_title{
+                                width: 76px;
+                                background: #aad8f6;
+                                font-size: 28px;
+                                display: flex;
+                                align-items: center;
+                                padding:0 8px;
+                                justify-content: center;
+                                border-right: 1px solid #0469ab;
+                            }
+                            .subdivision_main{
+                                flex: 1;
+                                display: flex;
+                                flex-wrap: wrap;
+                                .planting_flex{
+                                    width: 100%;
+                                    display: flex;
+                                    min-height: 75px;
+                                    border-bottom: 1px solid #0469ab;
+                                    &:last-child{
+                                        border-bottom: 0;
+                                    }
+                                    .subclass{
+                                        width: 175px;
+                                        display: flex;
+                                        align-items: center;
+                                        justify-content: center;
+                                        font-size: 27px;
+                                        background: #d7e8f3;
+                                        border-right: 1px solid #0469ab;
+                                    }
+                                }
+                            }
+                        }
+
+
+
+
+
+
+
+
+
+                        // <div class="subdivision_list">
+                        //         <div class="subdivision_title">行业分布</div>
+                        //         <div class="subdivision_main">
+                        //             <!---3--->
+                        //             <div class="planting_flex">
+                        //                 大豆种植
+                        //             </div>
+                        //             <!---3--->
+                        //             <div class="planting_flex">
+                        //                 大豆种植
+                        //             </div>
+
+                        //         </div>
+
+
+                        //     </div>
+
+
+
+
+
+
+
+
+
+                    }
+                  
+                }
+            }
+        }
+
+   }
+   .submit_btn{
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 200px;
+   }
+
+   /deep/ {
+        .van-stepper__minus,
+        .van-stepper__plus{
+            background: #2facfe;
+            color: #fff;
+        }
+        .van-stepper__minus--disabled{
+            color: #e9e9e9;
+        }
+        .van-stepper__input{
+            margin:0;
+            background: #e0f1fc;
+            font-size: 30px;
+            color: #2facfe;
+        }
+    }
+
+}
+
+</style>

src/views/sunVillage_info/voucher.vue

@@ -0,0 +1,388 @@
+<template>
+    <div class="home_wrapper">
+        <div class="head_main">
+            <div class="header_main">
+                记账凭证
+                <div class="return_btn" @click="onClickLeft"></div>
+            </div>
+            <div class="Account_sleeve">
+                <div class="flex_block">
+                    <div class="x_m"></div>
+                    <div class="title">账套：</div>
+                    <div class="desc">{{$store.state.user.bookName}}</div>
+                </div>
+                <div class="flex_block">
+                    <div class="x_m"></div>
+                    <div class="title">日期：</div>
+                    <div class="desc">{{vaocherObj.bookDate}}</div>
+                </div>
+                <div class="flex_block">
+                    <div class="x_m"></div>
+                    <div class="title">凭证号：</div>
+                    <div class="desc">{{voucherNum}}号</div>
+                </div>
+            </div>
+        </div>
+        <div class="vocher_mian">
+            <div class="minimum_hd">{{vaocherObj.detailList.length}}条</div>
+            <!--1-->
+            <div class="vocher_block" v-for="(item,index) in vaocherObj.detailList" :key="index">
+                <div class="flex_block">
+                    <div class="m_title">
+                        <div class="icon">1</div>
+                        摘要
+                    </div>
+                    <div class="m_cont">{{item.voucherSummary}}</div>
+                </div>
+                <div class="flex_block">
+                    <div class="m_title">会计科目</div>
+                    <div class="m_cont">{{ item.subjectNameAll }}</div>
+                </div>
+                <div class="flex_block">
+                    <div class="m_title">借方金额</div>
+                    <div class="m_cont money" v-if="item.jieAmount">¥ {{item.jieAmount}} 元</div>
+                </div>
+                <div class="flex_block">
+                    <div class="m_title">贷方金额</div>
+                    <div class="m_cont money" v-if="item.daiAmount">¥ {{item.daiAmount}} 元</div>
+                </div>
+            </div>
+            <!--1-->
+            <!-- <div class="vocher_block">
+                <div class="flex_block">
+                    <div class="m_title">
+                        <div class="icon">1</div>
+                        摘要
+                    </div>
+                    <div class="m_cont">购买设备</div>
+                </div>
+                <div class="flex_block">
+                    <div class="m_title">会计科目</div>
+                    <div class="m_cont">财政资金-人居环境整治</div>
+                </div>
+                <div class="flex_block">
+                    <div class="m_title">借方金额</div>
+                    <div class="m_cont money">¥ 10,000.00 元</div>
+                </div>
+                <div class="flex_block">
+                    <div class="m_title">贷方金额</div>
+                    <div class="m_cont money">¥ 10,000.00 元</div>
+                </div>
+            </div> -->
+        </div>
+
+        <div class="vocher_footer">
+            <div class="total_wrap">合计：<span class="money">{{capitalAmount}}</span></div>
+            <div class="personnel_wrap">
+                <div class="f_block">制单员：{{ vaocherObj.preparedBy }}</div>
+                <div class="f_block">审核员：{{ vaocherObj.checkedBy }}</div>
+            </div>
+        </div>
+       
+    </div>
+</template>
+<script>
+import { voucherDetail } from "@/api/sunVillage_info/fixedAssets";
+export default {
+  name: "sunVillageInfoVoucher",
+  data() {
+    return {
+        //凭证号
+        voucherId:'',
+        voucherNum:'',
+        //凭证数据
+        vaocherObj:{
+            detailList:[]
+        },
+        //大写总金额
+        capitalAmount:''
+    }
+  },
+  mounted(){
+    this.voucherId =  this.$route.query.vocherId;
+    this.voucherNum = decodeURI(this.$route.query.num);
+    this.initAxiox()
+  },
+  methods:{
+    initAxiox(){
+        voucherDetail({id:this.voucherId}).then((res)=>{
+            if(res.code == 200){
+                let content = res.data;
+                this.vaocherObj = content;
+                let totalAmount = 0;
+                if(content.detailList.length && content.detailList.length>0){
+                    content.detailList.forEach((v,i)=>{
+                        totalAmount +=v.jieAmount
+                    })
+                }
+                this.capitalAmount = this.convertCurrency(totalAmount);
+            }
+        })
+    },
+    convertCurrency(money) {
+      //汉字的数字
+      var cnNums = new Array(
+        "零",
+        "壹",
+        "贰",
+        "叁",
+        "肆",
+        "伍",
+        "陆",
+        "柒",
+        "捌",
+        "玖"
+      );
+      //基本单位
+      var cnIntRadice = new Array("", "拾", "佰", "仟");
+      //对应整数部分扩展单位
+      var cnIntUnits = new Array("", "万", "亿", "兆");
+      //对应小数部分单位
+      var cnDecUnits = new Array("角", "分", "毫", "厘");
+      //整数金额时后面跟的字符
+      var cnInteger = "整";
+      //整型完以后的单位
+      var cnIntLast = "元";
+      //最大处理的数字
+      var maxNum = 999999999999999.9999;
+      //金额整数部分
+      var integerNum;
+      //金额小数部分
+      var decimalNum;
+      //输出的中文金额字符串
+      var chineseStr = "";
+      //分离金额后用的数组，预定义
+      var parts;
+      if (money == "") {
+        return "";
+      }
+      money = parseFloat(money);
+      if (money >= maxNum) {
+        //超出最大处理数字
+        return "";
+      }
+      if (money == 0) {
+        chineseStr = cnNums[0] + cnIntLast + cnInteger;
+        return chineseStr;
+      }
+      //转换为字符串
+      money = money.toString();
+      if (money.indexOf(".") == -1) {
+        integerNum = money;
+        decimalNum = "";
+      } else {
+        parts = money.split(".");
+        integerNum = parts[0];
+        decimalNum = parts[1].substr(0, 4);
+      }
+      //获取整型部分转换
+      if (parseInt(integerNum, 10) > 0) {
+        var zeroCount = 0;
+        var IntLen = integerNum.length;
+        for (var i = 0; i < IntLen; i++) {
+          var n = integerNum.substr(i, 1);
+          var p = IntLen - i - 1;
+          var q = p / 4;
+          var m = p % 4;
+          if (n == "0") {
+            zeroCount++;
+          } else {
+            if (zeroCount > 0) {
+              chineseStr += cnNums[0];
+            }
+            //归零
+            zeroCount = 0;
+            chineseStr += cnNums[parseInt(n)] + cnIntRadice[m];
+          }
+          if (m == 0 && zeroCount < 4) {
+            chineseStr += cnIntUnits[q];
+          }
+        }
+        chineseStr += cnIntLast;
+      }
+      //小数部分
+      if (decimalNum != "") {
+        var decLen = decimalNum.length;
+        for (var i = 0; i < decLen; i++) {
+          var n = decimalNum.substr(i, 1);
+          if (n != "0") {
+            chineseStr += cnNums[Number(n)] + cnDecUnits[i];
+          }
+        }
+      }
+      if (chineseStr == "") {
+        chineseStr += cnNums[0] + cnIntLast + cnInteger;
+      } else if (decimalNum == "") {
+        chineseStr += cnInteger;
+      }
+      return chineseStr;
+    },
+  }
+}
+</script>
+<style scoped lang="scss">
+.home_wrapper{
+   background: #e9e9e9;
+   min-height: 100vh;
+   width: 100vw;
+   .head_main{
+        height: 440px;
+        background: url('../../assets/images/sunVillage_info/vocher_bg.png') no-repeat;
+        background-size: 100% 100%;
+        .header_main {
+                height: 116px;
+                // position: fixed;
+                top: 0;
+                left: 0;
+                width: 100%;
+                font-size: 36px;
+                line-height: 116px;
+                text-align: center;
+                color: #fff;
+                position: relative;
+
+                .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;
+                }
+
+        }
+        .Account_sleeve{
+            padding-left: 75px;
+            margin-top: 20px;
+            .flex_block{
+                padding-left: 30px;
+                display: flex;
+                font-size: 30px;
+                line-height: 30px;
+                color: #fff;
+                margin-bottom: 28px;
+                position: relative;
+                .x_m{
+                    position: absolute;
+                    width: 8px;
+                    height: 30px;
+                    left: 0;
+                    top: 0;
+                    background: #fff;
+                    border-radius: 8px;
+                }
+                .title{
+                    width: 125px;
+                }
+            }
+        }
+
+
+
+
+
+
+
+        // <div class="Account_sleeve">
+        //         <div class="flex_block">
+        //             <div class="title">账套：</div>
+        //             <div class="desc">长山镇李四村经济合作社</div>
+        //         </div>
+        //         <div class="flex_block">
+        //             <div class="title">日期：</div>
+        //             <div class="desc">2022-02-03</div>
+        //         </div>
+        //         <div class="flex_block">
+        //             <div class="title">凭证号：</div>
+        //             <div class="desc">记-55号</div>
+        //         </div>
+        //     </div>
+   }
+   .vocher_mian{
+        margin:-120px 28px 0;
+        background: #fff;
+        box-shadow: 4px 6px 5px rgba(63, 68, 75, 0.1);
+        border-radius: 20px;
+        padding:  40px 40px 60px;
+        .minimum_hd{
+            background: #2FACFE;
+            padding:0 22px;
+            height: 50px;
+            color: #fff;
+            line-height: 50px;
+            border-radius: 50px;
+            font-size: 30px;
+            display: inline-block;
+
+        }
+        .vocher_block{
+            padding-top: 20px;
+            padding-bottom: 15px;
+            border-bottom: 1px dashed #DCDCDC;
+            .flex_block{
+                display: flex;
+                justify-content: space-between;
+                height: 60px;
+                font-size: 30px;
+                .m_title{
+                    display: flex;
+                    justify-content: center;
+                    align-items: center;
+                    color: #878787;
+                
+                    .icon{
+                        height: 38px;
+                        width: 38px;
+                        background: #2FACFE;
+                        border-radius: 50%;
+                        color: #fff;
+                        display: flex;
+                        align-items: center;
+                        justify-content: center;
+                        margin-right: 12px;
+
+                    }
+                }
+                .money{
+                    color: #E90000;
+                }
+            }
+        }
+   }
+   .vocher_footer{
+        margin:0 28px;
+        padding: 38px 0;
+        font-size: 30px;
+        border-bottom: 1px dashed #dedede;
+        .total_wrap{
+            margin:0 45px;
+            // height: 60px;
+            padding:18px 0;
+            // line-height: 60px;
+            display: flex;
+            align-items: center;
+          
+            .money{
+                color: #f00;
+            }
+        }
+        .personnel_wrap{
+            margin:0 45px;
+            height: 50px;
+            line-height: 50px;
+            color: #2FACFE;
+            justify-content: space-between;
+            display: flex;
+        }
+
+        // <div class="vocher_footer">
+        //     <div class="total_wrap">合计：<span class="money">贰万元整</span></div>
+        //     <div class="personnel_wrap">
+        //         <div class="f_block">制单员：张三</div>
+        //         <div class="f_block">审核员：王五</div>
+        //     </div>
+        // </div>
+   }
+}
+</style>