<!--
  @description: 采购需求编制
  @Modifier: haofengxian
  @routerPath:procurement/procurementDemandList
  @date: 2022-02-23-18:17
-->
<template>
  <div>
    <table-crud
      ref="tableCrud"
      :menu="true"
      :search-form.sync="searchForm"
      :tabs="tabList"
      search-label-width="100px"
      @on-load="loadData"
    >
      <!--标题-->
      <template v-slot:header>
        <span>采购需求编制</span>
      </template>
      <!--查询条件-->
      <template v-slot:search="search">
        <el-form-item
          ref="purchasePlanNo"
          label="采购申请编号"
          prop="purchasePlanNo"
        >
          <gx-input
            v-model.trim="searchForm.purchasePlanNo"
            @keyup.enter.native="search.onSearch"
          />
        </el-form-item>
        <!--采购计划名称-->
        <el-form-item
          ref="purchasePlanName"
          label="采购计划名称"
          prop="purchasePlanName"
        >
          <gx-input
            v-model.trim="searchForm.purchasePlanName"
            @keyup.enter.native="search.onSearch"
          />
        </el-form-item>
        <!--采购计划状态-->
        <el-form-item label="状态" prop="dataStatus">
          <el-select v-model="searchForm.dataStatus" filterable>
            <el-option
              v-for="item in planStatusList"
              :key="item.typecode"
              :label="item.typename"
              :value="item.typecode"
            />
          </el-select>
        </el-form-item>
        <!--创建日期-->
        <el-form-item label="创建日期" prop="date">
          <el-date-picker
            v-model="searchForm.datePicker"
            :value-format="elValueFormatDate"
            type="daterange"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            @change="onHandelTime"
          />
        </el-form-item>
      </template>
      <template v-slot:menuLeft>
        <div class="mb10">
          <el-button type="primary" @click="implementPurchase">
            录入采购需求
          </el-button>
        </div>
      </template>
      <template v-slot:GXTable>
        <el-table ref="smallTable" v-loading="loading" :data="tableData">
          <el-table-column type="index" label="序号" align="center" width="60" />
          <el-table-column
            prop="purchasePlanNo"
            label="采购申请编号"
            min-width="150"
            header-align="center"
            align="left"
          />
          <el-table-column
            prop="purchasePlanName"
            label="采购需求名称"
            header-align="center"
            align="left"
            min-width="220"
          />
          <el-table-column
            prop="purchaseDetailNum"
            label="行项目数量"
            header-align="center"
            align="right"
            min-width="110"
          />
          <el-table-column
            label="创建日期"
            align="center"
            min-width="110"
          >
            <template slot-scope="scope">
              {{ scope.row.createTime && $Moment(scope.row.createTime).format(momentDate) }}
            </template>
          </el-table-column>
          <el-table-column
            prop="planStatus"
            label="状态"
            header-align="center"
            align="center"
            min-width="90"
          >
            <template slot-scope="scope">
              {{ filterDictText(planStatusList,scope.row.planStatus ) }}
            </template>
          </el-table-column>
          <el-table-column label="操作" align="center" width="200">
            <template slot-scope="scope">
              <el-link
                type="primary"
                @click.stop="detail(scope.row)"
              >
                [查看]
              </el-link>
              <el-link
                v-if="searchForm.tabStatus==='02'"
                type="primary"
                @click.stop="edit(scope.row)"
              >
                [编辑]
              </el-link>
              <el-link
                type="primary"
              >
                [复制]
              </el-link>
              <el-link
                v-if="searchForm.tabStatus==='02'"
                type="primary"
                @click.stop="deleteHandel(scope.row)"
              >
                [删除]
              </el-link>
              <el-link v-if="purchasplanEntryAuditConfig&&(searchForm.tabStatus!=='02')" type="primary" @click.stop="handleFlow(scope.row)">
                [流程追踪]
              </el-link>
            </template>
          </el-table-column>
        </el-table>
      </template>
    </table-crud>
    <!--流程追踪查看弹框-->
    <flow-detail-dialog ref="tracingFlow" />
  </div>
</template>

