|
|
<template>
|
|
|
<div class="projectInfo-memo">
|
|
|
<div class="memo-top">
|
|
|
<el-row>
|
|
|
<el-form :inline="true" :model="formInline" size="small" ref="queryFrom">
|
|
|
<el-col :span="9">
|
|
|
<div class="project-info-top">
|
|
|
<div class="project-info">【备忘录】</div>
|
|
|
<el-button type="primary" icon="icon iconfont icon-jc-xinjian" size="mini" @click="newMemo">新建备忘录</el-button>
|
|
|
<el-button type="primary" icon="icon iconfont icon-jc-daoru" size="mini" @click="exportMemo" :loading="exportLoading">一键导出</el-button>
|
|
|
</div>
|
|
|
</el-col>
|
|
|
<el-col :span="15">
|
|
|
<el-form-item>
|
|
|
<!-- <el-date-picker
|
|
|
v-model="formInline.time"
|
|
|
type="datetime"
|
|
|
placeholder="选择备忘时间">
|
|
|
</el-date-picker> -->
|
|
|
<el-date-picker
|
|
|
class="ignoreElement"
|
|
|
v-model="memoTime"
|
|
|
format="yyyy-MM-dd HH:mm:ss"
|
|
|
value-format="yyyy-MM-dd HH:mm:ss"
|
|
|
type="datetimerange"
|
|
|
range-separator="至"
|
|
|
start-placeholder="开始时间"
|
|
|
end-placeholder="结束时间">
|
|
|
</el-date-picker>
|
|
|
</el-form-item>
|
|
|
<el-form-item>
|
|
|
<el-input v-model.trim="formInline.name" placeholder="请输入用户名、主题/关键字， 查询项目备忘"></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item class="query-item">
|
|
|
<el-button size="mini" @click="resetQuery('queryFrom')">重置</el-button>
|
|
|
<el-button size="mini" type="primary" @click="handleQuery('queryFrom')">查询</el-button>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-form>
|
|
|
</el-row>
|
|
|
</div>
|
|
|
<div class="memo-bottom" v-loading="loading">
|
|
|
<el-card :body-style="{ padding: '0px' }" v-for="(item,index) in memoList" :key="index"> <!-- 去除阴影 shadow="never -->
|
|
|
<div slot="header" class="clearfix">
|
|
|
<div class="clearfix-left">
|
|
|
<span>{{ item.name }}</span>
|
|
|
<span>{{ item.createTime }}</span>
|
|
|
</div>
|
|
|
<div class="clearfix-right">
|
|
|
<div class="clearfix-bianji" @click="putMemo(item)">
|
|
|
<i class="icon iconfont icon-jc-bianji-copy"></i>
|
|
|
编辑
|
|
|
</div>
|
|
|
<div class="clearfix-shanchu" @click="delMemo(item)">
|
|
|
<i class="icon iconfont icon-jc-shanchu-select"></i>
|
|
|
删除
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="clearfix-body">
|
|
|
<div class="memo-keyword">
|
|
|
<div class="memo-keyword-title">主题/关键字</div>
|
|
|
<div class="memo-keyword-content">
|
|
|
{{ item.keywords }}
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="memo-content">
|
|
|
<div class="memo-content-title">
|
|
|
备忘内容
|
|
|
</div>
|
|
|
<div class="memo-content-content">
|
|
|
{{ item.content }}
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</el-card>
|
|
|
</div>
|
|
|
<my-dialog :title="title" @close="memoClose" @confirm="confirm" :myclass="true" ref="newMemoRef">
|
|
|
<div class="memoDialog">
|
|
|
<el-form :model="memoData" size="small" ref="memoFrom" label-width="120px">
|
|
|
<el-form-item label="姓名" prop="name">
|
|
|
<el-input v-model="memoData.name" placeholder="请输入内容" disabled></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="备忘时间" prop="createTime">
|
|
|
<el-date-picker
|
|
|
disabled
|
|
|
v-model="memoData.createTime"
|
|
|
format="yyyy-MM-dd HH:mm:ss"
|
|
|
value-format="yyyy-MM-dd HH:mm:ss"
|
|
|
type="datetime"
|
|
|
placeholder="选择备忘时间">
|
|
|
</el-date-picker>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="主题/关键字" prop="keywords">
|
|
|
<el-input
|
|
|
type="textarea"
|
|
|
resize="none"
|
|
|
:rows="3"
|
|
|
placeholder="请输入主题/关键字"
|
|
|
v-model="memoData.keywords">
|
|
|
</el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="备忘内容" prop="content">
|
|
|
<el-input
|
|
|
type="textarea"
|
|
|
resize="none"
|
|
|
:rows="3"
|
|
|
placeholder="请输入备忘内容"
|
|
|
v-model="memoData.content">
|
|
|
</el-input>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
</div>
|
|
|
</my-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
import { getJMemorandumList, getJMemorandumId, postJMemorandum, putJMemorandum, delJMemorandum } from "@/api/jin_ji_hu/project/index"
|
|
|
import myDialog from "@/views/components/myDialog/index.vue"
|
|
|
export default {
|
|
|
components:{
|
|
|
myDialog
|
|
|
},
|
|
|
name:"tabFour",
|
|
|
data() {
|
|
|
return {
|
|
|
formInline:{
|
|
|
startTime:"",
|
|
|
endTime:"",
|
|
|
name:"",
|
|
|
type: "2",
|
|
|
projectId:undefined,
|
|
|
},
|
|
|
memoTime:[],
|
|
|
title:"新增备忘录",
|
|
|
memoData:{
|
|
|
name: "",
|
|
|
createTime: "",
|
|
|
keywords: "",
|
|
|
content: "",
|
|
|
type: "2",
|
|
|
projectId:undefined,
|
|
|
},
|
|
|
memoList:[],
|
|
|
loading:false,
|
|
|
// 导出遮罩层
|
|
|
exportLoading: false,
|
|
|
}
|
|
|
},
|
|
|
props:{
|
|
|
id:{
|
|
|
type:Number,
|
|
|
default:null,
|
|
|
}
|
|
|
},
|
|
|
mounted(){
|
|
|
this.formInline.projectId = Number(this.id);
|
|
|
this.memoData.projectId = Number(this.id);
|
|
|
this.getList();
|
|
|
},
|
|
|
methods:{
|
|
|
// 重置
|
|
|
resetQuery(){
|
|
|
this.formInline = {
|
|
|
startTime:"",
|
|
|
endTime:"",
|
|
|
name:"",
|
|
|
type: "2",
|
|
|
projectId:this.id,
|
|
|
}
|
|
|
this.memoTime = [];
|
|
|
this.getList();
|
|
|
},
|
|
|
// 搜索
|
|
|
handleQuery(){
|
|
|
this.formInline.startTime = this.memoTime[0];
|
|
|
this.formInline.endTime = this.memoTime[1];
|
|
|
this.getList();
|
|
|
},
|
|
|
// 新建备忘录
|
|
|
newMemo(){
|
|
|
this.title = "新建备忘录";
|
|
|
this.memoData = {
|
|
|
name: "",
|
|
|
createTime: "",
|
|
|
keywords: "",
|
|
|
content: "",
|
|
|
type: "2",
|
|
|
projectId:undefined,
|
|
|
}
|
|
|
this.$refs.newMemoRef.open();
|
|
|
this.memoData.projectId = Number(this.id);
|
|
|
this.memoData.name = this.$store.getters.name;
|
|
|
this.memoData.createTime = this.getDate();
|
|
|
},
|
|
|
// 导出
|
|
|
exportMemo(){
|
|
|
if(this.memoList.length > 0) {
|
|
|
this.$confirm("是否确认导出备忘录?", "警告", {
|
|
|
confirmButtonText: "确定",
|
|
|
cancelButtonText: "取消",
|
|
|
type: "warning",
|
|
|
})
|
|
|
.then(() => {
|
|
|
this.exportLoading = true;
|
|
|
this.download(
|
|
|
"/jjh/jMemorandum/export",
|
|
|
{
|
|
|
...this.formInline
|
|
|
},
|
|
|
"备忘录" + new Date().getTime() + ".xlsx"
|
|
|
);
|
|
|
this.exportLoading = false;
|
|
|
})
|
|
|
.catch(() => { });
|
|
|
} else {
|
|
|
this.$message({
|
|
|
type: "warning",
|
|
|
message: "备忘录列表为空，无法导出！",
|
|
|
});
|
|
|
}
|
|
|
},
|
|
|
// 获取备忘录列表
|
|
|
getList() {
|
|
|
this.loading = true;
|
|
|
getJMemorandumList(this.formInline).then(res=>{
|
|
|
// console.log(res,"获取到的备忘录列表");
|
|
|
this.memoList = res.data;
|
|
|
this.loading = false;
|
|
|
})
|
|
|
},
|
|
|
// 关闭备忘录
|
|
|
memoClose(){
|
|
|
// console.log("关闭弹框");
|
|
|
// this.clearKey(this.memoData)
|
|
|
this.$nextTick(()=>{
|
|
|
this.$refs.memoFrom.resetFields();
|
|
|
this.$refs.newMemoRef.close();
|
|
|
})
|
|
|
},
|
|
|
confirm(){
|
|
|
if(this.memoData.id) {
|
|
|
putJMemorandum(this.memoData).then(res=>{
|
|
|
if(res.code == 200) {
|
|
|
this.memoClose();
|
|
|
this.getList();
|
|
|
this.$message({
|
|
|
type: "success",
|
|
|
message: "修改成功!",
|
|
|
});
|
|
|
}
|
|
|
})
|
|
|
} else {
|
|
|
postJMemorandum(this.memoData).then(res=>{
|
|
|
if(res.code == 200) {
|
|
|
this.memoClose();
|
|
|
this.getList();
|
|
|
this.$message({
|
|
|
type: "success",
|
|
|
message: "新增成功!",
|
|
|
});
|
|
|
}
|
|
|
})
|
|
|
}
|
|
|
},
|
|
|
// 编辑备忘录
|
|
|
putMemo(row){
|
|
|
this.title = "编辑备忘录";
|
|
|
this.$refs.newMemoRef.open();
|
|
|
getJMemorandumId(row.id).then(res=>{
|
|
|
this.memoData = res.data;
|
|
|
})
|
|
|
},
|
|
|
// 删除备忘录
|
|
|
delMemo(row){
|
|
|
this.$confirm("此操作将永久删除该数据, 是否继续?", "提示", {
|
|
|
confirmButtonText: "确定",
|
|
|
cancelButtonText: "取消",
|
|
|
type: "warning",
|
|
|
})
|
|
|
.then(() => {
|
|
|
delJMemorandum(row.id).then((res) => {
|
|
|
this.getList();
|
|
|
this.$message({
|
|
|
type: "success",
|
|
|
message: "删除成功!",
|
|
|
});
|
|
|
});
|
|
|
})
|
|
|
.catch(() => {
|
|
|
this.$message({
|
|
|
type: "info",
|
|
|
message: "已取消删除",
|
|
|
});
|
|
|
});
|
|
|
},
|
|
|
// 获取当前年月日时分秒
|
|
|
getDate(){
|
|
|
const date = new Date();
|
|
|
var year = date.getFullYear(); // 获取当前年份
|
|
|
var month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1; // 获取当前月份（注意：月份是从 0 开始计数的，所以要加 1）
|
|
|
var day = date.getDate() < 10 ? '0' + date.getDate() : date.getDate(); // 获取当前日期
|
|
|
var hours = date.getHours(); // 获取当前小时
|
|
|
var minutes = date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes(); // 获取当前分钟
|
|
|
var seconds = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds(); // 获取当前秒数
|
|
|
return year + "-" + month + "-" + day + " " + hours + ":" + minutes + ":" + seconds;
|
|
|
},
|
|
|
},
|
|
|
}
|
|
|
</script>
|
