<template>
  <div v-if="allow.includes('financePropertyDetail')">
    <gridToolbar
			:query.sync="query"
			@refresh="refresh"
			:showAdd="false"
			:selectOptions="selectOptions"
			:defaultSelected="defaultSelected" />
    <data-grid
			v-if="onOff"
			:api="request_api.finance_property_detial"
			:query="requestQuery"
			ref="dataGrid"
			@change="handleChange">
      <!-- <a-table-column
				title="资产明细组UUID"
				dataIndex="property_group_uuid"
				:filterIcon="filterSearchIcon"
				:filterDropdown="filterSearchDropdown" /> -->
      <a-table-column
				title="用户信息"
				align="left"
				dataIndex="real_name">
        <template slot-scope="text, record">
					<user-info
						:name="text"
						:user_id="record.login_id"
						:phone="record.phone"
						:email="record.email" />
        </template>
      </a-table-column>
      <a-table-column
				title="资产类型"
				dataIndex="property_type">
				<div class="multi_line" slot-scope="text, record" v-if="property_type_cas_obj[text]">
					<span>{{ property_type_cas_obj[text].name }}</span>
					<span>{{ property_type_cas_obj[text][record.property_coin_type] }}</span>
				</div>
      </a-table-column>
      <a-table-column
				title="总额"
				dataIndex="total_count"
				:sorter="true"
				:sortOrder="sortedInfo.columnKey === 'total_count' && sortedInfo.order">
        <template slot-scope="text">{{ text | setZero }}</template>
      </a-table-column>
      <a-table-column
				title="初始金额"
				dataIndex="initial_count"
				:sorter="true"
				:sortOrder="sortedInfo.columnKey === 'initial_count' && sortedInfo.order">
        <template slot-scope="text">{{ text | setZero }}</template>
      </a-table-column>
      <a-table-column
				title="金额"
				dataIndex="count"
				:sorter="true"
				:sortOrder="sortedInfo.columnKey === 'count' && sortedInfo.order"
				:filters="columnFilters(income_options)"
				:filterMultiple="false">
        <template slot-scope="text, record">
					<template v-if="text === 0 || !text || text === '0'">{{ text | setZero }}</template>
					<a-tag :color="['red', 'green'][record.is_income] || 'red'" v-else>{{ income_symbol(record, 'count') }}{{ text | setZero }}</a-tag>
				</template>
      </a-table-column>
      <!-- <a-table-column
				title="客户端IP"
				dataIndex="client_ip"
				:filterIcon="filterSearchIcon"
				:filterDropdown="filterSearchDropdown" /> -->
      <a-table-column
				title="关联类型"
				dataIndex="relate_data_type"
				:filters="columnFilters(relate_type_options)"
				:filterMultiple="false">
        <template slot-scope="value">{{ value | relate_type }}</template>
      </a-table-column>
      <a-table-column
				title="资产来源"
				dataIndex="source"
				:filters="columnFilters(source_options)"
				:filterMultiple="false">
        <template slot-scope="value">{{ value | source }}</template>
      </a-table-column>
      <a-table-column title="创建/更新时间" dataIndex="created_date">
        <template slot-scope="text, record">
					<div class="multi_line">
						<span>{{ text | moment }}</span>
						<span>{{ record.updated_date | moment }}</span>
					</div>
        </template>
      </a-table-column>
			<a-table-column
				title="状态"
				dataIndex="status"
				:defaultFilteredValue="!$route.params.login_id && onOff ? ['1'] : null"
				:filters="columnFilters(property_status_options)"
				:filterMultiple="false">
        <template slot-scope="value">
					<a-tag :color="['green', 'red', 'purple'][value - 1] || 'red'">{{ value | property_status }}</a-tag>
        </template>
      </a-table-column>
      <a-table-column title="备注" dataIndex="memo" class="memo" :customCell="cellTitle('memo')">
				<template slot-scope="value">{{remoteText(value)}}</template>
				</a-table-column>
      <a-table-column title="操作">
				<div class="table-btn-group" slot-scope="text, record">
					<a-button @click="edit(record)" type="primary">详情</a-button>
					<a-button @click="correct(record)" v-authority="'financePropertyDetailCorrect'">修正</a-button>
				</div>
      </a-table-column>
    </data-grid>
  </div>
</template>

<script>
import { setLocale, remoteText } from '@iwotech/i18n-remote'
import DataGrid from '../../components/DataGrid'
import gridToolbar from '../../components/gridToolbar/default'
import userInfo from '../../components/info/user'

import mix from '../../mixins/mixins'
import tableFilter from '../../mixins/tableFilter'
import finance from '../../mixins/finance'
import common from '../../mixins/common'

import store from '../../store'

setLocale('zh-CN')

export default {
  mixins: [common, mix, tableFilter, finance()],
	components: {
		DataGrid, gridToolbar, userInfo
	},
  data() {
    return {
			onOff: false,
			extendStatus: 1,
      // 混入配置
      mixConofig: {
        editTitle: '资金明细',
        apiName: 'finance_property_detial',
        modalName: 'propertyDetail',
        modalWidth: 1000
      }
    }
	},
	computed: {
		property_type_cas() {
			return store.state.property_type_cas || []
		},
		property_type_cas_obj() {
			return store.getters.property_type_cas_obj || []
		},
		selectOptions () {
			return [
				{ label: '模糊搜索', value: 'keyword', placeholder: '关键词' },
				{ label: '用户ID', value: 'login_id', placeholder: '请输入完整的用户ID' },
				{ label: '用户名', value: 'real_name', placeholder: '请输入完整的用户名' },
				{ label: '用户邮箱', value: 'email', placeholder: '请输入完整的邮箱号' },
				{ label: '用户手机', value: 'phone', placeholder: '请输入完整的手机号' },
				{ label: 'UUID', value: 'uuid', placeholder: '请输入完整的UUID' },
				{ label: '组UUID', value: 'property_group_uuid', placeholder: '请输入完整的组UUID' }
			]
		},
		defaultSelected() {
			// 默认取路由唯一的参数名
			const allowParams=this.selectOptions.map(v => v.value)
			const keys=Object.keys(this.$route.params)
			if(keys.length===1&&allowParams.includes(keys[0])) return keys[0]
			return 'keyword'
		},
		extendQuery() {
			return {
				...(!this.$route.params.login_id && this.onOff && this.extendStatus && { status: 1 })
			}
		}
	},
  activated () {
		this.onOff = true
		this.extendStatus = true
		if (!this.property_type_cas || !this.property_type_cas.length) store.dispatch('getPropertyType')

		const val = this.$route.params[this.defaultSelected]
		if(val) this.query={ [this.defaultSelected]: val }
		// this.query = {
		// 	...(this.$route.params.login_id && { [this.defaultSelected]: this.$route.params.login_id || '' })
		// }
	},
	deactivated () {
		this.onOff = false
		this.resetQuery()
	},
	methods: {
		remoteText,
		customFilter (pagination, filters) {
			if (filters.status && !filters.status.length) this.extendStatus = false
			if (!filters.count) return
			const query = filters.count && filters.count.length && { is_income: Number(filters.count[0]) }
			delete filters.count
			return query
		},
		correct (v) {
			this._fnModal.propertyDetailCorrect({
        title: '临时修正资产明细',
        width: 520,
        data: v,
        done: () => this.refresh()
      })
		}
	}
}
</script>