<!--
@ 作者: 鲁智强
@ 时间: 2023-08-15 11:34:38
@ 备注: 
-->
<template>
	<el-dialog :model-value="true" title="查看方案详情" @close="handleClose">
		<el-table :data="tablea" border label-width="120px" class="demo-ruleForm" :span-method="objectSpanMethod" style="width:100%">
			<el-table-column prop="dimensionname" label="考核维度"/>
			<el-table-column prop="dimensionstandard" label="维度权重"/>
			<el-table-column label="考核指标">
				<template #default="scope">
					<a v-if="scope.row.attribute == 1" style="color:#409eff" @click="cancelDialog(scope.row)">{{scope.row.targetname}}</a	>
					<a v-if="scope.row.attribute == 2">{{scope.row.targetname}}</a>
				</template>
			</el-table-column>
			<el-table-column prop="Targetstandard" label="权重指标"/>
			<el-table-column prop="content" label="说明"/>
			<el-table-column prop="unit" label="单位"/>
			<el-table-column prop="state" label="指标状态">
				<template #default="scope">
					<span v-if="scope.row.state== 1" class="el-tag">月</span>
					<span v-if="scope.row.state== 2" class="el-tag el-tag--warning">季度</span>
					<span v-if="scope.row.state== 3" class="el-tag el-tag--warning el-tag--light">年</span>
				</template>
			</el-table-column>
			<el-table-column prop="cycle" label="周期">
				<template #default="scope">
					<span v-if="scope.row.cycle== 4" class="el-tag">使用</span>
					<span v-if="scope.row.cycle== 5" class="el-tag">禁用</span>
					<span v-if="scope.row.cycle== 6" class="el-tag">观察</span>
				</template>
			</el-table-column>
			<el-table-column prop="cycle" label="频次"/>
			<el-table-column fixed="right" label="执行人" width="200">
				<template #default="{ row }">
					<el-button type="primary" link @click="handleio(row)"><el-icon><View /></el-icon>查看</el-button>
				</template>
			</el-table-column>
			<el-table-column fixed="right" label="操作" width="200">
				<template #default="{ row }">
					<el-button type="primary" link @click="handleErd(row)"><el-icon><EditPen /></el-icon>修改</el-button>
					<el-button type="primary" link @click="handleDel(row)"><el-icon><Delete /></el-icon>删除</el-button>
				</template>
			</el-table-column>
		</el-table>
		<Xd v-if="data.xdPostBox" v-model="data.xdPostBox" :row-info="rowInfo"></Xd>	
		<Hyr v-if="data.hyrPostBox" v-model="data.hyrPostBox" :row-info="rowInfo"></Hyr>	
		<Ycy v-if="data.ycyPostBox" v-model="data.ycyPostBox" :row-info="rowInfo"></Ycy>	
	</el-dialog>
  </template>
  <script lang="ts" setup>
  import { reactive } from "vue";
  import {tarlist,addPostCont,addtarget,getgroupuser,addposttargetcont,search_orgpost,organdpost} from '@/api/opk/api'
  import {editPostCont} from '@/api/opk/pulic/api'
  import { ge_add } from '@/api/opk/news/api'
  import {look_scheme} from '@/api/opk/opk/api'
  import { create_scheme,ge_copy,del_scheme } from '@/api/opk/zxy/news/api'
  import Xd from './xd.vue'
  import Hyr from './hyr.vue'
  import Ycy from './ycy.vue'
const isshow = ref(false)
const props= defineProps( {
	  title: {
		type: String,
		default: "",
	  },
	  ygPostBox: {
		type: Boolean,
		default: false,
	  },
	  rowInfo: {
		type: Object,
		default() {
		  return {};
		},
	  },
	  arrayNum: {
		type: Number,
		default: 0,
	  },
	});
const orgTreeProps ={
   label: 'name',
}
const orgTreeProp = {
	label:'title',
	children:'children'
}
const data = reactive({
	xdPostBox:false,
	hyrPostBox:false,
	ycyPostBox:false,
})
// eslint-disable-next-line vue/no-dupe-keys
const rowInfo = ref<any>({})
const emit = defineEmits(["update:ygPostBox","editRow","addRow"])
const formData = reactive({
	deaprtname:"",
	year:"",
	asd:[] as string[],
})
const tablea = ref<any>([])
function ge_adds(){
	const yui = props.rowInfo.key
	look_scheme({id:yui})
	    .then((data) => {
        	tablea.value = data.data;
        }).finally(()=>{
			isshow.value = false
		})
	}
ge_adds()
  // 关闭弹窗
 const handleClose = ()=> {
    emit("update:ygPostBox", false);
  }
  const handleio = (val:any)=>{
	data.xdPostBox = true,
	rowInfo.value = val
  }
  const handleErd = (val:any)=>{
	data.hyrPostBox = true,
	rowInfo.value = val
  }
  const handleDel = (val:any) => {
  		ElMessageBox.confirm("你确定删除这条信息吗?", "提示", {
    		confirmButtonText: "确认",
    		cancelButtonText: "取消",
    		type: "warning",
  		})
		  .then(() => {
				const delid = new String(val.id)
				del_scheme({orgid:val.orgid,planversionkey:val.plantversion,targetid:val.targetid})
				ge_adds()
			})
}
const cancelDialog = (val:any)=>{
	data.ycyPostBox=true,
	rowInfo.value =val
}
// 合并
		// 领域合并
        function courseinit() {
            // 首先初始化
            var _this = this;
            this.courseArr = []
            this.coursePos = 0
            for (var i = 0; i < _this.tableData2.length; i++) {
             //判断是否是第一行
                if (i === 0) {
                	//导入第一行数据
                    _this.courseArr.push(1)
                    _this.coursePos = 0
                } else {
                //不是第一行时，就根据标识去存储，course为我第一行的prop属性的值
                    if (_this.tableData2[i].course === _this.tableData2[i - 1].course) {
                     // 查找到下一行的数据等于上一行的数据时每次要把之前存储的数据+1
                        _this.courseArr[_this.coursePos] += 1
                        _this.courseArr.push(0)
                    } else {
                    // 没有相同的数据时候，要记住当前的index
                        _this.courseArr.push(1)
                        _this.coursePos = i
                    }
                }
            }
        }
	//然后开始写组件自带的方法，
	 function objectSpanMethod({rowIndex, columnIndex}) {
			//判断第一列的数据，上下行有没有相同的数据，有则合并，无则保留
            if (columnIndex === 0) {
            	//courseArr数组是上面输出来的，用来合并表格前做的数据判断
                const row1 = this.courseArr[rowIndex]
                const col1 = row1 > 0 ? 1 : 0
                return {
                    rowspan: row1,
                    colspan: col1
                }
            } else  if (columnIndex === 1) {
		        //这里是判断第二列的数据，nameArr和领域合并时候的处理一样，以此类推
                const row1 = this.nameArr[rowIndex]
                const col1 = row1 > 0 ? 1 : 0
                return {
                    rowspan: row1,
                    colspan: col1
                }
            }
        }

onMounted(()=>{
	Object.assign(formData,props.rowInfo);
	rowMergeArr = tableRowMerge(tablea, 'dimensionname');// 主列的行合并
})
 </script>
  