<script>
/* api接口*/
import {
  listPurchasePlanMainPages, // 列表
  deletePurchasePlanMain // 移除
} from '@/api/procurement/purchasplan'
/* 公共参数方法*/
/* 公共组件*/
import flowDetailDialog from '@views/work/process/flowDetail-dialog' //  流程追踪组件
import { filterDictText } from '@/assets/js/utils' // 字典
export default {
  name: 'PurPlanningList',
  components: {
    flowDetailDialog // 流程追踪
  },
  mixins: [],
  data() {
    return {
      value: [], // 时间选择器搜索
      loading: true,
      /* -----------数据字典start-------------*/
      planStatusList: [], // 状态
      dictionaryType: ['planStatus'],
      /* -----------数据字典end-------------*/
      searchForm: {
        datePicker: [], // 选择开始时间结束时间
        createTimeBegin: '', // 创建开始时间
        createTimeEnd: '', // 创建结束时间
        dataStatus: '', // 采购计划状态
        purchasePlanNo: '', // 采购申请编号
        purchasePlanName: '', // 采购计划名称
        tabStatus: '00' // tabs默认值
      },
      tabList: [
        {
          name: '待提交',
          index: '02'
        },
        {
          name: '待审核',
          index: '00'
        },
        {
          name: '审核通过',
          index: '01'
        }
      ],
      tableData: [], // 表格数据
      purchasplanEntryAuditConfig: false
    }
  },
  created() {
    // 字典请求初始化
    this.getGroupType()
    // 根据键获取正式配置
    this.$store.dispatch('getSystemConfigValue', 'purchasplan-entry-audit-config').then(() => {
      this.purchasplanEntryAuditConfig = this.$store.getters.systemConfigVo.configType // true启动工作流 false普通审核
    }).catch(() => {
    })
  },
  methods: {
    filterDictText, // 数据字典查询
    // 数据字典查询
    getGroupType() {
      this.$store.dispatch('getGroupType', this.dictionaryType).then((data) => {
        // 遍历key存储相应的数据
        for (const key in data.bidTypeData) {
          /* 是否有数据*/
          if (data.bidTypeData[key]) {
            this[key] = data.bidTypeData[key]
          }
        }
      })
    },
    // 进入新增录入采购计划页面
    // compType/采购区分状态码 00采购 01框架
    implementPurchase() {
      this.$router.push({ name: 'purPlanningAdd' })
    },
    // 选择时间触发事件
    onHandelTime(val) {
      if (val) {
        this.searchForm.createTimeBegin = val[0]
        this.searchForm.createTimeEnd = val[1]
      }
    },
    // 获取数据
    loadData(params, callback, tabData) {
      if (tabData) {
        params.tabStatus = tabData.index
        this.searchForm.tabStatus = tabData.index
      }
      params.planType = '00' // 计划类型，00-采购计划;01-框架计划;
      listPurchasePlanMainPages(params)
        .then(response => {
          this.loading = false
          this.tableData = response.data.records
          callback(response.data.total)
        })
        .catch(() => {
          this.loading = false
        })
    },
    // 查看
    detail(row) {
      this.$router.push({
        name: 'purPlanningDetail',
        params: { planMainId: row.planMainId } // detailIder 00查看标识
      })
    },
    // 编辑
    edit(row) {
      this.$router.push({
        name: 'purPlanningAdd',
        params: { planMainId: row.planMainId, detailIder: '01' } // detailIder 01编辑标识
      })
    },
    // 删除
    deleteHandel(row) {
      this.$confirm('确定删除吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        confirmButtonClass: 'confirmBtn',
        cancelButtonClass: 'cancelBtn',
        type: 'warning'
      })
        .then(() => {
          // 删除项目
          // this.removeProject(row.planMainId)
          this.loading = true
          const params = {
            planMainId: row.planMainId
          }
          deletePurchasePlanMain(params).then((res) => {
            this.$message({ type: 'success', message: res.header.msg })
            // 查询数据
            this.$refs.tableCrud.onSearchChange()
          })
        })
        .catch(() => {})
    },
    // 流程追踪
    handleFlow(row) {
      this.$refs.tracingFlow.openDialogInitData(row.planMainId)
    }
  }
}
</script>

<style lang="less" scoped></style>
