<template>
  <view class="form-page">
    <scroll-view scroll-y class="form-scroll">
        <uni-forms :modelValue="formData" label-width="220upx" ref="customForm">
        <view class="form-card" v-if="formData.ticket_">
            <ticketd :ticket_="formData.ticket_"></ticketd>
        </view>
        <view class="form-card">
            <view class="form-card-title">员工信息</view>
        <uni-forms-item label="员工信息" required>
                <searchSelect 
                v-model="formData.employee" 
                :apiobjs="EmpApiobj" 
                @change="handleChange"
                v-if="mode== 'add'"/>
                <span v-else>{{formData.employee_name}}</span>
            </uni-forms-item>

        <!-- 基本信息 -->
        <view class="row">
            <view class="col">
            <uni-forms-item label="性别">
                <uni-easyinput v-model="formData.gender" disabled />
            </uni-forms-item>
            </view>

            <view class="col">
            <uni-forms-item label="工号">
                <uni-easyinput v-model="formData.number" disabled />
            </uni-forms-item>
            </view>

            <view class="col">
            <uni-forms-item label="联系方式">
                <uni-easyinput v-model="formData.phone" disabled />
            </uni-forms-item>
            </view>
        </view>

        <uni-forms-item label="身份证号">
            <uni-easyinput v-model="formData.id_number" disabled />
        </uni-forms-item>

        <uni-forms-item label="部门">
            <uni-easyinput v-model="formData.belong_dept_name" disabled />
        </uni-forms-item>

        <uni-forms-item label="岗位">
            <uni-easyinput v-model="formData.post_name" disabled />
        </uni-forms-item>

        <uni-forms-item label="入职时间">
            <uni-easyinput v-model="formData.start_date" disabled />
        </uni-forms-item>
        </view>

        <!-- 调岗信息 -->
        <view class="form-card">
        <view class="form-card-title">调岗信息</view>
        <uni-forms-item label="原部门" required>
            <uni-data-picker
                v-model="formData.original_dept"
                :localdata="group"
                :disabled="mode === 'show'"
                :map="{ text: 'label', value: 'value', children: 'children' }"
                :show-all-levels="false"
                clearable
                placeholder="请选择部门"
            />
        </uni-forms-item>

        <!-- 原岗位 -->
        <uni-forms-item label="原职务" required >
            <uni-data-select
            v-model="formData.original_post"
            :localdata="postList"
            :disabled="mode === 'show'"
            clearable
            placeholder="请选择职务"
            />
        </uni-forms-item>

        <!-- 是否跨部门 -->
        <!-- <uni-forms-item label="是否跨部门调动" required name="is_change">
            <radio-group v-model="formData.is_change">
            <label><radio :value="0" />否</label>
            <label><radio :value="1" />是</label>
            </radio-group>
        </uni-forms-item> -->

        <!-- 是否晋升 -->
        <!-- <uni-forms-item label="是否晋升" required name="is_promotion"> 
            <radio-group v-model="formData.is_promotion">
            <label><radio :value="0" />否</label>
            <label><radio :value="1" />是</label>
            </radio-group>
        </uni-forms-item> -->
        <uni-forms-item label="是否跨部门调动" required name="is_change">
        <uni-data-select
            v-model="formData.is_change"
            :localdata="booleanOptions"
            placeholder="请选择"
        />
        </uni-forms-item>

        <uni-forms-item label="是否晋升" required name="is_promotion">
        <uni-data-select
            v-model="formData.is_promotion"
            :localdata="booleanOptions"
            placeholder="请选择"
        />
        </uni-forms-item>

        <!-- 调岗部门 -->
        <uni-forms-item label="调岗部门" required name="new_dept">
            <uni-data-picker
            v-model="formData.new_dept"
                :localdata="group"
                :disabled="mode === 'show'"
                :map="{ text: 'label', value: 'value', children: 'children' }"
                :show-all-levels="false"
                clearable
                placeholder="请选择部门"
            />
        </uni-forms-item>

        <!-- 调岗岗位 -->
        <uni-forms-item label="调岗职务" required>
            <uni-data-select
            v-model="formData.new_post"
            :localdata="postList"
            :disabled="mode === 'show'"
            clearable
            placeholder="请选择职务"
            />
        </uni-forms-item>

        <!-- 调岗时间 -->
        <uni-forms-item label="调岗时间" required>
            <uni-datetime-picker
            type="date"
            v-model="formData.transfer_date"
            />
        </uni-forms-item>
        <uni-forms-item label="个人工作内容">
            <uni-easyinput
                v-if="!editing"
                v-model="formData.content"
                placeholder="请输入"
                @focus="editing = true"
            />
            <uni-easyinput
                v-else
                type="textarea"
                v-model="formData.content"
                autoHeight
                @blur="editing = false"
            />
            </uni-forms-item>
        <uni-forms-item label="调岗原因">
            <uni-easyinput
                v-if="!editing"
                v-model="formData.reason"
                placeholder="请输入"
                @focus="editing = true"
            />
            <uni-easyinput
                v-else
                type="textarea"
                v-model="formData.reason"
                autoHeight
                @blur="editing = false"
            />
            </uni-forms-item>

        <uni-forms-item label="原岗位薪资">
            <uni-number-box v-model="formData.original_slary" :min="2000" />
        </uni-forms-item>
        <uni-forms-item label="调岗后岗位薪资">
            <uni-number-box v-model="formData.new_slary" :min="2000"/>
        </uni-forms-item>
        </view>
        </uni-forms>
    </scroll-view>
    <view class="footer_fixed">
		<button v-if="mode=='edit'" class="form-btn form-btn-danger" @click="handleDel" :loading="saveLoading" :disabled="saveLoading">
			删除
		</button>
		<button v-if="mode!='show'" class="form-btn form-btn-primary" @click="handleSave" :loading="saveLoading" :disabled="saveLoading">
			提交审批
		</button>
		<ticketd_b :workflow_key="'wf_transfer'" v-if="formData?.ticket_ && mode == 'show'" :t_id="formData.id" :ticket_="formData.ticket_"
		:ticket_data="ticket_data" @success="()=>{uni.navigateBack()}" ref="ticketd_b"></ticketd_b>
	</view>
  </view>
