aiot-app/pages/saleManage/contact/contactList.vue

<template>
	<view class="mainBox">
		<u-list-item v-for="(item, index) in tableList" :key="index" style="position: relative;">
			<myCard @setFree="setFree(item)" @addApply="addApply(item)" @assignModelShow="assignModelShow(item)"
				@del="del(item)" :item="item" :index="index+1" :btnList="btnList" :columns="columns"> </myCard>


		</u-list-item>
<view style='margin-top: 20vh;' v-if="tableList.length==0">
			<u-empty iconSize='150' textSize='32' text='暂无数据'>
			</u-empty>
		</view>
		<u-modal :show="modalShow" @cancel="modalShow=false" :showCancelButton="true" :closeOnClickOverlay="true"
			@confirm="assign" :title="'指派'">
			<view>
				<view>
					<u--input placeholder="分管部门" @click.native="showPicker" v-model="addForm.fgDeptName"></u--input>

				</view>
				<view>

					<uni-data-picker v-model="addForm.salesmanId" placeholder="请选择" :localdata="userList"
						@change="industryOnchange">
					</uni-data-picker>

				</view>
			</view>


		</u-modal>
		<ba-tree-picker ref="treePicker" :multiple="false" @select-change="confirm" :localdata="listData" valueKey="id"
			textKey="name" childrenKey="children" />
		<u-toast ref="uToast"></u-toast>

	</view>
</template>

<script>
	import {
		contactPage,
		contactDelete,
		free,
		assign,
		apply
	} from '@/api/saleManage/contact/index.js'
	import {
		listOrganizations,
		getUserPage
	} from '@/api/myTicket/index.js'
	import baTreePicker from '@/components/ba-tree-picker/ba-tree-picker.vue'
	import myCard from '../components/myCard.vue'
	export default {
		components: {
			baTreePicker,
			myCard
		},
		props: {
			btnList: {
				default: () => []
			}
		},
		data() {
			return {
				tableList: [],
				page: 1,
				size: 10,
				isEnd: false,
				modalShow: false,
				current: {},
				userList: [],
				listData: [],
				addForm: {
					contactIds: '',
					contactNames: '',
					fgDeptId: '',
					fgDeptName: '',
					salesmanId: '',
					salesmanName: ''
				},
				columns: [
					[{
						label: '名称：',
						prop: 'name',
						type: 'title',
						className: 'perce100',
					}],
					[{
						label: '编码：',
						prop: 'code'
					}, {
						label: '代号：',
						prop: 'serialNo'
					}],
					[{
						label: '联系人：',
						prop: 'name'
					}, {
						label: '联系人电话：',
						prop: 'linkPhone'
					}],
					[{
						label: '是否指派：',
						prop: 'assignStatus',
						formatter: (row) => {
							return (row.assignStatus == 1 ? '是' : '否') || ''
						}
					}, {
						label: '销售员：',
						prop: 'salesmanName'
					}],
					[{
						label: '详细地址：',
						prop: 'addressName',
						className: 'perce100',
						formatter: (row) => {
							return (row.addressName || '') + row.address || ''
						}
					}],
					[{
						label: '操作：',
						prop: 'action',
						type: 'action',
						className: 'perce100',
					}],
				]
			}
		},
		created() {
			this.getDept()
		},
		methods: {
			// 显示选择器
			showPicker() {
				this.$refs.treePicker._show();
			},

			confirm(data, name) {
				this.addForm.fgDeptName = name
				this.addForm.fgDeptId = data[0]
				this.addForm.salesmanName = ''
				this.addForm.salesmanId = ''
				this.getUser(data[0])
			},
			getDept() {
				listOrganizations(1).then(data => {
					this.listData = data
				})
			},
			getUser(deptCode) {
				getUserPage({
					pageNum: 1,
					size: -1,
					groupId: deptCode
				}).then(data => {
					this.userList = data.list.map(item => {
						item.text = item.name
						item.value = item.id
						return item
					})
				})

			},
			industryOnchange(obj) {
				this.addForm.salesmanName = obj.detail.value[0].text

			},
			del(row) {
				contactDelete([row.id]).then(res => {
					this.isEnd = false
					this.page = 1
					this.$refs.uToast.show({
						type: "success",
						message: "操作成功",
					})
					this.getList(this.where)
				})
			},
			//释放
			setFree(row) {
				free({
					contactIds: row.id,
					contactNames: row.name
				}).then((res) => {
					this.isEnd = false
					this.page = 1
					this.$refs.uToast.show({
						type: "success",
						message: "操作成功",
					})
					this.getList(this.where)
				});
			},
			assignModelShow(row) {
				this.current = row
				this.modalShow = true
			},
			assign() {
				if (!this.addForm.fgDeptId) {
					console.log(this.$refs)
					this.$refs.uToast.show({
						type: "error",
						message: "请选择分管部门",
						position: 'top'
					})
					return
				}
				if (!this.addForm.salesmanId) {
					this.$refs.uToast.show({
						type: "error",
						message: "请选择业务员",
						position: 'top'
					})
					return
				}
				this.addForm.contactIds = this.current.id,
					this.addForm.contactNames = this.current.name
				assign(this.addForm)
					.then((res) => {
						this.modalShow = false
						this.isEnd = false
						this.page = 1
						this.$refs.uToast.show({
							type: "success",
							message: "操作成功",
						})
						this.getList(this.where)
					})
			},
			doSearch(where) {
				this.page = 1
				this.isEnd = false
				this.getList(where)
			},
			//申请
			addApply(row) {
				apply({
					contactIds: row.id,
					contactNames: row.name
				}).then((res) => {
					this.isEnd = false
					this.page = 1
					this.$refs.uToast.show({
						type: "success",
						message: "操作成功",
					})
					this.getList(this.where)
				});
			},
			//获取列表信息
			getList(where) {
				this.where = where
				if (this.isEnd) {
					return
				}
				uni.showLoading({
					title: '加载中'
				})

				let data = {
					pageNum: this.page,
					size: this.size,
					...where
				}
				contactPage(data).then(res => {
					if (this.page === 1) {
						this.tableList = res.list
					} else {
						this.tableList.push(...res.list)
					}
					this.page += 1
					this.isEnd = this.tableList.length >= res.count
				}).then(() => {
					uni.hideLoading()
				})
			},
		}
	}
</script>

<style lang="scss" scoped>

</style>