MemoDialog.vue

<template>
	<div>
		<el-dialog v-dialogDrag title="备忘录" :visible="visible" width="60%" @close="handleCloseWarning" destroy-on-close v-if="visible">
			<div class="contentTable">
				<c-paging-table :data="memoData" :columns="memoColumns" style="width: 100%" :pageNumber="pagenation.pageNum" :pageSize="pagenation.pageSize"
				  :total="pagenation.total" @queryFunc="queryFunc">
					<c-table-column fixed="right" prop="op" label="操作" width="125px" >
						<template slot-scope="{ scope }">
							<span @click="doEdit(scope.row)" >修改</span>
							<span @click="doDisplay(scope.row)" style="margin-left:8px;margin-right:8px;">详情</span>
							<span @click="doDelete(scope.row)">删除</span>
						</template>
					</c-table-column>
				</c-paging-table>
			</div>
			<span slot="footer" class="dialog-footer">
				<el-button type="primary" @click="doAdd">新增</el-button>
			</span>
		</el-dialog>
		<MemoInfo 
			:modelVisible="modelVisible" 
			:opType="opType" 
			@closeMemoIofo="closeMemoIofo" 
			:modelInfo="modelInfo" 
		></MemoInfo>
	</div>
</template>
<script>
import MemoInfo from "./MemoInfo.vue";
import Api from "~/service/Api";

export default {
  components: {
    MemoInfo
  },
  props: {
    visible: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      memoColumns: [
        { prop: "dat", label: "提示日期", width:"110px"},
        { prop: "cod", label: "备忘录原因", width:"118px"},
        { prop: "objref", label: "业务编号" , width:"110px" },
        { prop: "nam", label: "描述", width:"80px" },
        { prop: "inifrm", label: "交易码", width:"95px" },
        { prop: "diamodflg", label: "Status" },
        { prop: "repusr", label: "柜员",width:"80px" },
        { prop: "ownusg", label: "业务组",width:"80px" },
        { prop: "ptyextkey", label: "客户编号", width:"110px"},
        { prop: "ptynam", label: "客户名称", width:"118px" },
        { prop: "paycur", label: "付款币种",width:"80px" },
        { prop: "payamt", label: "付款金额", width:"118px" },
				{ prop: "prechkdat", label: "预计核验日期", width:"140px" }
      ],
      memoData: [],
      modelVisible: false,
      modelInfo: {},
      opType: "",
      pagenation: {
        pageNum: 1,
        pageSize: 5,
        total: 0
			},
    };
	},
  watch: {
    visible(show) {
      if (show) {
        this.init();
      }
    }
  },
  methods: {
    async init() {
			
      let params = {
				objref:"", //rec.ownref
			  inifrm: this.$route.name,
        pageSize: this.pagenation.pageSize,
        pageNum: this.pagenation.pageNum
      };
      let rtnmsg = await Api.post("/public/diasel/queryByPage", params);
      if (rtnmsg.respCode == SUCCESS) {
        this.memoData = rtnmsg.data.list;
        this.pagenation.pageNum = rtnmsg.data.pageNumber;
        this.pagenation.pageSize = rtnmsg.data.pageSize;
        this.pagenation.total = rtnmsg.data.total;
      }
    },
    queryFunc(pageNumber, pageSize) {
      this.pagenation.pageNum = pageNumber;
      this.pagenation.pageSize = pageSize;
      this.init();
    },
    handleCloseWarning() {
      this.$emit("closeMemoIofo");
		},
		//修改
    doEdit(row) {
      this.opType = "edit";
			this.modelInfo = row;
			this.modelVisible = true;
		},
		//新增
    doAdd() {
				//先改值再打开
			this.modelInfo={ };
			this.opType = "add";
      this.modelVisible = true;
		},
		//详情
    doDisplay(row) {
      this.opType = "display";
			this.modelInfo = row;
			this.modelVisible = true;
		},
		//删除
    async doDelete(row) {
      this.$confirm("是否删除, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(async () => {
          try {
           const rtnmsg = await Api.post("/public/diasel/deleteById", {
              inr: row.inr
            });
            this.$message({
              type: "success",
              message: "删除成功!"
            });
            this.init();
          } catch (error) {
            console.log(error);
          }
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除"
          });
        });
		},
    closeMemoIofo() {
			this.modelVisible = false;
			if(!this.opType =="display"){
	       this.init()
			}
    }
  }
};
</script>
<style scoped lang="less">
</style>