支出申请

app.json

@@ -6,7 +6,9 @@
     "pages/handle/expenditureAudit/expenditureAudit",
     "pages/apply/index",
     "pages/apply/paymentTemplate/paymentTemplate",
-    "pages/apply/approval/approval"
+    "pages/apply/approval/approval",
+    "pages/apply/paymentTemplate/see/see",
+    "pages/apply/paymentTemplate/add/add"
   ],
   "window": {
     "backgroundTextStyle": "light",

app.wxss

@@ -51,7 +51,9 @@ contact-button {
   width: 100%;
   text-align:center;
   z-index: 999;
-  background:linear-gradient(to right, #2C8E68, #B3DB62);
+  position: fixed;
+  top: 0;
+  background: linear-gradient(to right, #429a68, #9ecf67);
 } 
 .ns image{
   position: absolute;
@@ -69,3 +71,22 @@ contact-button {
   width: 100%;
   font-size: 16px;
 }
+.pure_top {
+  width: 100%;
+  height: 120px;
+  position: absolute;
+  z-index: -1;
+  overflow: hidden
+}
+  
+.pure_top::after {
+  content: '';
+  width: 140%;
+  height: 120px;
+  position: absolute;
+  left: -20%;
+  top: 0;
+  z-index: -1;
+  border-radius: 0 0 50% 50%;
+  background: linear-gradient(to right, #2C8E68, #B3DB62);
+}

pages/apply/index.wxml

@@ -4,7 +4,7 @@
   <text style="top:{{isIPX?'54px':'30px'}};">支出申请</text>
 </view>
 <!-- 付款单位开始 -->
-<view class="top">
+<view class="top" style="margin-top:{{isIPX?'100px':'75px'}};">
   <image src="../../image/apply/dress_icon.png" mode="widthFix"></image>
   <view class="top-tit">付款单位</view>
   <view class="top-title">龙水镇龙洞村股份经济联合社</view>

pages/apply/paymentTemplate/add/add.js

@@ -0,0 +1,102 @@
+// pages/apply/paymentTemplate/add/add.js
+const app = getApp();
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    isIPX: app.globalData.isIPX,
+    radio:'1',
+    steps: [
+      {
+        assigneeName: '同意',
+        activityName: '测试测试',
+        durationInMillis: '描述信息',
+        endTime: '2022-01-02',
+        comment: '同意',
+        type: '1'
+      },
+      {
+        assigneeName: '申请中',
+        activityName: '测试测试',
+        durationInMillis: '描述信息',
+        endTime: '2022-01-02',
+        comment: '同意',
+        type: '2'
+      },
+      {
+        assigneeName: '驳回',
+        activityName: '测试测试',
+        durationInMillis: '描述信息',
+        endTime: '2022-01-02',
+        comment: '同意',
+        type: '3'
+      },
+      {
+        assigneeName: '步骤四',
+        activityName: '测试测试',
+        durationInMillis: '描述信息',
+        endTime: '2022-01-02',
+        comment: '同意'
+      },
+    ],
+    active:0
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad(options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload() {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh() {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom() {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage() {
+
+  }
+})

pages/apply/paymentTemplate/add/add.json

@@ -0,0 +1,16 @@
+{
+  "navigationStyle": "custom",
+  "usingComponents": {
+    "van-row": "@vant/weapp/row/index",
+    "van-col": "@vant/weapp/col/index",
+    "van-cell": "@vant/weapp/cell/index",
+    "van-cell-group": "@vant/weapp/cell-group/index",
+    "van-tag": "@vant/weapp/tag/index",
+    "van-icon": "@vant/weapp/icon/index",
+    "van-steps": "@vant/weapp/steps/index",
+    "van-button": "@vant/weapp/button/index",
+    "van-radio": "@vant/weapp/radio/index",
+    "van-radio-group": "@vant/weapp/radio-group/index",
+    "van-field": "@vant/weapp/field/index"
+  }
+}

pages/apply/paymentTemplate/add/add.wxml

@@ -0,0 +1,165 @@
+<!--pages/apply/paymentTemplate/add/add.wxml-->
+<text>pages/apply/paymentTemplate/add/add.wxml</text>
+<view class="ns" style="height:{{isIPX?'88px':'64px'}};">
+  <image src="/image/apply/back.png" style="top:{{isIPX?'54px':'30px'}};" mode="widthFix" bindtap="back"></image>
+  <text style="top:{{isIPX?'54px':'30px'}};">支出申请</text>
+</view>
+<view class="pure_top" style="top:{{isIPX?'88px':'64px'}};"></view>
+<view class="main-box top-box" style="margin-top:{{isIPX?'100px':'75px'}};">
+  <text class="box-title">审批事项</text>
+  <input class="input_tit" placeholder="请输入审批事项"/>
+  <text>提交单位：龙华村联合社</text>
+  <text>提交日期：2022年1月18日</text>
+  <text>提  交  人：报账员</text>
+  <text>联系电话：13906311234</text>
+</view>
+<view class="main-title">事项一</view>
+<view class="center">
+  <text class="title">基础信息</text>
+  <view class="main-box table-box">
+    <van-field label="申请流水号" value="{{ value }}" placeholder="请输入申请流水号" border="{{ false }}" bind:change="onChange" input-align="right"/>
+    <van-field label="申请时间" value="{{ value }}" placeholder="请输入申请时间" border="{{ false }}" bind:change="onChange" input-align="right"/>
+    <van-field label="合计支出" value="{{ value }}" placeholder="请输入合计支出" border="{{ false }}" bind:change="onChange" input-align="right"/>
+    <van-field label="支出原因" value="{{ value }}" placeholder="请输入支出原因" border="{{ false }}" bind:change="onChange" input-align="right"/>
+    <van-field label="资金支出类别" value="{{ value }}" placeholder="请输入资金支出类别" border="{{ false }}" bind:change="onChange" input-align="right" is-link arrow-direction	="down"/>
+  </view>
+  <text class="title">关联项目</text>
+  <view class="main-box table-box">
+    <van-field label="项目名称" value="{{ value }}" placeholder="请输入项目名称" border="{{ false }}" bind:change="onChange" input-align="right" is-link/>
+  </view>
+  <text class="title">付款方信息</text>
+  <view class="main-box table-box">
+    <van-field label="付款方式" value="{{ value }}" placeholder="请输入付款方式" border="{{ false }}" bind:change="onChange" input-align="right" is-link arrow-direction	="down"/>
+
+    <van-field value="{{ value }}" placeholder="请输入付款方名称" border="{{ false }}" bind:change="onChange" input-align="right" is-link arrow-direction	="down">
+      <view slot="label">
+        付款方名称<van-tag plain type="danger" color="red" round style="margin-left:10px;">必填</van-tag>
+      </view>
+    </van-field>
+    <van-field label="付款方账号" value="{{ value }}" placeholder="请输入付款方账号" border="{{ false }}" bind:change="onChange" input-align="right"/>
+    <van-field label="所属银行" value="{{ value }}" placeholder="请输入所属银行" border="{{ false }}" bind:change="onChange" input-align="right"/>
+    <van-field label="转账附言" value="{{ value }}" placeholder="请输入转账附言" border="{{ false }}" bind:change="onChange" input-align="right"/>
+  </view>
+  <text class="title">收款方信息</text>
+  <view class="center-box">
+    <view class="main-box table-box">
+      <van-cell title="收款账户类型" center border="{{false}}">
+        <view>
+          <van-radio-group
+            value="{{ radio }}"
+            bind:change="onChange"
+            direction="horizontal"XX
+          >
+            <van-radio name="1" checked-color="#2C8E68" disabled>公户</van-radio>
+            <van-radio name="2" checked-color="#2C8E68" disabled>私户</van-radio>
+          </van-radio-group>
+        </view>
+      </van-cell>
+    </view>
+    <view class="main-box table-box">
+      <van-field value="{{ value }}" placeholder="请输入姓名" border="{{ false }}" bind:change="onChange" input-align="right" is-link arrow-direction	="down">
+        <view slot="label">
+          姓名<van-tag plain type="danger" color="#5CAE77" round style="margin-left:10px;">收款方</van-tag>
+        </view>
+      </van-field>
+      <van-field label="收款账户" value="{{ value }}" placeholder="请输入收款账户" border="{{ false }}" bind:change="onChange" input-align="right"/>
+      <van-field label="开户银行" value="{{ value }}" placeholder="请输入开户银行" border="{{ false }}" bind:change="onChange" input-align="right" is-link arrow-direction	="down"/>
+      <van-field label="收入金额" value="{{ value }}" placeholder="请输入收入金额" border="{{ false }}" bind:change="onChange" input-align="right"/>
+      <van-field label="所属银行" value="{{ value }}" placeholder="请输入所属银行" border="{{ false }}" bind:change="onChange" input-align="right" is-link arrow-direction	="down"/>
+    </view>
+  </view>
+
+  <view class="main-box">
+    <van-cell>
+      <!-- <view slot="icon">
+        <van-icon class-prefix="my-icon" name="extra" />
+      </view> -->
+      <view slot="title">
+        <view class="van-cell-text">附件<van-tag type="danger" style="margin-left: 10px;">可拍照</van-tag></view>
+      </view>
+      <view>
+        <view class="van-cell-text">总数<van-tag round color="#5CAE77" plain style="margin-left: 10px;"> 0张 </van-tag></view>
+      </view>
+    </van-cell>
+    <view class="fj-box">
+      <view class="fj-li">
+        <text>
+收
+据
+        </text>
+        <image src="/image/apply/fj_upload.png" mode="widthFix"></image>
+      </view>
+      <view class="fj-li">
+        <text>
+发
+票
+        </text>
+        <image src="/image/apply/fj_upload.png" mode="widthFix"></image>
+      </view>
+      <view class="fj-li">
+        <text>
+其
+他
+        </text>
+        <image src="/image/apply/fj_upload.png" mode="widthFix"></image>
+      </view>
+    </view>
+  </view>
+
+  <!-- <view class="main-box steps-box">
+    <view class="steps-tit">审批流程</view>
+    <van-row wx:for="{{steps}}" wx:key="index">
+      <van-col span="3">
+        <view class="index">{{index+1}}</view>
+        <block wx:if="{{index==0}}">
+          <view class="indexBorder">
+            <view class="ssT" wx:if="{{index>0}}"></view>
+            <view class="yq"></view>
+            <view class="ss" wx:if="{{steps.length != index+1}}"></view>
+          </view>
+        </block>
+        <block wx:else>
+          <view class="indexBorder indexCenter">
+            <view class="ssT" wx:if="{{index>0}}"></view>
+            <view class="yq"></view>
+            <view class="ss" wx:if="{{steps.length != index+1}}"></view>
+          </view>
+        </block>
+      </van-col>
+      <van-col span="21">
+        <van-cell title="{{item.activityName}}" center="{{true}}" border="{{false}}">
+          <view class="agree" wx:if="{{item.type=='1'}}">{{ item.assigneeName }}</view>
+          <view class="in" wx:if="{{item.type=='2'}}">{{ item.assigneeName }}</view>
+          <view class="disagree" wx:if="{{item.type=='3'}}">{{ item.assigneeName }}</view>
+        </van-cell>
+
+        <van-cell center border="{{false}}">
+          <view slot="title">
+            <view style="color: #999999;">{{ item.durationInMillis }}</view>
+          </view>
+          <view style="color: #999999;font-size: 12px;">{{ item.endTime }}</view>
+        </van-cell>
+      </van-col>
+    </van-row>
+  </view> -->
+  <view class="bottomBtn">
+    <view bindtap="showPopup">
+      <image src="/image/apply/icon_pres.png"></image>
+      <text>保存模板</text>  
+    </view>
+    <view>
+      <image src="/image/apply/icon_add.png"></image>
+      <text>新增事项</text>  
+    </view>
+  </view>
+
+  <view class="bottom">
+    <view class="btn1" bindtap="openBox">保存</view>
+    <view class="btn2" bindtap="goApproval">下一步</view>
+  </view>
+</view>
+
+<!-- <view class="bottom">
+  <button type="warn" plain class="btnDis">驳回</button>
+  <button type="primary" class="btnAgree">同意</button>
+</view> -->

pages/apply/paymentTemplate/add/add.wxss

@@ -0,0 +1,323 @@
+/* pages/apply/paymentTemplate/add/add.wxss */
+text{display: block;}
+.top{
+  height: 64px;
+  width: 100%;
+  position: fixed;
+  z-index: 999;
+  top:0px;
+}
+.top text{
+  position: relative;
+  top: 30px;
+  margin-right: 30px;
+  display: block;
+  color: #eee;
+  text-align: center;
+  width: 100%;
+  font-size: 16px;
+}
+.input_tit{
+  border: 1px solid #DCDCDC;
+  padding: 0px 10px;
+  height: 32px;
+  line-height: 32px;
+  border-radius: 5px;
+  margin-bottom: 15px;
+}
+.bgPage{
+  width: 140%;
+  position:absolute;
+  transform: translate(-15%, -50%);
+  height: 300px;
+  z-index: -1;
+}
+.center{
+  padding-bottom: 50px;
+}
+.main-title{
+  background-image: linear-gradient(to right, #2C8E68 , #B3DB62);
+  color: #ffffff;
+  font-size: 18px;
+  padding: 10px 0;
+  text-align: center;
+}
+.main-box{
+  background: #ffffff;
+  padding: 20px;
+  width: 94%;
+  margin: 0 auto;
+  border-radius: 10px;
+  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.16);
+}
+.main-box block{
+  float: right;
+}
+.title{
+  padding: 10px calc(3% + 20px);
+}
+.top-box{
+  margin-top: 20px;
+  margin-bottom: 28px;
+}
+.top-box text{
+  margin-bottom: 15px;
+}
+.top-box text:last-child{
+  margin-bottom: 0px;
+}
+.box-title{
+  color: #2C8E68;
+  text-align: center;
+  font-size: 16px;
+}
+.center-box .main-box{
+  margin-bottom: 15px;
+}
+.xm van-cell:first-child .van-cell{
+  border-bottom: 1px solid #cccccc;
+  margin: 0;
+  padding-bottom: 15px!important;
+  margin-bottom: 15px;
+}
+.table-box van-field van-cell .van-cell{
+  margin-bottom: 15px;
+}
+.table-box van-field:last-child van-cell .van-cell{
+  margin-bottom: 0px;
+}
+.table-box view text icon{
+  display: inline-block;
+  font-size: 14px;
+  border: 1px solid red;
+  color: red;
+}
+.van-cell{
+  padding: 0!important;
+}
+@font-face {
+  font-family: 'my-icon';
+  src: url('../../../image/icon/fj_icon.png') format('truetype');
+}
+.my-icon {
+  font-family: 'my-icon';
+}
+
+.my-icon-extra::before {
+  content: '\e626';
+}
+.fj-box text{
+  background-color: #5CAE77;
+  color: #ffffff;
+  display: inline-block;
+  text-align: center;
+  border-radius: 5px;
+  white-space:pre-wrap
+}
+.fj-li{
+  margin-top: 20px;
+  display: flex;
+  flex-wrap: wrap;
+}
+.fj-li image{
+  width: 22%;
+  margin-left: 5%;
+}
+.fj-li image:nth-child(4n+1){
+  margin-left: 0;
+}
+.fj-li image:nth-child(n+5){
+  margin-top: 15px;
+}
+.bottomBtn{
+  display: flex;
+  width: 94%;
+  margin: 0 auto;
+  margin-top: 25px;
+  justify-content:space-between;
+}
+.bottomBtn view{
+  display: flex;
+  width: 48%;
+  background-color: #ffffff;
+  border-radius: 5px;
+  box-shadow: 0px 5px 9px #DCDCDC;
+  padding: 10px 0px;
+  text-align: center;
+  align-items:center;
+  justify-content:center;
+  font-size: 14px;
+  color: #2C8E68;
+}
+.bottomBtn view image{
+  width: 18px;
+  height: 18px;
+  margin-right: 5px;
+}
+
+
+.bottom{
+  width: 84%;
+  margin: 0 auto;
+  text-align: center;
+  margin-top: 50px;
+  margin-bottom: 50px;
+  display: flex;
+}
+
+.bottom view {
+  width: 47%;
+  margin: 0 auto;
+  border-radius: 30px;
+  display: inline-block;
+}
+
+.bottom .btn1{
+  border: 1px solid #2C8E68;
+  padding: 8px 0px;
+  color: #2C8E68;
+}
+
+.bottom .btn2{
+  border: 1px solid transparent;
+  padding: 8px 0px;
+  background-image: linear-gradient(to right, #2C8E68, #5CAE77);
+  margin-left: 6%;
+  color: #fff;
+}
+.steps-box{
+  padding: 0;
+  margin-top: 15px;
+}
+.steps-box .van-row{
+  padding: 0 20px;
+}
+
+.steps-box view{
+  margin-bottom: 0;
+}
+
+.steps-box  .van-col{
+    position: relative;
+    height: 70px;
+  }
+  .steps-box  .van-col--21{
+    padding: 12PX 0;
+    padding-left: 10px;
+  }
+  .steps-box  .van-row:nth-child(2n){
+    background: rgba(29,111,233,0.1);
+  }
+  .steps-box  .van-cell{
+    background: transparent;
+    padding: 0 10Px;
+  }
+  .steps-box  .bq{
+    display: inline-block;
+    padding: 0PX 10PX;
+    line-height: 0.64rem;
+    border-radius: 5PX;
+  }
+  .steps-box  .index{
+    background: #1D6FE9;
+    color: #ffffff;
+    text-align: center;
+    width: 20PX;
+    height: 20PX;
+    line-height: 20PX;
+    border-radius: 50%;
+    position: absolute;
+    left: 0;
+    top: 50%;
+    transform: translate(0,-50%);
+  }
+  .steps-box  .indexCenter{
+    top: 0!important;
+  }
+  .steps-box  .van-row:first-child .van-col:first-child .indexBorder{
+    top: calc(50% - 5px);
+  }
+  .steps-box  .indexBorder{
+    width: 10PX;
+    position: absolute;
+    right: 0;
+    top: 0;
+    height: 100%;
+    
+  }
+  .steps-box  .indexBorder .yq{
+    height: 10PX;
+    width: 10PX;
+    background: #C9C9C9;
+    border-radius: 50%;
+  }
+  .steps-box  .indexBorder .ss{
+    height: calc(50% - 5PX);
+    width: 1PX;
+    background: #C9C9C9;
+    position: relative;
+    left: 4PX;
+  }
+  .steps-box .indexBorder .ssT{
+    height: calc(50% - 5PX);
+    width: 1PX;
+    background: #C9C9C9;
+    position: relative;
+    left: 4PX;
+  }
+  .agree{
+    background-color: rgba(92, 174, 119, 0.1);
+    color:#5CAE77 ;
+    width: 80%;
+    text-align: center;
+    float: right;
+  }
+  .in{
+    background-color: rgba(245, 163, 39, 0.1);
+    color:#F5A327 ;
+    width: 80%;
+    text-align: center;
+    float: right;
+  }
+  .disagree{
+    background-color: rgba(233, 0, 0, 0.1);
+    color:#E90000 ;
+    width: 80%;
+    text-align: center;
+    float: right;
+  }
+  .steps-box .van-cell__title{
+    flex: 0.7;
+  }
+  .steps-box .van-cell__value{
+    flex: 0.3;
+  }
+  .steps-tit{
+    font-size: 16px;
+    text-align: center;
+    background-color: #2C8E68;
+    color: #ffffff;
+    padding: 20px 0;
+    border-top-left-radius: 10px;
+    border-top-right-radius: 10px;
+  }
+  .bottom{
+    width: 84%;
+    margin: 0 auto;
+    text-align: center;
+    margin-top: 30px;
+    margin-bottom: 30px;
+  }
+
+  .bottom button {
+    width: 47%;
+    margin: 0 auto;
+    border-radius: 30px;
+    display: inline-block;
+  }
+
+  .bottom .btnAgree{
+    border: 1px solid transparent;
+    background-image: linear-gradient(to right, #2C8E68, #5CAE77);
+    margin-left: 6%;
+  }

pages/apply/paymentTemplate/paymentTemplate.js

@@ -22,6 +22,11 @@ Page({
       url: '../approval/approval',
     })
   },
+  goSee(){
+    wx.navigateTo({
+      url: 'see/see',
+    })
+  },
   /**
    * 生命周期函数--监听页面加载
    */

pages/apply/paymentTemplate/paymentTemplate.wxml

@@ -32,7 +32,7 @@
       <view slot="icon" style="width: 15%;"><image src="/image/apply/icon_shou.png" style="width: 20px;height: 20px;"></image></view>
     </van-cell>
     <view class="btnBox">
-      <image src="/image/apply/down.png" class="down"></image>
+      <image src="/image/apply/down.png" class="down" bindtap="goSee"></image>
       <image src="/image/apply/icon_update.png" class="update"></image>
       <image src="/image/apply/icon_delete.png" class="delete"></image>
     </view>

pages/apply/paymentTemplate/see/see.js

@@ -0,0 +1,102 @@
+// pages/apply/paymentTemplate/see/see.js
+const app = getApp();
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    isIPX: app.globalData.isIPX,
+    radio:'1',
+    steps: [
+      {
+        assigneeName: '同意',
+        activityName: '测试测试',
+        durationInMillis: '描述信息',
+        endTime: '2022-01-02',
+        comment: '同意',
+        type: '1'
+      },
+      {
+        assigneeName: '申请中',
+        activityName: '测试测试',
+        durationInMillis: '描述信息',
+        endTime: '2022-01-02',
+        comment: '同意',
+        type: '2'
+      },
+      {
+        assigneeName: '驳回',
+        activityName: '测试测试',
+        durationInMillis: '描述信息',
+        endTime: '2022-01-02',
+        comment: '同意',
+        type: '3'
+      },
+      {
+        assigneeName: '步骤四',
+        activityName: '测试测试',
+        durationInMillis: '描述信息',
+        endTime: '2022-01-02',
+        comment: '同意'
+      },
+    ],
+    active:0
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad(options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload() {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh() {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom() {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage() {
+
+  }
+})

pages/apply/paymentTemplate/see/see.json

@@ -0,0 +1,15 @@
+{
+  "navigationStyle": "custom",
+  "usingComponents": {
+    "van-row": "@vant/weapp/row/index",
+    "van-col": "@vant/weapp/col/index",
+    "van-cell": "@vant/weapp/cell/index",
+    "van-cell-group": "@vant/weapp/cell-group/index",
+    "van-tag": "@vant/weapp/tag/index",
+    "van-icon": "@vant/weapp/icon/index",
+    "van-steps": "@vant/weapp/steps/index",
+    "van-button": "@vant/weapp/button/index",
+    "van-radio": "@vant/weapp/radio/index",
+    "van-radio-group": "@vant/weapp/radio-group/index"
+  }
+}

pages/apply/paymentTemplate/see/see.wxml

@@ -0,0 +1,142 @@
+<!--pages/apply/paymentTemplate/see/see.wxml-->
+<view class="ns" style="height:{{isIPX?'88px':'64px'}};">
+  <image src="/image/apply/back.png" style="top:{{isIPX?'54px':'30px'}};" mode="widthFix" bindtap="back"></image>
+  <text style="top:{{isIPX?'54px':'30px'}};">支出申请</text>
+</view>
+<view class="pure_top" style="top:{{isIPX?'88px':'64px'}};"></view>
+<view class="main-box top-box" style="margin-top:{{isIPX?'100px':'75px'}};">
+  <text class="box-title">审批事项</text>
+  <text style="margin-bottom: 20px;">房屋出租整年费用</text>
+  <text>提交单位：龙华村联合社</text>
+  <text>提交日期：2022年1月18日</text>
+  <text>提  交  人：报账员</text>
+  <text>联系电话：13906311234</text>
+</view>
+<view class="main-title">事项一</view>
+<view class="center">
+  <text class="title">基础信息</text>
+  <view class="main-box table-box">
+    <van-cell title="申请流水号" value="2056886342464224214" center border="{{false}}"></van-cell>
+    <van-cell title="申请时间" value="2021-1-26" center border="{{false}}"></van-cell>
+    <van-cell title="合计支出" value="¥ 00.00" center border="{{false}}"></van-cell>
+    <van-cell title="支出原因" value="请输入支出原因" center border="{{false}}"></van-cell>
+    <van-cell title="资金支出类别" value="结算类" center border="{{false}}" is-link arrow-direction	="down"></van-cell>
+  </view>
+  <text class="title">关联项目</text>
+  <view class="main-box table-box">
+    <van-cell title="项目名称" value="2056886342464224214" center border="{{false}}" is-link></van-cell>
+  </view>
+  <text class="title">付款方信息</text>
+  <view class="main-box table-box">
+    <van-cell title="付款方式" value="2056886342464224214" center border="{{false}}" is-link arrow-direction	="down"></van-cell>
+    <van-cell value="2056886342464224214" center border="{{false}}" is-link arrow-direction	="down">
+      <view slot="title">
+        付款方名称<van-tag plain type="danger" color="red" style="margin-left:10px;">必填</van-tag>
+      </view>
+    </van-cell>
+    <van-cell title="付款方账号" value="2056886342464224214" center border="{{false}}"></van-cell>
+    <van-cell title="所属银行" value="2056886342464224214" center border="{{false}}"></van-cell>
+    <van-cell title="转账附言" value="2056886342464224214" center border="{{false}}"></van-cell>
+  </view>
+  <text class="title">收款方信息</text>
+  <view class="center-box">
+    <view class="main-box table-box">
+      <van-cell title="收款账户类型" center border="{{false}}">
+        <view>
+          <van-radio-group
+            value="{{ radio }}"
+            bind:change="onChange"
+            direction="horizontal"XX
+          >
+            <van-radio name="1" checked-color="#2C8E68" disabled>公户</van-radio>
+            <van-radio name="2" checked-color="#2C8E68" disabled>私户</van-radio>
+          </van-radio-group>
+        </view>
+      </van-cell>
+    </view>
+    <view class="main-box table-box xm">
+      <van-cell title="张曼玉" value="2056886342464224214" center is-link></van-cell>
+      <van-cell title="李四" value="2056886342464224214" center border="{{false}}" is-link arrow-direction	="down"></van-cell>
+      <van-cell title="收款账户" value="2056886342464224214" center border="{{false}}"></van-cell>
+      <van-cell title="开户银行" value="2056886342464224214" center border="{{false}}"></van-cell>
+      <van-cell title="收入金额" value="2056886342464224214" center border="{{false}}"></van-cell>
+      <van-cell title="所属银行" value="2056886342464224214" center border="{{false}}"></van-cell>
+    </view>
+  </view>
+
+  <view class="main-box">
+    <van-cell>
+      <!-- <view slot="icon">
+        <van-icon class-prefix="my-icon" name="extra" />
+      </view> -->
+      <view slot="title">
+        <view class="van-cell-text">附件<van-tag type="danger" style="margin-left: 10px;">可拍照</van-tag></view>
+      </view>
+      <view>
+        <view class="van-cell-text">总数<van-tag round color="#5CAE77" plain style="margin-left: 10px;">6张</van-tag></view>
+      </view>
+    </van-cell>
+    <view class="fj-box">
+      <view class="fj-li">
+        <text>
+收
+据
+        </text>
+      </view>
+      <view class="fj-li">
+        <text>
+发
+票
+        </text>
+      </view>
+      <view class="fj-li">
+        <text>
+其
+他
+        </text>
+      </view>
+    </view>
+  </view>
+
+  <view class="main-box steps-box">
+    <view class="steps-tit">审批流程</view>
+    <van-row wx:for="{{steps}}" wx:key="index">
+      <van-col span="3">
+        <view class="index">{{index+1}}</view>
+        <block wx:if="{{index==0}}">
+          <view class="indexBorder">
+            <view class="ssT" wx:if="{{index>0}}"></view>
+            <view class="yq"></view>
+            <view class="ss" wx:if="{{steps.length != index+1}}"></view>
+          </view>
+        </block>
+        <block wx:else>
+          <view class="indexBorder indexCenter">
+            <view class="ssT" wx:if="{{index>0}}"></view>
+            <view class="yq"></view>
+            <view class="ss" wx:if="{{steps.length != index+1}}"></view>
+          </view>
+        </block>
+      </van-col>
+      <van-col span="21">
+        <van-cell title="{{item.activityName}}" center="{{true}}" border="{{false}}">
+          <view class="agree" wx:if="{{item.type=='1'}}">{{ item.assigneeName }}</view>
+          <view class="in" wx:if="{{item.type=='2'}}">{{ item.assigneeName }}</view>
+          <view class="disagree" wx:if="{{item.type=='3'}}">{{ item.assigneeName }}</view>
+        </van-cell>
+
+        <van-cell center border="{{false}}">
+          <view slot="title">
+            <view style="color: #999999;">{{ item.durationInMillis }}</view>
+          </view>
+          <view style="color: #999999;font-size: 12px;">{{ item.endTime }}</view>
+        </van-cell>
+      </van-col>
+    </van-row>
+  </view>
+</view>
+
+<!-- <view class="bottom">
+  <button type="warn" plain class="btnDis">驳回</button>
+  <button type="primary" class="btnAgree">同意</button>
+</view> -->

pages/apply/paymentTemplate/see/see.wxss

@@ -0,0 +1,246 @@
+/* pages/apply/paymentTemplate/see/see.wxss */
+text{display: block;}
+.top{
+  height: 64px;
+  width: 100%;
+  position: fixed;
+  z-index: 999;
+  top:0px;
+}
+.top text{
+  position: relative;
+  top: 30px;
+  margin-right: 30px;
+  display: block;
+  color: #eee;
+  text-align: center;
+  width: 100%;
+  font-size: 16px;
+}
+.bgPage{
+  width: 140%;
+  position:absolute;
+  transform: translate(-15%, -50%);
+  height: 300px;
+  z-index: -1;
+}
+.center{
+  padding-bottom: 50px;
+}
+.main-title{
+  background-image: linear-gradient(to right, #2C8E68 , #B3DB62);
+  color: #ffffff;
+  font-size: 18px;
+  padding: 10px 0;
+  text-align: center;
+}
+.main-box{
+  background: #ffffff;
+  padding: 20px;
+  width: 94%;
+  margin: 0 auto;
+  border-radius: 10px;
+  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.16);
+}
+.main-box block{
+  float: right;
+}
+.title{
+  padding: 10px calc(3% + 20px);
+}
+.top-box{
+  margin-top: 20px;
+  margin-bottom: 28px;
+}
+.top-box text{
+  margin-bottom: 15px;
+}
+.top-box text:last-child{
+  margin-bottom: 0px;
+}
+.box-title{
+  color: #2C8E68;
+  text-align: center;
+}
+.center-box .main-box{
+  margin-bottom: 15px;
+}
+.xm van-cell:first-child .van-cell{
+  border-bottom: 1px solid #cccccc;
+  margin: 0;
+  padding-bottom: 15px!important;
+  margin-bottom: 15px;
+}
+.table-box .van-cell{
+  margin-bottom: 15px;
+}
+.table-box van-cell:last-child .van-cell{
+  margin-bottom: 0px;
+}
+.table-box view text icon{
+  display: inline-block;
+  font-size: 14px;
+  border: 1px solid red;
+  color: red;
+}
+.van-cell{
+  padding: 0!important;
+}
+@font-face {
+  font-family: 'my-icon';
+  src: url('../../../image/icon/fj_icon.png') format('truetype');
+}
+.my-icon {
+  font-family: 'my-icon';
+}
+
+.my-icon-extra::before {
+  content: '\e626';
+}
+.fj-box text{
+  background-color: #5CAE77;
+  color: #ffffff;
+  display: inline-block;
+  text-align: center;
+  border-radius: 5px;
+  white-space:pre-wrap
+}
+.fj-li{
+  margin-top: 20px;
+}
+.steps-box{
+  padding: 0;
+  margin-top: 15px;
+}
+.steps-box .van-row{
+  padding: 0 20px;
+}
+
+.steps-box view{
+  margin-bottom: 0;
+}
+
+.steps-box  .van-col{
+    position: relative;
+    height: 70px;
+  }
+  .steps-box  .van-col--21{
+    padding: 12PX 0;
+    padding-left: 10px;
+  }
+  .steps-box  .van-row:nth-child(2n){
+    background: rgba(29,111,233,0.1);
+  }
+  .steps-box  .van-cell{
+    background: transparent;
+    padding: 0 10Px;
+  }
+  .steps-box  .bq{
+    display: inline-block;
+    padding: 0PX 10PX;
+    line-height: 0.64rem;
+    border-radius: 5PX;
+  }
+  .steps-box  .index{
+    background: #1D6FE9;
+    color: #ffffff;
+    text-align: center;
+    width: 20PX;
+    height: 20PX;
+    line-height: 20PX;
+    border-radius: 50%;
+    position: absolute;
+    left: 0;
+    top: 50%;
+    transform: translate(0,-50%);
+  }
+  .steps-box  .indexCenter{
+    top: 0!important;
+  }
+  .steps-box  .van-row:first-child .van-col:first-child .indexBorder{
+    top: calc(50% - 5px);
+  }
+  .steps-box  .indexBorder{
+    width: 10PX;
+    position: absolute;
+    right: 0;
+    top: 0;
+    height: 100%;
+    
+  }
+  .steps-box  .indexBorder .yq{
+    height: 10PX;
+    width: 10PX;
+    background: #C9C9C9;
+    border-radius: 50%;
+  }
+  .steps-box  .indexBorder .ss{
+    height: calc(50% - 5PX);
+    width: 1PX;
+    background: #C9C9C9;
+    position: relative;
+    left: 4PX;
+  }
+  .steps-box .indexBorder .ssT{
+    height: calc(50% - 5PX);
+    width: 1PX;
+    background: #C9C9C9;
+    position: relative;
+    left: 4PX;
+  }
+  .agree{
+    background-color: rgba(92, 174, 119, 0.1);
+    color:#5CAE77 ;
+    width: 80%;
+    text-align: center;
+    float: right;
+  }
+  .in{
+    background-color: rgba(245, 163, 39, 0.1);
+    color:#F5A327 ;
+    width: 80%;
+    text-align: center;
+    float: right;
+  }
+  .disagree{
+    background-color: rgba(233, 0, 0, 0.1);
+    color:#E90000 ;
+    width: 80%;
+    text-align: center;
+    float: right;
+  }
+  .steps-box .van-cell__title{
+    flex: 0.7;
+  }
+  .steps-box .van-cell__value{
+    flex: 0.3;
+  }
+  .steps-tit{
+    font-size: 16px;
+    text-align: center;
+    background-color: #2C8E68;
+    color: #ffffff;
+    padding: 20px 0;
+    border-top-left-radius: 10px;
+    border-top-right-radius: 10px;
+  }
+  .bottom{
+    width: 84%;
+    margin: 0 auto;
+    text-align: center;
+    margin-top: 30px;
+    margin-bottom: 30px;
+  }
+
+  .bottom button {
+    width: 47%;
+    margin: 0 auto;
+    border-radius: 30px;
+    display: inline-block;
+  }
+
+  .bottom .btnAgree{
+    border: 1px solid transparent;
+    background-image: linear-gradient(to right, #2C8E68, #5CAE77);
+    margin-left: 6%;
+  }

pages/handle/liist.wxml

@@ -1,4 +1,8 @@
 <!--pages/handle/liist.wxml-->
+<view class="ns" style="height:{{isIPX?'88px':'64px'}};">
+  <image src="../../image/apply/back.png" style="top:{{isIPX?'54px':'30px'}};" mode="widthFix" bindtap="back"></image>
+  <text style="top:{{isIPX?'54px':'30px'}};">支出申请</text>
+</view>
 <view class="work_plan">
     <view class="menu_item active">待办</view>
     <view class="menu_item">已办</view>

project.private.config.json

@@ -45,6 +45,20 @@
           "query": "",
           "launchMode": "default",
           "scene": null
+        },
+        {
+          "name": "事项查看",
+          "pathName": "pages/apply/paymentTemplate/see/see",
+          "query": "",
+          "launchMode": "default",
+          "scene": null
+        },
+        {
+          "name": "事项新增",
+          "pathName": "pages/apply/paymentTemplate/add/add",
+          "query": "",
+          "launchMode": "default",
+          "scene": null
         }
       ]
     }