Skip to content

肖康 / H5_2.0

Go to a project
Commit 43b76cce by LJM
Options

发票

parent 49e40f44
Inline Side-by-side
Showing with 308 additions and 54 deletions
assets/css/mine/invoice.scss
......@@ -150,7 +150,7 @@
}
.page-userAddress-add {
padding: 180rpx 24rpx 100rpx 24rpx;
padding: 180rpx 24rpx 150rpx 24rpx;
.tip {
margin-top: 16rpx;
margin-bottom: 16rpx;
......@@ -166,13 +166,11 @@
.text {
margin-left: 16rpx;
.t1 {
max-width: 560rpx;
text-align: justify;
font-size: 22rpx;
color: #f98119;
}
.t2 {
font-size: 22rpx;
color: #1969f9;
}
}
}
.tab {
......
pages/mine/invoice.vue
......@@ -22,16 +22,24 @@
</view>
<view class="p3">{{ item.consignee_province_val }}{{ item.consignee_city_val }}{{ item.consignee_district_val }}{{ item.consignee_address }}</view>
<view class="operate row bothSide verCenter">
<view class="row verCenter">
<view class="default"></view>
<text class="default-text">设为默认</text>
</view>
<template v-if="item.is_default == 1">
<view class="row verCenter default-curr">
<view class="default"></view>
<text class="default-text">默认发票</text>
</view>
</template>
<template v-else>
<view class="row verCenter" @click="setdefault(item.tax_id)">
<view class="default"></view>
<text class="default-text">设为默认</text>
</view>
</template>
<view class="row verCenter">
<navigator class="edit row verCenter" url="/user/invoiceEdit" hover-class="none">
<text class="iconfont icon-bjt"></text>
<text class="tt">编辑</text>
</navigator>
<view class="delete row verCenter">
<view class="delete row verCenter" @click="deleteInvoice(item.tax_id)">
<text class="iconfont icon-del"></text>
<text class="tt">删除</text>
</view>
......@@ -69,6 +77,53 @@ export default {
this.getData();
},
methods: {
/**
* 删除发票
*/
deleteInvoice(tax_id) {
uni.showModal({
title: '',
content: '您确定删除该发票嘛',
success: res => {
if (res.confirm) {
this.request(Api_Url + '/invoice/delete', 'POST', { tax_id: tax_id }, true, true).then(res => {
if (res.err_code === 0) {
uni.showToast({
title: '删除成功',
icon: 'success'
});
setTimeout(() => {
this.getData();
}, 2000);
} else {
uni.showToast({
title: res.err_msg,
icon: 'none'
});
}
});
} else if (res.cancel) {
console.log('用户点击取消');
}
}
});
},
/**
* 设置默认地址
* @param {Object} tax_id
*/
setdefault(tax_id) {
this.request(Api_Url + '/invoice/setdefault', 'POST', { tax_id: tax_id }, true, true).then(res => {
if (res.err_code === 0) {
this.getData();
} else {
uni.showToast({
title: res.err_msg,
icon: 'none'
});
}
});
},
getData() {
this.request(Api_Url + '/invoice/lists', 'POST', {}, true, true).then(res => {
if (res.err_code === 0) {
......
pages/mine/invoiceAdd.vue
......@@ -2,48 +2,122 @@
<view class="page-userAddress-add">
<navElement title="新增发票"></navElement>
<view class="tab row avarage verCenter">
<view class="box row rowCenter verCenter" @click="tab(index)" :class="{ curr: index == curr }" :key="index" v-for="(item, index) in text_arr">{{ item }}</view>
<view class="box row rowCenter verCenter" @click="tab(index, 1)" :class="{ curr: index == curr }" :key="index" v-for="(item, index) in text_arr">{{ item }}</view>
</view>
<view class="tip row">
<text class="iconfont icon-ts"></text>
<view class="text column">
<text class="t1">1.自营商品的增值税普通发票，将随货一起快递给您；</text>
<text class="t1">2.默认使用收货地址，您也可以自行修改。</text>
<template v-if="curr == 0">
<text class="t1">1.自营商品的增值税普通发票，将随货一起快递给您；</text>
<text class="t1">2.默认使用收货地址，您也可以自行修改。</text>
</template>
<template v-else-if="curr == 1">
<text class="t1">1、自营商品单笔订单额大于200元，立即申请开票；单笔订单小于200元，统一每月10号开票；</text>
<text class="t1">2、联营商品月消费额最低满1000元，统一开具发票，如未满1000元，则顺延至下月。</text>
</template>
</view>
</view>
<view class="invoice-form">
<view class="label-box"><text class="t1">开票信息</text></view>
<view class="tab-type row bothSide verCenter">
<view class="box curr row rowCenter verCenter">公司</view>
<view class="box row rowCenter verCenter">个人</view>
</view>
<view class="input-box">
<view class="input-label">
<text class="required">*</text>
<text class="tt">开票公司名称：</text>
<!--增值税普通发票-->
<template v-if="curr == 0">
<view class="invoice-form">
<view class="label-box"><text class="t1">开票信息</text></view>
<view class="tab-type row bothSide verCenter">
<view class="box row rowCenter verCenter" @click="tab(index, 2)" :class="{ curr: index == taxIndex }" :key="index" v-for="(item, index) in taxType">{{ item }}</view>
</view>
<view><input type="text" placeholder="请输入开票公司名称" class="uni-input" /></view>
<!-- 公司 -->
<template v-if="taxIndex == 0">
<view class="input-box">
<view class="input-label">
<text class="required">*</text>
<text class="tt">开票公司名称：</text>
</view>
<view><input type="text" placeholder="请输入开票公司名称" class="uni-input" v-model="formParams.tax_title" /></view>
</view>
<view class="input-box" style="margin-bottom: 0;">
<view class="input-label">
<text class="required">*</text>
<text class="tt">税务登记号：</text>
</view>
<view><input type="text" placeholder="请输入税务登记号" class="uni-input" v-model="formParams.tax_no" /></view>
</view>
</template>
<!-- 个人 -->
<template v-else-if="taxIndex == 1">
<view class="input-box">
<view class="input-label">
<text class="required">*</text>
<text class="tt">开票人名称：</text>
</view>
<view><input type="text" placeholder="请输入开票人名称" class="uni-input" v-model="formParams.tax_title" /></view>
</view>
</template>
</view>
<view class="input-box" style="margin-bottom: 0;">
<view class="input-label">
<text class="required">*</text>
<text class="tt">税务登记号：</text>
</template>
<!--增值税专用发票-->
<template v-else-if="curr == 1">
<view class="invoice-form">
<view class="input-box">
<view class="input-label">
<text class="required">*</text>
<text class="tt">开票公司名称：</text>
</view>
<view><input type="text" placeholder="请输入开票公司名称" class="uni-input" v-model="formParams.tax_title" /></view>
</view>
<view class="input-box">
<view class="input-label">
<text class="required">*</text>
<text class="tt">公司注册地址：</text>
</view>
<view><input type="text" placeholder="请输入注册地址" class="uni-input" v-model="formParams.company_address" /></view>
</view>
<view class="input-box">
<view class="input-label">
<text class="required">*</text>
<text class="tt">公司电话：</text>
</view>
<view><input type="text" placeholder="请输入电话号码" class="uni-input" v-model="formParams.company_phone" /></view>
</view>
<view class="input-box">
<view class="input-label">
<text class="required">*</text>
<text class="tt">纳税人识别号：</text>
</view>
<view><input type="text" placeholder="请输入纳税人识别号" class="uni-input" v-model="formParams.tax_no" /></view>
</view>
<view class="input-box">
<view class="input-label">
<text class="required">*</text>
<text class="tt">开户银行：</text>
</view>
<view><input type="text" placeholder="请输入开户银行" class="uni-input" v-model="formParams.bank_name" /></view>
</view>
<view class="input-box">
<view class="input-label">
<text class="required">*</text>
<text class="tt">银行账号：</text>
</view>
<view><input type="text" placeholder="请输入开户银行账号" class="uni-input" v-model="formParams.bank_account" /></view>
</view>
<view><input type="text" placeholder="请输入税务登记号" class="uni-input" /></view>
</view>
</view>
</template>
<view class="setting-default row verCenter bothSide">
<text class="tt">设为默认发票</text>
<view><switch checked style="transform:scale(0.7)" /></view>
<view><switch @change="onSwitchChange" checked style="transform:scale(0.7)" /></view>
</view>
<view class="info-title row bothSide verCenter">
<!-- 收票信息 -->
<view class="info-title row bothSide verCenter" @click="toggle = !toggle">
<text class="info-title-t1">展开收票信息（非必填）</text>
<text class="iconfont icon-arrtop"></text>
<template v-if="toggle">
<text class="iconfont icon-arrtop"></text>
</template>
<template v-else>
<text class="iconfont icon-arrbot"></text>
</template>
</view>
<view class="form-box">
<view class="form-box" v-if="toggle">
<view class="input-box input row verCenter">
<text class="tt">收货人</text>
<input type="text" placeholder="请输入收货人" class="uni-input" />
<input type="text" placeholder="请输入收货人" class="uni-input" v-model="formParams.consignee" />
</view>
<view class="input-box input row verCenter">
<text class="tt">手机号码</text>
......@@ -53,18 +127,15 @@
<view class="iconfont icon-arrbot"></view>
</view>
</picker>
<input type="number" placeholder="请输入手机号" class="uni-input" style="margin-left: 24rpx;" />
<input type="number" placeholder="请输入手机号" class="uni-input" style="margin-left: 24rpx;" v-model="formParams.consignee_phone" />
</view>
<view class="input-box input row verCenter">
<text class="tt">所在地区</text>
<picker @change="bindPickerChange" :value="index" :range="array" class="area">
<view class="row verCenter bothSide">
<view class="uni-input">省、市、区</view>
<view class="iconfont icon-arrbot"></view>
</view>
<picker mode="multiSelector" @change="pickerChange" @columnchange="bindMultiPickerColumnChange" :value="multiIndex" :range="multiArray" :range-key="'name'">
<view>{{ selectText }}</view>
</picker>
</view>
<view class="input-box textarea row verCenter"><textarea placeholder="请输入详细街道地址"></textarea></view>
<view class="input-box textarea row verCenter"><textarea placeholder="请输入详细街道地址" v-model="formParams.consignee_address"></textarea></view>
</view>
<view class="btn row verCenter">
<view class="btn1 row rowCenter verCenter"><text class="text">保存</text></view>
......@@ -84,22 +155,148 @@ export default {
return {
index: 0,
array: ['0086', '00886', '00853', '00852'],
formParams: {
intl_code: '86'
},
curr: 0,
text_arr: ['增值税普通发票', '增值税专用发票']
text_arr: ['增值税普通发票', '增值税专用发票'],
taxIndex: 0,
taxType: ['公司', '个人'],
toggle: false,
multiArray: [[], [], []], //省市区数据
multiIndex: [0, 0, 0], //选中省市区的索引
selectText: '请选择省市区', //省市区显示文本
formParams: {
inv_type: 4, //发票类型
tax_title: '', //开票公司名称
tax_no: '', //税务登记号
company_address: '', //公司注册地址
company_phone: '', //公司电话
bank_name: '', //开户行
bank_account: '', //开户银行账号
consignee: '', //收票人
consignee_phone: '', //收票手机号
intl_code: '0086',
consignee_province: '', //寄送地址省
consignee_city: '', //寄送地址市
consignee_district: '', //寄送地址区
consignee_address: '', //详细地址
is_default: '' //设置默认
}
};
},
onLoad() {},
onLoad() {
this.getProvince();
},
methods: {
tab(index) {
this.curr = index;
tab(index, type) {
if (type == 1) {
this.curr = index;
} else if (type == 2) {
this.taxIndex = index;
}
},
/**
* 设置默认监听
* @param {Object} e
*/
onSwitchChange(e) {
this.formParams.is_default = e.detail.value ? 1 : 0;
},
bindPickerChange: function(e) {
console.log('picker发送选择改变，携带值为', e.detail.value);
this.index = e.detail.value;
this.formParams.intl_code = this.array[e.detail.value];
},
/**
* 省市区联动监听
* @param {Object} e
*/
bindMultiPickerColumnChange(e) {
console.log(e.detail);
if (e.detail.column === 0) {
// 第一列滑动
this.multiIndex[0] = e.detail.value;
this.getCity(this.multiArray[0][e.detail.value].value, true);
// 第一列滑动之后 第二列 和第三列 都变为第一个
this.multiIndex.splice(1, 1, 0);
this.multiIndex.splice(2, 1, 0);
} else if (e.detail.column === 1) {
// 第二列滑动
this.multiIndex[1] = e.detail.value;
this.getDistrict(this.multiArray[1][e.detail.value].value);
// 第二列滑动之后 第三列 变成第一个
this.multiIndex.splice(2, 1, 0);
} else if (e.detail.column === 2) {
// 第三列滑动
this.multiIndex[2] = e.detail.value;
}
this.$forceUpdate();
},
/**
* 省市区选择确定
* @param {Object} e
*/
pickerChange(e) {
this.multiIndex = e.detail.value;
this.formParams.consignee_province = this.multiArray[0][this.multiIndex[0]].value;
this.formParams.consignee_city = this.multiArray[1][this.multiIndex[1]].value;
this.formParams.consignee_district = this.multiArray[2][this.multiIndex[2]].value;
this.selectText = `${this.multiArray[0][this.multiIndex[0]].name + ',' + this.multiArray[1][this.multiIndex[1]].name + ',' + this.multiArray[2][this.multiIndex[2]].name}`;
},
/**
* 获取省数据
*/
getProvince(id = 1) {
console.log('获取省数据id：' + id);
this.request(Api_Url + '/address/pcd', 'POST', { id: id }, false, true).then(res => {
if (res.err_code === 0) {
var arr = [];
for (var key in res.data) {
arr.push({ name: res.data[key], value: parseInt(key) });
}
this.multiArray[0] = arr;
this.getCity(2, true);
this.$forceUpdate();
}
});
},
/**
* @param {Object} id
* @param {Object} default
*/
getCity(id, defaultParms) {
console.log('获取市数据id：' + id);
this.request(Api_Url + '/address/pcd', 'POST', { id: id }, false, true).then(res => {
if (res.err_code === 0) {
var arr = [];
for (var key in res.data) {
arr.push({ name: res.data[key], value: parseInt(key) });
}
this.multiArray[1] = arr;
if (defaultParms) {
this.getDistrict(arr[0].value);
}
this.$forceUpdate();
}
});
},
/**
* 获取区数据
* @param {Object} id
*/
getDistrict(id) {
console.log('获取区数据id：' + id);
this.request(Api_Url + '/address/pcd', 'POST', { id: id }, false, true).then(res => {
if (res.err_code === 0) {
var arr = [];
for (var key in res.data) {
arr.push({ name: res.data[key], value: parseInt(key) });
}
this.multiArray[2] = arr;
this.$forceUpdate();
}
});
}
}
};
......
pages/mine/userAddressAdd.vue
......@@ -71,11 +71,15 @@ export default {
this.index = e.detail.value;
this.formParams.intl_code = this.array[e.detail.value];
},
/**
* 设置默认监听
* @param {Object} e
*/
onSwitchChange(e) {
this.formParams.is_default = e.detail.value ? 1 : 0;
},
/**
* 地址监听
* 省市区联动监听
* @param {Object} e
*/
bindMultiPickerColumnChange(e) {
......@@ -102,7 +106,7 @@ export default {
this.$forceUpdate();
},
/**
* 省市区完成
* 省市区选择确定
* @param {Object} e
*/
pickerChange(e) {
......@@ -118,7 +122,7 @@ export default {
*/
getProvince(id = 1) {
console.log('获取省数据id：' + id);
this.request(Api_Url + '/address/pcd', 'POST', { id: id }, true, true).then(res => {
this.request(Api_Url + '/address/pcd', 'POST', { id: id }, false, true).then(res => {
if (res.err_code === 0) {
var arr = [];
for (var key in res.data) {
......@@ -136,7 +140,7 @@ export default {
*/
getCity(id, defaultParms) {
console.log('获取市数据id：' + id);
this.request(Api_Url + '/address/pcd', 'POST', { id: id }, true, true).then(res => {
this.request(Api_Url + '/address/pcd', 'POST', { id: id }, false, true).then(res => {
if (res.err_code === 0) {
var arr = [];
for (var key in res.data) {
......@@ -156,7 +160,7 @@ export default {
*/
getDistrict(id) {
console.log('获取区数据id：' + id);
this.request(Api_Url + '/address/pcd', 'POST', { id: id }, true, true).then(res => {
this.request(Api_Url + '/address/pcd', 'POST', { id: id }, false, true).then(res => {
if (res.err_code === 0) {
var arr = [];
for (var key in res.data) {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment