<!--
@ 作者: 鲁智强
@ 时间: 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="dimensionname" 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="dimensionname" 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 objectSpanMethod(tablea) {
  const mergingRows = (tablea, dimensionname) => { // 表格数据列合并预处理,生成一个与行数相同的数组记录每一行设置的合并数
  // 如果是第一条记录（索引为0），向数组中加入1，并设置索引位置；
  // 如果不是第一条记录，则判断它与前一条记录是否相等，如果相等，
  // 则向mergingRows中添入元素0，并将前一位元素+1，表示合并行数+1，
  // 以此往复，得到所有行的合并数，0即表示该行不显示。
    const mergingRows = []
    let mergingPos = 0
    for (let i = 0; i < tablea.length; i++) { // tabledata 表格数据源
      if (i === 0) {
        mergingRows.push(1)
        mergingPos = 0
      } else {
        if (prop === 'creditAmountUsed') {
          console.log(tablea[i][dimensionname], tablea[i - 1][dimensionname], tablea[i][dimensionname] === tablea[i - 1][prop])
        }
        if (tablea[i][prop] === tablea[i - 1][prop]) { // 哪些数据是要合并的 合并的条件是什么 此处合并条件为[prop]相同则进行合并
          mergingRows[mergingPos] += 1
          mergingRows.push(0)
        } else {
          mergingRows.push(1)
          mergingPos = i
        }
      }
    }
    return mergingRows
  }
  // tableColumn是一个描述你所写的el-table-column的
  let arr = tableColumn.map(item => item.prop)
  arr.unshift(arr[0])
  arr.push(arr[0])
  // 往前后各添加一条数据是因为对前面或后面没有放入tableColumn的采用与a相同的合并策略，此处按实际情况即可
  arr = arr.map(item => mergingRows(tablea, item))
  return ({ row, column, rowIndex, columnIndex }) => {
    // 对于arr后面没有进行描述的列采取不进行行合并
    if (columnIndex >= arr.length) return
    const _row = arr[columnIndex][rowIndex]
    const _col = _row > 0 ? 1 : 0
    return {
      rowspan: _row,
      colspan: _col
    }
  }
}
  onMounted(()=>{
	Object.assign(formData,props.rowInfo);
})
 </script>
  