invoiceEndit.vue 6.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239
  1. <template>
  2. <view class="">
  3. <!-- <view class="top" v-if="index==0">
  4. <view class="" style="width: 40%;">
  5. 开票金额共
  6. </view>
  7. <view class="">
  8. ¥2538
  9. </view>
  10. </view> -->
  11. <view class="form" >
  12. <u--form labelPosition="left" :model="model1" ref="form1">
  13. <view class="">
  14. 抬头类型
  15. </view>
  16. <view class="btn">
  17. <view :class="model1.userInfo.type==2?'btn-item-active':'btn-item'" @click="model1.userInfo.type=2">企业</view>
  18. <view :class="model1.userInfo.type==1?'btn-item-active':'btn-item'" @click="model1.userInfo.type=1">个人</view>
  19. </view>
  20. <u-form-item label="发票抬头" prop="userInfo.name" borderBottom ref="item1" labelWidth="160rpx">
  21. <u--input v-model="model1.userInfo.name" disabledColor="#ffffff" :placeholder="model1.userInfo.type==2?'请输入公司名称':'请输入个人姓名'" border="none" placeholderStyle="color: #555555"></u--input>
  22. </u-form-item>
  23. <view class="" v-if="model1.userInfo.type==2">
  24. <u-form-item label="纳税税号" prop="userInfo.tax_no" borderBottom ref="item1" labelWidth="160rpx">
  25. <u--input v-model="model1.userInfo.tax_no" disabledColor="#ffffff" placeholder="请输入税号" border="none" placeholderStyle="color: #555555"></u--input>
  26. </u-form-item>
  27. <u-form-item label="注册地址" prop="userInfo.address" borderBottom ref="item1" labelWidth="160rpx">
  28. <u--input v-model="model1.userInfo.address" disabledColor="#ffffff" placeholder="请输入注册地址" border="none" placeholderStyle="color: #555555"></u--input>
  29. </u-form-item>
  30. <u-form-item label="电话" prop="userInfo.phone" borderBottom ref="item1" labelWidth="160rpx">
  31. <u--input v-model="model1.userInfo.phone" disabledColor="#ffffff" placeholder="请输入电话" border="none" placeholderStyle="color: #555555"></u--input>
  32. </u-form-item>
  33. <u-form-item label="开户银行" prop="userInfo.bank_name" borderBottom ref="item1" labelWidth="160rpx">
  34. <u--input v-model="model1.userInfo.bank_name" disabledColor="#ffffff" placeholder="请输入开户银行" border="none" placeholderStyle="color: #555555"></u--input>
  35. </u-form-item>
  36. <u-form-item label="银行账号" prop="userInfo.bank_no" borderBottom ref="item1" labelWidth="160rpx">
  37. <u--input v-model="model1.userInfo.bank_no" disabledColor="#ffffff" placeholder="请输入银行账号" border="none" placeholderStyle="color: #555555"></u--input>
  38. </u-form-item>
  39. </view>
  40. <!-- <u-form-item v-if="index==0" label="发送邮箱" prop="userInfo.idcard" borderBottom ref="item1" labelWidth="160rpx">
  41. <u--input v-model="model1.userInfo.idcard" disabledColor="#ffffff" placeholder="输入接收邮箱" placeholderStyle="color: #555555" border="none" ></u--input>
  42. </u-form-item> -->
  43. <view class="" style="margin: 30rpx 0;">
  44. 备注信息(选填)
  45. </view>
  46. <u--textarea v-model="model1.userInfo.memo" placeholder="输入备注信息" placeholderStyle="color: #555555" height=120 border="none"></u--textarea>
  47. </u--form>
  48. </view>
  49. <view class="tips">
  50. <u-icon name="error-circle" color="##999999 " size="28"></u-icon>
  51. <view class="" style="margin-left:18rpx;">
  52. 如果购买方为企业,有税号XXX
  53. </view>
  54. </view>
  55. <view class="" style="margin-bottom: 164rpx;"></view>
  56. <view v-if="state==0" class="navbar" @click="editsubmit">
  57. 保存
  58. </view>
  59. <view v-if="state==1" class="navbar" @click="submit">
  60. 添加抬头
  61. </view>
  62. </view>
  63. </template>
  64. <script>
  65. export default{
  66. data(){
  67. return{
  68. // 编辑与添加状态 0保存 1添加
  69. state:0,
  70. showSex:false,
  71. model1: {
  72. userInfo: {
  73. name:'',
  74. tax_no: '',
  75. address:'',
  76. phone:'',
  77. bank_name:"",
  78. bank_no:'',
  79. type: 2,
  80. memo:"",
  81. },
  82. },
  83. index:1
  84. }
  85. },
  86. onLoad(options) {
  87. this.state=options.state
  88. let info=JSON.parse(options.info)
  89. if(info.type=="个人"){
  90. info.type=1
  91. }else if(info.type=="企业"){
  92. info.type=2
  93. }
  94. this.model1.userInfo=info
  95. // id=0 申请发票跳转 index=0
  96. // id=1 抬头管理跳转 index=1
  97. // if(options.id==0){
  98. // this.index=0
  99. // }else if(options.id==1){
  100. // this.index=1
  101. // }
  102. },
  103. methods:{
  104. // 修改
  105. editsubmit(){
  106. let form=this.model1.userInfo
  107. console.log(form,"<=================修改")
  108. uni.$u.http.post('/api/invoice/edit',form,{
  109. custom: {
  110. auth: true
  111. }
  112. }).then((res) => {
  113. console.log(res)
  114. uni.showToast({
  115. icon:"success",
  116. title:"修改成功",
  117. })
  118. setTimeout(()=>{
  119. uni.navigateBack({
  120. delta:1
  121. })
  122. },1500)
  123. }).catch((err) => {
  124. console.log(err)
  125. })
  126. },
  127. // 添加抬头
  128. submit(){
  129. let form=this.model1.userInfo
  130. console.log(form)
  131. uni.$u.http.post('/api/invoice/add',form,{
  132. custom: {
  133. auth: true
  134. }
  135. }).then((res) => {
  136. console.log(res)
  137. uni.showToast({
  138. icon:"success",
  139. title:"添加成功",
  140. })
  141. setTimeout(()=>{
  142. uni.navigateBack({
  143. delta:1
  144. })
  145. },1500)
  146. }).catch((err) => {
  147. console.log(err)
  148. })
  149. }
  150. },
  151. }
  152. </script>
  153. <style lang="less">
  154. .u-form-item__body.data-v-5e7216f1{
  155. padding: 30rpx 0 !important;
  156. }
  157. .u-textarea.data-v-81cd9d32{
  158. background-color:#F4F4F4 !important;
  159. border-radius: 0px 32rpx 8rpx 32rpx !important;
  160. }
  161. page{
  162. background-color: #F4F4F4;
  163. font-size: 30rpx;
  164. }
  165. .top{
  166. background: #FFFFFF;
  167. border-radius: 8rpx 32rpx 8rpx 8rpx;
  168. margin: 30rpx;
  169. padding: 40rpx;
  170. display: flex;
  171. }
  172. .form{
  173. background-color: #fff;
  174. padding: 30rpx;
  175. margin: 30rpx;
  176. border-radius: 8rpx 32rpx 8rpx 32rpx;
  177. }
  178. .btn{
  179. display: flex;
  180. border-bottom: 1rpx solid #E3E3E3;
  181. padding: 30rpx 0;
  182. .btn-item{
  183. text-align: center;
  184. line-height: 60rpx;
  185. width: 176rpx;
  186. height: 60rpx;
  187. background: #F4F4F4;
  188. border-radius: 30rpx;
  189. margin:0 10rpx;
  190. }
  191. .btn-item-active{
  192. text-align: center;
  193. line-height: 58rpx;
  194. width: 174rpx;
  195. height: 58rpx;
  196. background: rgba(30, 159, 106, 0.1);
  197. border-radius: 30rpx;
  198. border: 1px solid #1E9F6A;
  199. color: #1E9F6A;
  200. margin:0 10rpx;
  201. }
  202. }
  203. .email{
  204. background-color: #fff;
  205. margin: 20rpx 0;
  206. padding: 20rpx;
  207. }
  208. .tips{
  209. display: flex;
  210. align-items: center;
  211. padding:0 30rpx;
  212. color: #999999;
  213. font-size: 26rpx;
  214. }
  215. .navbar{
  216. padding: 30rpx 0;
  217. text-align: center;
  218. background:#1E9F6A ;
  219. color: #fff;
  220. bottom: 0;
  221. margin: 0 auto;
  222. left: 0;
  223. position: fixed;
  224. width: 100%;
  225. border-radius: 16rpx 16rpx 0px 0px;
  226. }
  227. </style>