KunWeb/fapp/ciyon_ap/pages/main/me_invoicetitle.vue

<template>
	<ciy-header title="我的发票抬头"></ciy-header>
	<view v-if="init.code != 1" class="px4 py4">
		<view style="height:8em;width:100%;" class="ciy-skeleton"></view>
		<view style="height:8em;width:100%;" class="ciy-skeleton"></view>
		<view style="height:8em;width:100%;" class="ciy-skeleton"></view>
	</view>
	<view v-else>
		<view class="ciy-list" :class="{selected:opn.sel&&item.id==opn.id,del:item._clas=='del'}" v-for="(item,index) in init.list" :key="item.id" @click="select(item.id)">
			<view class="l2">名称 {{item.name}}</view>
			<view class="l2" v-if="item.taxnumber">税号 {{item.taxnumber}}</view>
			<view class="l2" v-if="item.addr">单位地址 {{item.addr}}</view>
			<view class="l2" v-if="item.phone">电话号码 {{item.phone}}</view>
			<view class="l2" v-if="item.bankname">银行名称 {{item.bankname}}</view>
			<view class="l2" v-if="item.bankaccount">银行账号 {{item.bankaccount}}</view>
			<view class="dot" @click="showmenu(index)"></view>
		</view>
		<view style="height:5em;"></view>
		<view class="ciy-add" style="z-index:41;" @tap="editshow(null)"></view>
		<view v-if="opn.sel">
			<view class="bg1 txt-center py4 ciy-bottom">
				<button class="btn lg" @click="selectok">选定</button>
			</view>
		</view>
		<ciy-anipop v-model="popedit" :zindex="998" maskbg="#00000077" :title="edit.id>0?'更新抬头':'新建抬头'">
			<view class="bg1 pop">
				<form @submit="submit_edit" class="char5">
					<view class="ciy-form">
						<label class="imp">抬头名称</label>
						<view>
							<ciy-input name="name" v-model="edit.name" bb></ciy-input>
						</view>
					</view>
					<view class="ciy-form">
						<label class="imp">税号</label>
						<view>
							<ciy-input name="taxnumber" v-model="edit.taxnumber" bb></ciy-input>
						</view>
					</view>
					<view class="ciy-form">
						<label>单位地址</label>
						<view>
							<ciy-input name="addr" v-model="edit.addr" bb></ciy-input>
						</view>
					</view>
					<view class="ciy-form">
						<label>电话号码</label>
						<view>
							<ciy-input name="phone" v-model="edit.phone" bb ciystyle="width:9em;"></ciy-input>
						</view>
					</view>
					<view class="ciy-form">
						<label>银行名称</label>
						<view>
							<ciy-input name="bankname" v-model="edit.bankname" bb></ciy-input>
						</view>
					</view>
					<view class="ciy-form">
						<label>银行账号</label>
						<view>
							<ciy-input name="bankaccount" v-model="edit.bankaccount" bb></ciy-input>
						</view>
					</view>
					<view class="rel px4 py4 txt-center">
						<button class="btn lg" form-type="submit">提交</button>
						<!-- #ifdef MP-WEIXIN -->
						<view class="abs t1 r1">
							<button class="btn sm" @tap="chooseinvoice">从微信同步</button>
						</view>
						<!-- #endif -->
					</view>
				</form>
			</view>
		</ciy-anipop>
	</view>
</template>

<style>
	.ciy-list {
		border: 2px solid var(--bg1);
		transition: all 0.5s;
	}

	.selected {
		border: 2px solid var(--man6);
	}
</style>

<script>
	export default {
		props: {
			id: {},
			sel: {}
		},
		data() {
			return {
				popedit: false,
				edit: {
					id: -1
				},
			}
		},
		onLoad() {
			this.getlist();
		},
		watch: {},
		computed: {},
		methods: {
			async getlist() {
				if (this._loading)
					return;
				this._loading = true;
				var retjson = await this.callajax({
					func: 'me.invoicetitle_get'
				});
				this._loading = false;
				if (retjson.code != 1)
					return this.alert(retjson.errmsg);
				this.init = retjson;
				if (!this._add && retjson.list.length == 0) {
					setTimeout(() => {
						this.editshow(null);
					}, 400);
				}
				this._add = true;
			},
			showmenu(idx) {
				var dat = this.init.list[idx];
				dat._idx = idx;
				var items = [];
				items.push({
					func: 'editshow',
					name: '更新',
					data: dat
				});
				items.push({
					func: 'del',
					name: '删除',
					style: 'color:var(--dag5)',
					data: dat
				});
				this.popmenu({
					items
				});
			},
			editshow(item) {
				item = item || {
					data: {
						_idx: -1
					}
				};
				this.edit = {
					...item.data
				};
				this.popedit = true;
			},
			async submit_edit(e) {
				if (!e.detail.value.name)
					return this.alert('请输入抬头名称');
				if (!e.detail.value.taxnumber)
					return this.alert('请输入税号');
				e.detail.value.id = this.edit.id;
				if (this._loading)
					return;
				this._loading = true;
				var retjson = await this.callajax({
					func: 'me.invoicetitle_edit',
					data: e.detail.value
				});
				this._loading = false;
				if (retjson.code != 1)
					return this.alert(retjson.errmsg);
				if (this.edit._idx == -1)
					this.init.list.unshift(retjson.data);
				else
					this.init.list[this.edit._idx] = this.objdeepmerge(this.init.list[this.edit._idx], retjson.data);
				this.popedit = false;
				this.toast('更新成功');
			},
			async del(item) {
				if (await this.askmsg('是否删除？') != 'ok')
					return;
				var retjson = await this.callajax({
					func: 'me.invoicetitle_del',
					data: {
						id: item.data.id
					}
				});
				if (retjson.code != 1)
					return this.alert(retjson.errmsg);
				this.init.list[item.data._idx]._clas = 'del';
				setTimeout(() => {
					this.init.list.splice(item.data._idx, 1);
				}, 500);
			},
			select(id) {
				if (this.opn.id == id)
					return this.selectok();
				this.opn.id = id;
			},
			selectok() {
				var addr = this.ccode(this.init.list, this.opn.id, '_obj');
				if (addr == null)
					return this.toast('请选择一个发票抬头');
				const eventChannel = this.getOpenerEventChannel();
				eventChannel.emit('writedata', addr);
				this.setstorage('invoicetitle', addr);
				uni.navigateBack();
			},
			async chooseinvoice() {
				var inv = await wx.chooseInvoiceTitle();
				console.log(inv);
				this.edit.addr = inv.companyAddress;
				this.edit.name = inv.title;
				this.edit.phone = inv.telephone;
				this.edit.taxnumber = inv.taxNumber;
				this.edit.bankname = inv.bankName;
				this.edit.bankaccount = inv.bankAccount;
			}
		}
	}
</script>