</template>

<script>
import { genTree } from "@/utils/verificate";
import ticketd_b from "../wf/ticketd_b.vue"
import ticketd from "../wf/ticketd.vue"
import searchSelect from "@/components/searchselect.vue"
export default {
    components: { ticketd_b, ticketd, searchSelect },
    data() {
        return {
        mode: 'show',
        formData: {
            is_change: 0,
            is_promotion: 0,
            original_slary: 2000,
            new_slary: 2000,
        },
        EmpApiobj:this.$api.employeeList,
        group: [],
        postList: [],
        editing: false,
        ticket_data: {},
        booleanOptions: [
                { value: 0, text: '否' },
                { value: 1, text: '是' }
            ],
        }
    },
    watch: {
        formData: {
            handler(val){
                Object.assign(this.ticket_data,{
                    original_slary: val.original_slary,
                    new_slary: val.new_slary,
                    original_post: val.original_post,
                    new_post: val.new_post,
                    is_change: val.is_change,
                    is_promotion: val.is_promotion
                })
            },
        deep: true,
        }
    },
    onLoad(options) {
        let that = this;
        that.mode = options.mode?options.mode:'show';
        that.t_id = options.t_id?options.t_id:null;
        if(that.t_id) {
			that.$api.transferItem(that.t_id).then(res=>{
                console.log(res);
				Object.assign(that.formData, {
                    ...res,
                    is_change: res.is_change?1:0,
                    is_promotion: res.is_promotion?1:0,
                })
				if(that.formData.ticket_.state_.type == 1 && that.formData.create_by == uni.getStorageSync("userInfo").id ) {
					that.mode = "edit";
				}else{
					that.mode = "show";
				}
			})
		}
        // that.fillNames();
        that.getGroup();
        that.getPost();
    },
    methods: {
        async getGroup() {
            const res = await this.$api.deptList({ page: 0 })
            this.group = genTree(res);
        },
        async getPost(){
            const res = await this.$api.postList({ page: 0 })
            this.postList = res.map(item =>({
                text: item.name,
                value: item.id
                }
                    )
                        )
            },
        async handleChange(id) {
            if (!id) return
            const obj = await this.$api.employeeItem(id)
            Object.assign(this.formData, {
                employee_name: obj.name,
                gender: obj.gender,
                phone: obj.phone,
                number: obj.number,
                id_number: obj.id_number,
                belong_dept_name: obj.belong_dept_name,
                post_name: obj.post_name,
                start_date: obj.start_date
                }
            )
        },
        handleSave(){
			let that = this;
			that.$refs.customForm.validate().then(res => {
				that.$api.transferCreate(that.formData).then(ress=>{
					uni.navigateBack()
				})
			}).catch(err => {
				console.log('err', err);
			})
		},
        handleDel() {
            uni.showModal({
                title: '提示',
                content: '确定删除吗？',
                success: res => {
                if (res.confirm) {
                    this.$api.transferDelete(this.formData.id)
                    uni.navigateBack();
                            }
                            
                        }
                    }
                )
            }
        }
    }
</script>

<style lang="scss" scoped>
.form-page { min-height: 100vh; background: #F0F2F5; }
.form-scroll { padding: 0; padding-bottom: 180rpx; }
.form-card { background: #fff; border-radius: 0; padding: 24rpx; margin-bottom: 0; box-shadow: none; }
.form-card-title { font-size: 30rpx; font-weight: 600; color: #1F2937; margin-bottom: 16rpx; padding-left: 16rpx; border-left: 6rpx solid #2BA471; }
.form-btn { flex: 1; height: 80rpx; line-height: 80rpx; border-radius: 14rpx !important; font-size: 28rpx; font-weight: 500; border: none !important; }
.form-btn-primary { background: linear-gradient(135deg, #2BA471, #1F8C5E) !important; color: #fff !important; box-shadow: 0 4rpx 12rpx rgba(43,164,113,0.2); }
.form-btn-danger { background: linear-gradient(135deg, #EF4444, #DC2626) !important; color: #fff !important; box-shadow: 0 4rpx 12rpx rgba(239,68,68,0.3); }
</style>