src/views/baseSpecialAction/infoForm.vue

<template>
  <!-- 专项行动填报情况 -->
  <el-dialog
    title="行动情况"
    :close-on-click-modal="false"
    :visible.sync="visible"
    class="NCC-dialog NCC-dialog_center"
    lock-scroll
    width="70%"
  >
    <el-row :gutter="15" style="height: 65vh" class="NCC-dialog-content">
        <el-col :span="24" style="margin-bottom: 20px;">
            <el-col :span="12" class="form-item">
                <div class="label w-100">行动标题：</div>
                <div>{{ form.title }}</div>
            </el-col>
            <el-col :span="12" class="form-item">
                <div class="label w-100">截止日期：</div>
                <div>{{ ncc.dateFormat(form.deadline) }}</div>
            </el-col>
        </el-col>
        <el-col :span="24" style="height: calc(100% - 100px);">
            <NCC-table :data="tableData" style="width: 100%" v-loading="loading" stripe>
              <el-table-column prop="originName" label="传达区县/外协" />
              <el-table-column prop="state" label="状态">
                <template slot-scope="scope">
                  <el-tag :type="scope.row.state == '已填写' ? 'success' : 'warning'">{{scope.row.state}}</el-tag>
                </template>
              </el-table-column>
              <el-table-column label="操作" fixed="right" >
                <template slot-scope="scope">
                  <FormDialog :row="scope.row" :isDetail="true" />
                </template>
              </el-table-column>
            </NCC-table>
            <pagination :total="total" :page.sync="listQuery.currentPage" :limit.sync="listQuery.pageSize" @pagination="initList"/>
        </el-col>
    </el-row>
    <span slot="footer" class="dialog-footer">
      <el-button @click="close">取 消</el-button>
    </span>
    <NCCForm v-if="dialogVisible" ref="NCCForm" />
  </el-dialog>
</template>
<script>
import request from "@/utils/request";
import NCCForm from '@/views/baseSpecialAction/dynamicModel/list/Form'
export default {
  components: { NCCForm },
  props: [],
  data() {
    return {
      loading: false,
      visible: false,
      tableData: [{}],
      listQuery: {
        currentPage: 1,
        pageSize: 20,
      },
      total: 0,
      form: {},
      dialogVisible: false,
    };
  },
  computed: {},
  watch: {},
  created() {},
  mounted() {},
  methods: {
    close() {
        this.form = {};
        this.$emit("refresh");
    },
    init(row) {
        this.form = row;
        this.visible = true;
        this.loading = true;
        this.$nextTick(() => {
            this.initList();
        })
    },
    initList() {
        request({
            url: `/Extend/BaseSpecialActionInfo/GetListById`,
            method: "GET",
            params: {
              ...this.listQuery,
              specialActionId: this.form.id,
            },
          }).then((res) => {
            this.tableData = res.data.list;
            this.total = res.data.pagination.total;
            this.loading = false;
          });
        }
    },
    toDetailForm(row) {
      console.log(row);
      
      // this.dialogVisible = true;
      // var  Itemid = row.itemId || '';//数据id，没有的话就是新增 ，有的话就是修改
      // var  modelId = row.formId;//关联的表单id
      // var taskId = row.id; // 当前专项行动id
      // var isPreview = false;//固定死，值不变
      // var useFormPermission = false;//固定死，值不变
      // var formData = [];
      // request({
      //   url: '/visualdev/OnlineDev/'+modelId+'/Config',
      //   method: "GET",
      //   params:null
      // }).then(res => {
      //   formData = res.data.formData;
      //   this.$refs.NCCForm.init(formData, modelId, Itemid, isPreview, useFormPermission, taskId)
      // });
    },
};
</script>
<style lang="scss" scoped>
.NCC-dialog {
    :deep(.el-table__body-wrapper.is-scrolling-none) {
      height: calc(100% - 47px);
      overflow-y: scroll;
    }
    :deep(.el-pagination__total) {
        color: #606266;
    }
    :deep(.el-pagination__jump) {
        color: #606266;
    }
}
</style>