Browse Source

费用报销第一版

dev01 1 year ago
parent
commit
e3e160e9d8

+ 8 - 0
src/components/common/accountModal/index.jsx

@@ -102,9 +102,17 @@ class AccountModal extends Component {
   }
 
   openshowDrawer() {
+    Taro.showLoading({
+      title: '加载中...',
+      mask: false,
+    })
     this.setState({
       isshowDrawer: true,
     })
+    setTimeout(function () {
+      Taro.hideLoading()
+    }, 500);
+
   }
 
   closeshowDrawer() {

+ 1 - 0
src/components/common/bankModal/index.jsx

@@ -57,6 +57,7 @@ class BankModal extends Component {
             topKey='常'
             list={bankList}
             onClick={this.onClick.bind(this)}
+            animation
           >
             <View className='custom'>
               <View className="tops"></View>

+ 2 - 2
src/components/common/imagePicker/index.jsx

@@ -3,13 +3,13 @@ import Taro from '@tarojs/taro';
 import { Text, View } from "@tarojs/components";
 import { AtImagePicker, AtToast } from "taro-ui";
 
-import './index.less';
-
 import 'taro-ui/dist/style/components/image-picker.scss';
 import 'taro-ui/dist/style/components/icon.scss';
 import 'taro-ui/dist/style/components/toast.scss';
 import 'taro-ui/dist/style/components/icon.scss';
 
+import './index.less';
+
 import getBaseUrl from "../../../utils/servers/baseUrl";
 
 class ImagePicker extends Component {

+ 5 - 0
src/components/common/imagePicker/index.less

@@ -9,3 +9,8 @@
     background: rgba(0,0,0,0.6);
   }
 }
+
+
+// .at-image-picker__remove-btn {
+//   z-index: -1 !important;
+// }

BIN
src/image/bg.jpeg


+ 5 - 0
src/pages/accountFrom/index.jsx

@@ -66,6 +66,7 @@ class AccountFrom extends Component {
         let newList = list[i].postlist
         for (var j = 0; j < newList.length; j++) {
           for (var k = 0; k < toast.length; k++) {
+            var isMoney = /^(([1-9][0-9]*)|(([0]\.\d{1,2}|[1-9][0-9]*\.\d{1,2})))$/;
             if (newList[j] == toast[k].key && !data[newList[j]] && data[newList[j]] != 0) {
               Taro.showToast({
                 title: toast[k].value,
@@ -73,6 +74,10 @@ class AccountFrom extends Component {
               });
               return
             }
+            if (newList[j] == "amount" && !isMoney.test(data.amount)) {
+              Taro.showToast({ title: "请填写正确的金额", icon: "none", });
+              return
+            }
           }
         }
       }

+ 48 - 46
src/pages/drafts/index.jsx

@@ -1,6 +1,6 @@
 import React, { Component } from "react";
 import Taro, { getCurrentInstance } from "@tarojs/taro";
-import { Button, Picker, Text, View } from "@tarojs/components";
+import { Button, Picker, Text, View, Image } from "@tarojs/components";
 import dayjs from "dayjs";
 import ImagePicker from "../../components/common/imagePicker";
 import InquiryModal from "../../components/common/inquiryModal";
@@ -42,6 +42,7 @@ import "taro-ui/dist/style/components/icon.scss";
 import "taro-ui/dist/style/components/textarea.scss";
 import "taro-ui/dist/style/components/input.scss";
 
+import Right from '../../image/right.png';
 import "./index.less";
 import NewModal from "./modal"
 
@@ -511,7 +512,7 @@ class Drafts extends Component {
           <View className="inputFormItem">
             <AtInput
               name='userNames'
-              title='公出企业:'
+              title='公出企业'
               type='text'
               placeholder='请填写公出企业'
               value={data.userNames}
@@ -522,7 +523,7 @@ class Drafts extends Component {
           <View className="inputFormItem">
             <AtInput
               name='districtName'
-              title='公出地点:'
+              title='公出地点'
               type='text'
               placeholder='请填写公出地点'
               value={data.districtName}
@@ -531,7 +532,7 @@ class Drafts extends Component {
           </View>}
         {data.type == 1 &&
           <View className="formItem">
-            <View className="formName">公出时间:</View>
+            <View className="formName">公出时间</View>
             <View className="formValue">
               <View
                 className="time"
@@ -544,12 +545,12 @@ class Drafts extends Component {
                 {this.state.rangeStartMinuteVal &&
                   this.state.rangeEndMinuteVal ? (
                   <View className="timeContent">
-                    <View style={{ textAlign: "center" }}>{this.state.rangeStartMinuteVal}</View>
-                    &nbsp;&nbsp;至&nbsp;&nbsp;
-                    <View style={{ textAlign: "center" }}>{this.state.rangeEndMinuteVal}</View>
+                    <View>{this.state.rangeStartMinuteVal.slice(0, 16)}&nbsp;至&nbsp;{this.state.rangeEndMinuteVal.slice(0, 16)}</View>
+                    {/* <View>至</View>
+                    <View>{this.state.rangeEndMinuteVal}</View> */}
                   </View>
                 ) : (
-                  "请选择时间"
+                  <View className="seltime">请选择时间</View>
                 )}
               </View>
               <timePicker
@@ -584,11 +585,11 @@ class Drafts extends Component {
           </View>}
         {data.type == 1 &&
           <View className="formItem">
-            <View className="formName">公出时长:</View>
+            <View className="formName">公出时长</View>
             <View className="formValue">{this.state.totalDuration}小时</View>
           </View>}
         <View className="formItem">
-          <View className="formName">申请类型:</View>
+          <View className="formName">申请类型</View>
           <View className="formValue" onClick={() => {
             this.setState({
               isInquiryOpened: true,
@@ -607,7 +608,7 @@ class Drafts extends Component {
         </View>
         {data.type != 4 && data.type != 5 &&
           <View className="formItem">
-            <View className="formName">报销至订单:</View>
+            <View className="formName">报销至订单</View>
             <View className="formValue" onClick={() => {
               Taro.navigateTo({
                 url: "/pages/dataindex/index"
@@ -624,13 +625,13 @@ class Drafts extends Component {
           {(data.type == 4 || data.type == 5) ? "申请详细" : "报销详细"}
         </View>
         <View className="formItem">
-          <View className="formName">申请人:</View>
+          <View className="formName">申请人</View>
           <View className="formValue">{data.aname}</View>
         </View>
         {
           data.type != 4 && data.type != 5 &&
           <View className="formItem">
-            <View className="formName">报销公司:</View>
+            <View className="formName">报销公司</View>
             <View className="formValue">
               <Picker
                 value={departmentArr.findIndex(item => item.id === data.applyDep)}
@@ -652,8 +653,8 @@ class Drafts extends Component {
         <View className="formItem">
           <View className="formName">
             {data.type == 4
-              ? "预借支公司:" : data.type == 5
-                ? "抵扣公司:" : "支付公司:"}</View>
+              ? "预借支公司" : data.type == 5
+                ? "抵扣公司:" : "支付公司:"}</View>
           <View className="formValue">
             <Picker
               value={departmentArr.findIndex(item => item.id === data.payDep)}
@@ -672,7 +673,7 @@ class Drafts extends Component {
           </View>
         </View>
         <View className="formItem">
-          <View className="formName">{(data.type == 4 || data.type == 5) ? "说明:" : "报销事由:"}</View>
+          <View className="formName">{(data.type == 4 || data.type == 5) ? "说明:" : "报销事由:"}</View>
           <View className="formValues">
             <AtTextarea
               value={data.remarks == null ? "" : data.remarks}
@@ -684,7 +685,7 @@ class Drafts extends Component {
               }}
               height={75}
               maxLength={50}
-              placeholder={(data.type == 4 || data.type == 5) ? "请填写说明:" : "请填写报销事由"}
+              placeholder={(data.type == 4 || data.type == 5) ? "请填写说明" : "请填写报销事由"}
             />
           </View>
         </View>
@@ -724,40 +725,41 @@ class Drafts extends Component {
                 >删除</View>
                 {/* <View className="edit">编辑</View> */}
                 <View className="formItem">
-                  <View className="formName">交通工具:</View>
+                  <View className="formName">交通工具</View>
                   <View className="formValue">{getVehicleName(item.vehicle, item.vehicleOther)}</View>
                 </View>
                 <View className="formItem">
-                  <View className="formName">时间:</View>
+                  <View className="formName">地点:</View>
                   <View className="formValue">
-                    <View className="ftxt">{item.startTimeStr.slice(0, 16)}</View>
-                    &nbsp;&nbsp;至&nbsp;&nbsp;
-                    <View className="ftxt">{item.endTimeStr.slice(0, 16)}</View>
+                    <View className="ftxt">{item.startDistrict}</View>
+                    <Image src={Right} className='ricon' mode='aspectFit' />
+                    {/* <Text style={{ fontSize: "30px", padding: "0 5px" }}>⇀</Text> */}
+                    <View className="ftxt">{item.endDistrict}</View>
                   </View>
                 </View>
                 <View className="formItem">
-                  <View className="formName">地点:</View>
-                  <View className="formValue">
-                    <View className="ftxt">{item.startDistrict}</View>
-                    <Text style={{ fontSize: "30px", padding: "0 5px" }}>⇀</Text>
-                    <View className="ftxt">{item.endDistrict}</View>
+                  <View className="formName">时间:</View>
+                  <View className="formValuetime">
+                    <View className="ftxt">{item.startTimeStr.slice(0, 16)}</View>
+                    &nbsp;&nbsp;至&nbsp;&nbsp;
+                    <View className="ftxt">{item.endTimeStr.slice(0, 16)}</View>
                   </View>
                 </View>
                 <View className="formItem">
-                  <View className="formName">金额:</View>
+                  <View className="formName">金额</View>
                   <View className="formValue">{item.amount}(元)</View>
                 </View>
               </View>
               : <View className="inputFormItems" key={item.id}>
                 {/* <AtInput
                   name={item.id}
-                  title={getTypeName(item.type) + ":"}
+                  title={getTypeName(item.type) + ""}
                   type='number'
                   placeholder='请输入金额(元)'
                   value={item.amount}
                 /> */}
                 <View className="formItem">
-                  <View className="formName">{getTypeName(item.type) + ":"}</View>
+                  <View className="formName">{getTypeName(item.type) + ""}</View>
                   <View className="formValue">{item.amount}(元)</View>
                 </View>
                 <View className="close"
@@ -792,14 +794,14 @@ class Drafts extends Component {
               {/* <View className="edit">编辑</View> */}
               {!!item.agreeTimeStr &&
                 <View className="formItem">
-                  <View className="formName">{data.type == 5 ? "支付时间:" : "需付款时间:"}</View>
+                  <View className="formName">{data.type == 5 ? "支付时间:" : "需付款时间:"}</View>
                   <View className="formValue">{item.agreeTimeStr.slice(0, 10)}</View>
                 </View>}
               <View className="formItem">
                 <View className="formName">
                   {data.type == 4
-                    ? "预借支金额:" : data.type == 5
-                      ? "抵扣金额:" : "金额:"}
+                    ? "预借支金额" : data.type == 5
+                      ? "抵扣金额:" : "金额:"}
                 </View>
                 <View className="formValue">{item.amount}(元)</View>
               </View>
@@ -824,39 +826,39 @@ class Drafts extends Component {
               {/* <View className="edit">编辑</View> */}
               {!!item.agreeTimeStr &&
                 <View className="formItem">
-                  <View className="formName">需付款时间:</View>
+                  <View className="formName">需付款时间</View>
                   <View className="formValue">{item.agreeTimeStr.slice(0, 10)}</View>
                 </View>}
               <View className="formItem">
-                <View className="formName">付款方式:</View>
+                <View className="formName">付款方式</View>
                 <View className="formValue">{["公对公转账"][item.payType]}</View>
               </View>
               <View className="formItem">
-                <View className="formName">发票类型:</View>
+                <View className="formName">发票类型</View>
                 <View className="formValue">{["普票", "专票"][item.invoiceType]}</View>
               </View>
               <View className="formItem">
-                <View className="formName">发票号:</View>
+                <View className="formName">发票号</View>
                 <View className="formValue">{item.invoiceNo}</View>
               </View>
               <View className="formItem">
-                <View className="formName">付款单位:</View>
+                <View className="formName">付款单位</View>
                 <View className="formValue">{item.payerName}</View>
               </View>
               <View className="formItem">
-                <View className="formName">开户银行:</View>
+                <View className="formName">开户银行</View>
                 <View className="formValue">{item.openBank}</View>
               </View>
               <View className="formItem">
-                <View className="formName">银行账户:</View>
+                <View className="formName">银行账户</View>
                 <View className="formValue">{item.bankAccounts}</View>
               </View>
               <View className="formItem">
-                <View className="formName">开户行地址:</View>
+                <View className="formName">开户行地址</View>
                 <View className="formValue">{item.openBankAddress}</View>
               </View>
               <View className="formItem">
-                <View className="formName">金额(元):</View>
+                <View className="formName">金额(元)</View>
                 <View className="formValue">{item.amount}</View>
               </View>
             </View>
@@ -865,7 +867,7 @@ class Drafts extends Component {
         {
           data.type != 4 &&
           <View className="formItem">
-            <View className="formName">{data.type == 5 ? "抵扣借支:" : "抵扣:"}</View>
+            <View className="formName">{data.type == 5 ? "抵扣借支:" : "抵扣:"}</View>
             <View className="formValue"
               onClick={() => {
                 Taro.navigateTo({
@@ -885,19 +887,19 @@ class Drafts extends Component {
         {
           data.type != 4 && data.type != 5 &&
           <View className="formItem" style={{ paddingTop: "10px" }}>
-            <View className="formName">总金额:</View>
+            <View className="formName">总金额</View>
             <View className="formValue"><Text style={{ color: "red" }}>{total}</Text>(元)</View>
           </View>
         }
         {
           data.type != 4 && data.type != 5 &&
           <View className="formItem" style={{ paddingTop: "10px" }}>
-            <View className="formName">实报金额:</View>
+            <View className="formName">实报金额</View>
             <View className="formValue"><Text style={{ color: "red" }}>{this.state.reality}</Text>(元)</View>
           </View>
         }
         <View className="formItem" style={{ display: "block", paddingBottom: 0 }}>
-          <View className="formName">附件:</View>
+          <View className="formName">附件</View>
           <View
             className="formValue"
             style={{ paddingTop: "10px", textAlign: "left" }}

+ 74 - 44
src/pages/drafts/index.less

@@ -12,7 +12,7 @@
     display: flex;
     // align-items: center;
     align-items: flex-start;
-    font-size: 30px;
+    font-size: 28px;
     padding: 10px 0;
 
     .formName {
@@ -23,16 +23,16 @@
     }
 
     .formValue {
-      text-align: right;
+      // text-align: right;
       flex: 1;
       display: flex;
       flex-flow: row nowrap;
       align-items: center;
-      justify-content: flex-end;
+      // justify-content: flex-end;
 
       picker {
         flex: 1;
-        margin-left: 20px;
+        // margin-left: 20px;
       }
 
       .button {
@@ -43,18 +43,24 @@
 
       .time {
         flex: 1;
-        font-size: 30px;
+        font-size: 28px;
         // color: #bfbdbd;
 
         .timeContent {
           display: flex;
-          flex-direction: row;
-          align-items: center;
-          flex-wrap: nowrap;
+          flex-direction: column;
+          // align-items: center;
+          // flex-wrap: nowrap;
           // flex-flow: column nowrap;
           // align-items: flex-end;
           // justify-content: center;
         }
+
+        .seltime{
+          color: #333;
+          opacity: 0.3;
+        }
+
       }
 
       .formValueText {
@@ -72,21 +78,22 @@
       flex-flow: row nowrap;
 
       .at-textarea {
-        margin-left: 20px;
+        // margin-left: 20px;
       }
 
       .at-textarea__textarea {
-        font-size: 30px;
+        font-size: 28px;
       }
 
     }
 
     .formValueremarks {
+      border: 1px solid red;
       display: flex;
       flex: 1;
       // flex-wrap: wrap;
-      margin-left: 20px;
-      justify-content: flex-end;
+      // margin-left: 20px;
+      // justify-content: flex-end;
       word-break: break-all;
 
     }
@@ -119,7 +126,7 @@
     flex-flow: row nowrap;
     justify-content: space-between;
     align-items: center;
-    font-size: 30px;
+    font-size: 28px;
     color: #fff;
     background: #6190E8;
     margin: 40px auto;
@@ -145,15 +152,11 @@
   }
 
   .unItem {
+    width: 690px;
     position: relative;
-    // border-radius: 20px;
-    // background: rgba(0, 51, 255, .09);
-    // padding: 20px;
-    margin-bottom: 20px;
-
-    border-top: 1px solid rgba(0, 51, 255, .09);
-    border-bottom: 1px solid rgba(0, 51, 255, .09);
-    padding: 20px 0;
+    background: rgba(0, 51, 255, .09);
+    padding: 20px 30px;
+    margin: 15px 0 20px -30px;
 
     .edit {
       position: absolute;
@@ -170,7 +173,7 @@
     .close {
       position: absolute;
       bottom: 20px;
-      right: 20px;
+      right: 30px;
       font-size: 26px;
       background: red;
       color: #fff;
@@ -181,15 +184,12 @@
 
     .formItem {
       display: flex;
-      font-size: 30px;
+      font-size: 28px;
       padding: 10px 0;
       align-items: baseline;
 
       .formName {
-        min-width: 160px;
-        // margin-right: 16px;
         white-space: nowrap;
-        display: flex;
 
       }
 
@@ -207,12 +207,27 @@
         justify-content: flex-start;
 
         .ftxt {
-          width: 40%;
-          text-align: center;
+          font-size: 28px;
+          // width: 40%;
+          // text-align: center;
+        }
+
+        .ricon {
+          width: 100px;
+          height: 20px;
+          margin: 0 10px;
         }
 
       }
 
+      .formValuetime {
+        flex: 1;
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+
+      }
+
     }
 
 
@@ -221,8 +236,13 @@
   .inputFormItem {
     display: flex;
     align-items: center;
-    justify-content: space-between;
-    font-size: 30px;
+    // justify-content: space-between;
+    font-size: 28px;
+
+    .at-input__title {
+      width: auto;
+      margin-right: 0;
+    }
 
     .close {
       font-size: 26px;
@@ -235,7 +255,12 @@
     }
 
     .at-input input {
-      font-size: 30px;
+      font-size: 28px;
+      // text-align: right;
+    }
+
+    .at-input__input {
+      padding-right: 0;
     }
 
     .at-input {
@@ -244,13 +269,13 @@
       padding: 10px 0;
 
       .at-input__title {
-        font-size: 30px;
+        font-size: 28px;
         color: #000000;
 
       }
 
       .at-input__input {
-        font-size: 30px;
+        font-size: 28px;
 
       }
 
@@ -266,7 +291,13 @@
     display: flex;
     align-items: center;
     justify-content: space-between;
-    font-size: 30px;
+    font-size: 28px;
+    margin: 5px 0;
+
+    .formName {
+      // min-width: 160px;
+
+    }
 
     .close {
       font-size: 26px;
@@ -274,12 +305,11 @@
       color: #fff;
       padding: 10px;
       border-radius: 8px;
-      margin-right: 20px;
 
     }
 
     .at-input input {
-      font-size: 30px;
+      font-size: 28px;
     }
 
     .at-input {
@@ -288,13 +318,13 @@
       padding: 15px 0;
 
       .at-input__title {
-        font-size: 30px;
+        font-size: 28px;
         color: #000000;
 
       }
 
       .at-input__input {
-        font-size: 30px;
+        font-size: 28px;
 
       }
 
@@ -309,7 +339,7 @@
   .tips {
     color: #ff0000;
     font-size: 20px;
-    margin-left: 20px;
+    // margin-left: 20px;
 
   }
 
@@ -340,7 +370,7 @@
       flex-direction: row;
       margin-right: 16px;
       width: 172px;
-      font-size: 30px;
+      font-size: 28px;
       line-height: 1.5;
       vertical-align: middle;
       text-align: left;
@@ -353,7 +383,7 @@
   }
 
   .at-input input {
-    font-size: 30px;
+    font-size: 28px;
   }
 
   .at-input {
@@ -362,13 +392,13 @@
     padding: 15px 0;
 
     .at-input__title {
-      font-size: 30px;
+      font-size: 28px;
       color: #000000;
 
     }
 
     .at-input__input {
-      font-size: 30px;
+      font-size: 28px;
 
     }
 
@@ -390,7 +420,7 @@
       flex-direction: row;
       margin-right: 16px;
       width: 172px;
-      font-size: 30px;
+      font-size: 28px;
       line-height: 1.5;
       vertical-align: middle;
       text-align: left;

+ 5 - 0
src/pages/drafts/modal.jsx

@@ -108,6 +108,11 @@ class Modal extends Component {
       Taro.showToast({ title: "请填写报销金额", icon: "none", });
       return
     }
+    var isMoney = /^(([1-9][0-9]*)|(([0]\.\d{1,2}|[1-9][0-9]*\.\d{1,2})))$/;
+    if(!isMoney.test(data.amount)){
+      Taro.showToast({ title: "请填写正确的报销金额", icon: "none", });
+      return
+    }
     if (type == 1) {
       data.startTime = this.state.rangeStartMinuteVal
       data.endTime = this.state.rangeEndMinuteVal

+ 40 - 46
src/pages/draftsdetail/index.jsx

@@ -167,37 +167,31 @@ class Drafts extends Component {
     const { data, list, total, bankData, attachmentUrl } = this.state
     const icon = {
       width: '50px',
-      height: '20px'
+      height: '10px',
+      margin: '0 10px',
     }
     return (
       <View className="subform">
         <View className="title">{getAccountName(data.type, data.typeOther)}</View>
         {data.type == 1 &&
           <View className="formItem">
-            <View className="formName" style={{ width: "86px" }}>公出企业:</View>
-            <View className="formValues">{data.userNames}</View>
+            <View className="formName" >公出企业:</View>
+            <View className="formValue">{data.userNames}</View>
           </View>}
         {data.type == 1 &&
           <View className="formItem">
-            <View className="formName" style={{ width: "86px" }}>公出地点:</View>
-            <View className="formValues">{data.districtName}</View>
+            <View className="formName" >公出地点:</View>
+            <View className="formValue">{data.districtName}</View>
           </View>}
         {data.type == 1 &&
           <View className="formItem">
-            <View className="formName">公出时间:</View>
+            <View className="formName">公出时间</View>
             <View className="formValue">
               <View
                 className="time"
-                onClick={() => {
-                  this.setState({
-                    isPickerRender: true,
-                  });
-                }}
               >
                 <View className="timeContent">
-                  <View style={{ textAlign: "center" }}>{this.state.rangeStartMinuteVal}</View>
-                  &nbsp;&nbsp;至&nbsp;&nbsp;
-                  <View style={{ textAlign: "center" }}>{this.state.rangeEndMinuteVal}</View>
+                  <View>{this.state.rangeStartMinuteVal.slice(0, 16)}&nbsp;至&nbsp;{this.state.rangeEndMinuteVal.slice(0, 16)}</View>
                 </View>
               </View>
 
@@ -205,16 +199,16 @@ class Drafts extends Component {
           </View>}
         {data.type == 1 &&
           <View className="formItem">
-            <View className="formName">公出时长:</View>
+            <View className="formName">公出时长</View>
             <View className="formValue">{this.state.totalDuration}小时</View>
           </View>}
         <View className="formItem">
-          <View className="formName">申请类型:</View>
+          <View className="formName">申请类型</View>
           <View className="formValue">{getAccountName(data.type, data.typeOther)}</View>
         </View>
         {data.type != 4 && data.type != 5 &&
           <View className="formItem">
-            <View className="formName">报销至订单:</View>
+            <View className="formName">报销至订单</View>
             <View className="formValue">
               <View>
                 <View>{data.buyerName}</View>
@@ -226,26 +220,26 @@ class Drafts extends Component {
           {(data.type == 4 || data.type == 5) ? "申请详细" : "报销详细"}
         </View>
         <View className="formItem">
-          <View className="formName">申请人:</View>
+          <View className="formName">申请人</View>
           <View className="formValue">{data.aname}</View>
         </View>
         {
           data.type != 4 && data.type != 5 &&
           <View className="formItem">
-            <View className="formName">报销公司:</View>
+            <View className="formName">报销公司</View>
             <View className="formValue">{data.appDepName}</View>
           </View>
         }
         <View className="formItem">
           <View className="formName">
             {data.type == 4
-              ? "预借支公司:" : data.type == 5
-                ? "抵扣公司:" : "支付公司:"}
+              ? "预借支公司" : data.type == 5
+                ? "抵扣公司:" : "支付公司:"}
           </View>
           <View className="formValue">{data.payDepName}</View>
         </View>
         <View className="formItem">
-          <View className="formName">{(data.type == 4 || data.type == 5) ? "说明:" : "报销事由:"}</View>
+          <View className="formName">{(data.type == 4 || data.type == 5) ? "说明:" : "报销事由:"}</View>
           <View className="formValueremarks">{data.remarks}</View>
         </View>
         <View className="formTitle">
@@ -257,19 +251,19 @@ class Drafts extends Component {
             item.type == 1
               ? <View className="unItem" key={item.id}>
                 <View className="formItem">
-                  <View className="formName">交通工具:</View>
+                  <View className="formName">交通工具</View>
                   <View className="formValue">{getVehicleName(item.vehicle, item.vehicleOther)}&nbsp;</View>
                 </View>
                 <View className="formItem">
-                  <View className="formName">时间:</View>
+                  <View className="formName">时间</View>
                   <View className="formValue">
-                    <View className="ftxt">{item.startTimeStr.slice(0, 16)}</View>
-                    <View style={{ width: "50px", textAlign: "center" }}>至</View>
-                    <View className="ftxt">{item.endTimeStr.slice(0, 16)}</View>
+                    <View className="ftxt">{item.startTimeStr.slice(0, 16)}&nbsp;至&nbsp;{item.endTimeStr.slice(0, 16)}</View>
+                    {/* <View style={{ width: "50px", textAlign: "center" }}>至</View>
+                    <View className="ftxt">{item.endTimeStr.slice(0, 16)}</View> */}
                   </View>
                 </View>
                 <View className="formItem">
-                  <View className="formName">地点:</View>
+                  <View className="formName">地点</View>
                   <View className="formValue">
                     <View className="ftxt">{item.startDistrict}</View>
                     {/* <View style={{ width: "34px", textAlign: "center" }}>⇀</View> */}
@@ -278,12 +272,12 @@ class Drafts extends Component {
                   </View>
                 </View>
                 <View className="formItem">
-                  <View className="formName">金额:</View>
+                  <View className="formName">金额</View>
                   <View className="formValue">{item.amount}(元)</View>
                 </View>
               </View>
               : <View className="formItem" key={item.id}>
-                <View className="formName" style={{ width: "86px" }}>{getTypeName(item.type) + ":"}</View>
+                <View className="formName" >{getTypeName(item.type) + ":"}</View>
                 <View className="formValue">{item.amount}(元)</View>
               </View>
           )
@@ -294,14 +288,14 @@ class Drafts extends Component {
             <View className="unItem" key={item.id}>
               {!!item.agreeTimeStr &&
                 <View className="formItem">
-                  <View className="formName">{data.type == 5 ? "支付时间:" : "需付款时间:"}</View>
+                  <View className="formName">{data.type == 5 ? "支付时间:" : "需付款时间:"}</View>
                   <View className="formValue">{item.agreeTimeStr.slice(0, 10)}</View>
                 </View>}
               <View className="formItem">
                 <View className="formName">
                   {data.type == 4
-                    ? "预借支金额:" : data.type == 5
-                      ? "抵扣金额:" : "金额:"}
+                    ? "预借支金额" : data.type == 5
+                      ? "抵扣金额:" : "金额:"}
                 </View>
                 <View className="formValue">{item.amount}(元)</View>
               </View>
@@ -314,39 +308,39 @@ class Drafts extends Component {
             <View className="unItem" key={item.id}>
               {!!item.agreeTimeStr &&
                 <View className="formItem">
-                  <View className="formName">需付款时间:</View>
+                  <View className="formName">需付款时间</View>
                   <View className="formValue">{item.agreeTimeStr.slice(0, 10)}</View>
                 </View>}
               <View className="formItem">
-                <View className="formName">付款方式:</View>
+                <View className="formName">付款方式</View>
                 <View className="formValue">{["公对公转账"][item.payType]}</View>
               </View>
               <View className="formItem">
-                <View className="formName">发票类型:</View>
+                <View className="formName">发票类型</View>
                 <View className="formValue">{["普票", "专票"][item.invoiceType]}</View>
               </View>
               <View className="formItem">
-                <View className="formName">发票号:</View>
+                <View className="formName">发票号</View>
                 <View className="formValue">{item.invoiceNo}</View>
               </View>
               <View className="formItem">
-                <View className="formName">付款单位:</View>
+                <View className="formName">付款单位</View>
                 <View className="formValue">{item.payerName}</View>
               </View>
               <View className="formItem">
-                <View className="formName">开户银行:</View>
+                <View className="formName">开户银行</View>
                 <View className="formValue">{item.openBank}</View>
               </View>
               <View className="formItem">
-                <View className="formName">银行账户:</View>
+                <View className="formName">银行账户</View>
                 <View className="formValue">{item.bankAccounts}</View>
               </View>
               <View className="formItem">
-                <View className="formName">开户行地址:</View>
+                <View className="formName">开户行地址</View>
                 <View className="formValue">{item.openBankAddress}</View>
               </View>
               <View className="formItem">
-                <View className="formName">金额:</View>
+                <View className="formName">金额</View>
                 <View className="formValue">{item.amount}(元)</View>
               </View>
             </View>
@@ -355,28 +349,28 @@ class Drafts extends Component {
         {
           data.type != 4 && data.debitTotalAmount &&
           <View className="formItem">
-            <View className="formName">预借支:</View>
+            <View className="formName">预借支</View>
             <View className="formValue"><Text style={{ color: "red" }}>{data.debitTotalAmount}</Text>(元)</View>
           </View>
         }
         {
           data.type != 4 && data.type != 5 &&
           <View className="formItem">
-            <View className="formName">总金额:</View>
+            <View className="formName">总金额</View>
             <View className="formValue"><Text style={{ color: "red" }}>{total}</Text>(元)</View>
           </View>
         }
         {
           data.type != 4 && data.type != 5 &&
           <View className="formItem">
-            <View className="formName">实报金额:</View>
+            <View className="formName">实报金额</View>
             <View className="formValue"><Text style={{ color: "red" }}>
               {(total > data.debitTotalAmount) ? commonAdd(total, -data.debitTotalAmount) : 0}
             </Text>(元)</View>
           </View>
         }
         <View className="formItem" style={{ display: "block", paddingBottom: 0 }}>
-          <View className="formName">附件:</View>
+          <View className="formName">附件</View>
           <View
             className="formValue"
             style={{ paddingTop: "10px", textAlign: "left" }}

+ 31 - 56
src/pages/draftsdetail/index.less

@@ -12,7 +12,7 @@
     display: flex;
     // align-items: center;
     align-items: flex-start;
-    font-size: 30px;
+    font-size: 28px;
     padding: 10px 0;
 
     .formName {
@@ -23,12 +23,12 @@
     }
 
     .formValue {
-      text-align: right;
+      // text-align: right;
       flex: 1;
       display: flex;
       flex-flow: row nowrap;
       align-items: center;
-      justify-content: flex-end;
+      // justify-content: flex-end;
 
       picker {
         flex: 1;
@@ -43,7 +43,7 @@
 
       .time {
         flex: 1;
-        font-size: 30px;
+        font-size: 28px;
         // color: #bfbdbd;
 
         .timeContent {
@@ -51,6 +51,7 @@
           flex-direction: row;
           align-items: center;
           flex-wrap: nowrap;
+          // justify-content: flex-end;
           // flex-flow: column nowrap;
           // align-items: flex-end;
           // justify-content: center;
@@ -76,7 +77,7 @@
       }
 
       .at-textarea__textarea {
-        font-size: 30px;
+        font-size: 28px;
       }
 
     }
@@ -85,8 +86,8 @@
       display: flex;
       flex: 1;
       // flex-wrap: wrap;
-      margin-left: 20px;
-      justify-content: flex-end;
+      // margin-left: 20px;
+      // justify-content: flex-end;
       word-break: break-all;
 
     }
@@ -119,7 +120,7 @@
     flex-flow: row nowrap;
     justify-content: space-between;
     align-items: center;
-    font-size: 30px;
+    font-size: 28px;
     color: #fff;
     background: #6190E8;
     margin: 40px auto;
@@ -145,47 +146,21 @@
   }
 
   .unItem {
+    width: 690px;
     position: relative;
-    // border-radius: 20px;
-    // background: rgba(0, 51, 255, .09);
-    // padding: 20px;
-    margin-bottom: 20px;
-    border-top: 1px solid rgba(0, 51, 255, .09);
-    border-bottom: 1px solid rgba(0, 51, 255, .09);
-    padding: 20px 0;
+    background: rgba(0, 51, 255, .09);
+    padding: 20px 30px;
+    margin: 15px 0 20px -30px;
 
-    .edit {
-      position: absolute;
-      top: 20px;
-      right: 20px;
-      font-size: 26px;
-      background: rgb(97, 144, 232);
-      color: #fff;
-      padding: 10px;
-      border-radius: 8px;
-
-    }
-
-    .close {
-      position: absolute;
-      bottom: 20px;
-      right: 20px;
-      font-size: 26px;
-      background: red;
-      color: #fff;
-      padding: 10px;
-      border-radius: 8px;
-
-    }
 
     .formItem {
       display: flex;
-      font-size: 30px;
+      font-size: 28px;
       padding: 10px 0;
       align-items: baseline;
 
       .formName {
-        min-width: 150px;
+        // min-width: 150px;
         // margin-right: 16px;
         white-space: nowrap;
         display: flex;
@@ -203,11 +178,11 @@
         display: flex;
         flex-flow: row nowrap;
         align-items: center;
-        justify-content: flex-end;
+        // justify-content: flex-end;
 
         .ftxt {
-          width: 40%;
-          text-align: center;
+          // width: 40%;
+          text-align: right;
         }
 
       }
@@ -221,7 +196,7 @@
     display: flex;
     align-items: center;
     justify-content: space-between;
-    font-size: 30px;
+    font-size: 28px;
 
     .close {
       font-size: 26px;
@@ -234,7 +209,7 @@
     }
 
     .at-input input {
-      font-size: 30px;
+      font-size: 28px;
     }
 
     .at-input {
@@ -243,13 +218,13 @@
       padding: 10px 0;
 
       .at-input__title {
-        font-size: 30px;
+        font-size: 28px;
         color: #000000;
 
       }
 
       .at-input__input {
-        font-size: 30px;
+        font-size: 28px;
 
       }
 
@@ -265,7 +240,7 @@
     display: flex;
     align-items: center;
     justify-content: space-between;
-    font-size: 30px;
+    font-size: 28px;
 
     .close {
       font-size: 26px;
@@ -278,7 +253,7 @@
     }
 
     .at-input input {
-      font-size: 30px;
+      font-size: 28px;
     }
 
     .at-input {
@@ -287,13 +262,13 @@
       padding: 15px 0;
 
       .at-input__title {
-        font-size: 30px;
+        font-size: 28px;
         color: #000000;
 
       }
 
       .at-input__input {
-        font-size: 30px;
+        font-size: 28px;
 
       }
 
@@ -339,7 +314,7 @@
       flex-direction: row;
       margin-right: 16px;
       width: 172px;
-      font-size: 30px;
+      font-size: 28px;
       line-height: 1.5;
       vertical-align: middle;
       text-align: left;
@@ -352,7 +327,7 @@
   }
 
   .at-input input {
-    font-size: 30px;
+    font-size: 28px;
   }
 
   .at-input {
@@ -361,13 +336,13 @@
     padding: 15px 0;
 
     .at-input__title {
-      font-size: 30px;
+      font-size: 28px;
       color: #000000;
 
     }
 
     .at-input__input {
-      font-size: 30px;
+      font-size: 28px;
 
     }
 
@@ -389,7 +364,7 @@
       flex-direction: row;
       margin-right: 16px;
       width: 172px;
-      font-size: 30px;
+      font-size: 28px;
       line-height: 1.5;
       vertical-align: middle;
       text-align: left;

+ 16 - 0
src/pages/mybusiness/index.less

@@ -325,3 +325,19 @@
   right: -31px;
   bottom: 60px;
 }
+
+.nopunchClock{
+  font-size: 24px;
+  position: absolute;
+  border-bottom-left-radius: 100px;
+  border-top-left-radius: 100px;
+  padding: 20px;
+  background: rgba(0, 128, 0, 1);
+  opacity: 0.3;
+  color: white;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  right: -31px;
+  bottom: 60px;
+}

+ 8 - 0
src/pages/mybusiness/list.jsx

@@ -56,6 +56,14 @@ class List extends Component {
                   开始时间:{v.releaseStarts}
                 </View>
                 {
+                  v.status == 1 &&
+                  <View
+                    className="nopunchClock"
+                  >
+                    发起报销
+                  </View>
+                }
+                {
                   v.status == 2 &&
                   <View
                     className="punchClock"