<template>
	<scroll-view :style="{height: `calc(${processDefinitionHeight}px - 20rpx)`}" class="di-scroll" scroll-y @scrolltolower="handleOnreachBottom" :refresher-triggered="triggered"
		refresher-enabled @refresherrefresh="handlePullDownRefresh">
		<view class="di-scroll-list">
			<!-- 右滑 -->
			<u-swipe-action
				v-for="(item, index) in list"
				:show="activeIndex === item[primaryKey]"
				:key="index" 
				:index='item.id'
				:options="actionOptions"
				@content-click="(id) => handle2StartFlow(item)"
				@click="handleActionClick"
				@open="handleActiveSwipeAction">
				<di-descriptions value-col="12" :border-bottom="true" >
					<di-descriptions-item :value="item.name" :ellipsis="true"/>
				</di-descriptions>
			</u-swipe-action>
		</view>
		<u-loadmore v-if="!triggered" :status="status" :loadText='loadText' margin-top="24" margin-bottom="20" />
	</scroll-view>
</template>

<script>
	import list from '@/mixins/list'
	export default {
		mixins: [list],
		data() {
			return {
				baseApi: '/mobile/workflow/processDefinition',
				listApi: 'getAuthorizedProcDefList',
				actionOptions: [{
					text: '流程图',
					type: 'handleViewDiagram',
					style: {
						backgroundColor: this.$color.warning
					}
				}]
			};
		},
		created() {
			this.activeIndex = -100
			this.getList()
		},
		methods: {
			handleViewDiagram(id) {
				uni.navigateTo({
					url: `/pages/workflowTask/webviewPages/flowDiagram?id=${id}`
				})
			},
			handle2StartFlow(item) {
				uni.navigateTo({
					url: `/pages/workflowTask/webviewPages/startFlow?id=${item.id}&processInstanceId=${item.processInstanceId}&defaultTitle=${item.defaultTitle}&name=${item.name}`
				})
			}
		},
		watch: {
		  category: {
		    handler: function (val) {
			  this.list = []
			  delete this.queryParam['name']
		      this.queryParam['category'] = val
			  this.handlePullDownRefresh()
		    }
		  },
		  searchKeyWord: {
		    handler: function (val) {
			  this.list = []
		      this.queryParam['name'] = val
			  this.handlePullDownRefresh()
		    }
		  }
		},
		props: {
		  category: {
		    type: String,
		    default: ''
		  },
		  processDefinitionHeight: {
			  type: Number,
			  default: 0
		  },
		  searchKeyWord: {
			  type: String,
			  default: ''
		  }
		}
	}
</script>

<style lang="scss">
</style>
