mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-manage.git
synced 2025-12-20 00:06:47 +08:00
feat:合并
This commit is contained in:
lixg
@@ -6,30 +6,21 @@
|
||||
<div class="inpbox">
|
||||
<div class="inpbox1">
|
||||
<span>模版名称：</span>
|
||||
<a-input
|
||||
v-model:value="value1"
|
||||
style="
|
||||
<a-input v-model:value="value1" style="
|
||||
width: 270px;
|
||||
height: 40px;
|
||||
border-radius: 8px;
|
||||
margin-right: 14px;
|
||||
"
|
||||
placeholder="请输入项目名称"
|
||||
/>
|
||||
" placeholder="请输入项目名称" />
|
||||
</div>
|
||||
<div class="inpbox1">
|
||||
<span>创建时间：</span>
|
||||
<a-date-picker
|
||||
v-model="selectTime"
|
||||
type="date"
|
||||
placeholder="创建时间"
|
||||
style="
|
||||
width: 270px;
|
||||
height: 40px;
|
||||
border-radius: 8px;
|
||||
margin-right: 14px;
|
||||
"
|
||||
/>
|
||||
<a-date-picker v-model="selectTime" type="date" placeholder="创建时间" style="
|
||||
width: 270px;
|
||||
height: 40px;
|
||||
border-radius: 8px;
|
||||
margin-right: 14px;
|
||||
" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -46,14 +37,8 @@
|
||||
</div>
|
||||
<div class="tmpl_body">
|
||||
<div class="tmpl_tabbox">
|
||||
<a-table
|
||||
:columns="columns1"
|
||||
:data-source="tableData1"
|
||||
:loading="tableDataTotal === -1 ? true : false"
|
||||
expandRowByClick="true"
|
||||
@expand="expandTable"
|
||||
:pagination="false"
|
||||
/>
|
||||
<a-table :columns="columns1" :data-source="tableData1" :loading="tableDataTotal === -1 ? true : false"
|
||||
expandRowByClick="true" @expand="expandTable" :pagination="pagination" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -62,7 +47,7 @@
|
||||
<script>
|
||||
import { reactive, defineComponent, toRefs, onMounted } from "vue";
|
||||
import { message } from "ant-design-vue";
|
||||
import * as api from "@/api/indexLibrary";
|
||||
import * as api from "@/api/indexTemplate"
|
||||
const columns1 = [
|
||||
{
|
||||
title: "模版名称",
|
||||
@@ -115,6 +100,7 @@ export default defineComponent({
|
||||
creator: "李部长",
|
||||
stutime: "2022-10-31 23:12:00",
|
||||
operation: "operation",
|
||||
projectTemplateId: 1,
|
||||
},
|
||||
{
|
||||
key: "2",
|
||||
@@ -123,9 +109,9 @@ export default defineComponent({
|
||||
creator: "李部长",
|
||||
stutime: "2022-10-31 23:12:00",
|
||||
operation: "operation",
|
||||
},
|
||||
projectTemplateId: 2,
|
||||
}
|
||||
],
|
||||
// state
|
||||
});
|
||||
const getTableDate1 = () => {
|
||||
let data = state.tableData1;
|
||||
@@ -146,17 +132,9 @@ export default defineComponent({
|
||||
</router-link>
|
||||
</div>
|
||||
<div class="ops3">
|
||||
<div
|
||||
class="jc"
|
||||
onClick={() => {
|
||||
templateHadler({
|
||||
projectTemplateId: value.projectTemplateId,
|
||||
type: 0,
|
||||
});
|
||||
}}
|
||||
>
|
||||
撤回
|
||||
</div>
|
||||
<div class="jc"
|
||||
onClick={() => { templateHadler({ "projectTemplateId": value.projectTemplateId, "type": 0 }) }}
|
||||
>撤回</div>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
@@ -165,15 +143,8 @@ export default defineComponent({
|
||||
{value.status === "未发布" ? (
|
||||
<div class="nselect">
|
||||
<div class="ops1">
|
||||
<div
|
||||
class="jc"
|
||||
onClick={() => {
|
||||
templateHadler({
|
||||
projectTemplateId: value.projectTemplateId,
|
||||
type: 1,
|
||||
});
|
||||
}}
|
||||
>
|
||||
<div class="jc"
|
||||
onClick={() => { templateHadler({ "projectTemplateId": value.projectTemplateId, "type": 1 }) }}>
|
||||
发布
|
||||
<span style="color:#E9E9E9;margin-left:15px;">|</span>
|
||||
</div>
|
||||
@@ -187,17 +158,9 @@ export default defineComponent({
|
||||
</router-link>
|
||||
</div>
|
||||
<div class="ops3">
|
||||
<div
|
||||
class="jc"
|
||||
onClick={() => {
|
||||
templateHadler({
|
||||
projectTemplateId: value.projectTemplateId,
|
||||
type: -1,
|
||||
});
|
||||
}}
|
||||
>
|
||||
删除
|
||||
</div>
|
||||
<div class="jc"
|
||||
onClick={() => { templateHadler({ "projectTemplateId": value.projectTemplateId, "type": -1 }) }}
|
||||
>删除</div>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
@@ -210,67 +173,86 @@ export default defineComponent({
|
||||
});
|
||||
state.tableData = data;
|
||||
};
|
||||
const pagination = reactive({
|
||||
current: 1,
|
||||
total: 50,
|
||||
defaultPageSize: 10,
|
||||
onChange: (id) => { pagination.current = id; getLibraryList() },
|
||||
})
|
||||
getTableDate1();
|
||||
|
||||
onMounted(() => {
|
||||
getLibraryList();
|
||||
});
|
||||
})
|
||||
|
||||
// 获取模板列表
|
||||
const getLibraryList = () => {
|
||||
let obj = {
|
||||
beginTime: 0,
|
||||
endTime: 0,
|
||||
name: "",
|
||||
pageNo: 0,
|
||||
pageSize: 0,
|
||||
status: 0,
|
||||
};
|
||||
api
|
||||
.templateList(obj)
|
||||
.then((res) => {
|
||||
console.log(res);
|
||||
let resData = res.data.data.rows;
|
||||
if (resData.length) {
|
||||
for (let i in resData) {
|
||||
state.tableData1[i].id = i + 1;
|
||||
state.tableData1[i].projectTemplateId =
|
||||
resData[i].projectTemplateId;
|
||||
state.tableData1[i].status = resData[i].status
|
||||
? "已发布"
|
||||
: "未发布";
|
||||
state.tableData1[i].name = resData[i].name;
|
||||
state.tableData1[i].creator = resData[i].createName;
|
||||
state.tableData1[i].stutime = resData[i].publishTime;
|
||||
state.tableData1[i].operation = "operation";
|
||||
}
|
||||
} else {
|
||||
message.warning("获取的列表数据为空值");
|
||||
"beginTime": 0,
|
||||
"endTime": 0,
|
||||
"name": "",
|
||||
"pageNo": pagination.current,
|
||||
"pageSize": 10,
|
||||
"status": 0 || 1
|
||||
}
|
||||
api.templateList(obj).then((res) => {
|
||||
console.log(res);
|
||||
let resData = res.data.data.rows
|
||||
if (resData.length) {
|
||||
for (let i in resData) {
|
||||
state.tableData1[i].id = i + 1;
|
||||
state.tableData1[i].projectTemplateId = resData[i].projectTemplateId;
|
||||
state.tableData1[i].status = resData[i].status ? "已发布" : "未发布";
|
||||
state.tableData1[i].name = resData[i].name;
|
||||
state.tableData1[i].creator = resData[i].createName;
|
||||
state.tableData1[i].stutime = resData[i].publishTime;
|
||||
state.tableData1[i].operation = "operation";
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
message.error(`获取模板列表失败` + error);
|
||||
});
|
||||
|
||||
} else {
|
||||
message.warning("获取的列表数据为空值")
|
||||
}
|
||||
}).catch((error) => {
|
||||
message.error(`获取模板列表失败` + error)
|
||||
});
|
||||
};
|
||||
const templateHadler = (obj) => {
|
||||
api
|
||||
.templateHadle(obj)
|
||||
.then((res) => {
|
||||
if (res.data.success) {
|
||||
message.success(`模板操作成功`);
|
||||
getLibraryList();
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
message.error(`模板操作失败` + error);
|
||||
});
|
||||
};
|
||||
api.handleTemplates(obj).then((res) => {
|
||||
if (res.data.success) {
|
||||
message.success(`模板${obj.type == 1 ? '发布' : obj.type == 0 ? '撤回' : '删除'}成功`)
|
||||
getLibraryList();
|
||||
}
|
||||
}).catch((error) => {
|
||||
message.error(`模板${obj.type == 1 ? '发布' : obj.type == 0 ? '撤回' : '删除'}失败` + error)
|
||||
})
|
||||
}
|
||||
const searchLevel = () => {
|
||||
const result = state.tableData1.filter(
|
||||
(item) => item.name == state.value1
|
||||
);
|
||||
state.tableData1 = [
|
||||
{
|
||||
key: "1",
|
||||
name: "测试模板1",
|
||||
status: "已发布",
|
||||
creator: "李部长",
|
||||
stutime: "2022-10-31 23:12:00",
|
||||
operation: "operation",
|
||||
projectTemplateId: 1,
|
||||
},
|
||||
{
|
||||
key: "2",
|
||||
name: "测试模板2",
|
||||
status: "未发布",
|
||||
creator: "李部长",
|
||||
stutime: "2022-10-31 23:12:00",
|
||||
operation: "operation",
|
||||
projectTemplateId: 2,
|
||||
}
|
||||
];
|
||||
const result = state.tableData1.filter(item => item.name.includes(state.value1))
|
||||
state.tableData1 = result;
|
||||
getTableDate1()
|
||||
};
|
||||
const resetLevel = () => {
|
||||
state.value1 = "";
|
||||
state.value1 = '';
|
||||
// getLibraryList();
|
||||
state.tableData1 = [
|
||||
{
|
||||
@@ -280,6 +262,7 @@ export default defineComponent({
|
||||
creator: "李部长",
|
||||
stutime: "2022-10-31 23:12:00",
|
||||
operation: "operation",
|
||||
projectTemplateId: 1,
|
||||
},
|
||||
{
|
||||
key: "2",
|
||||
@@ -288,8 +271,10 @@ export default defineComponent({
|
||||
creator: "李部长",
|
||||
stutime: "2022-10-31 23:12:00",
|
||||
operation: "operation",
|
||||
},
|
||||
];
|
||||
projectTemplateId: 2,
|
||||
}
|
||||
]
|
||||
getTableDate1()
|
||||
};
|
||||
|
||||
return {
|
||||
@@ -298,6 +283,7 @@ export default defineComponent({
|
||||
templateHadler,
|
||||
searchLevel,
|
||||
resetLevel,
|
||||
pagination,
|
||||
};
|
||||
},
|
||||
});
|
||||
@@ -305,8 +291,10 @@ export default defineComponent({
|
||||
<style lang="scss">
|
||||
.templatelibrary {
|
||||
width: 100%;
|
||||
|
||||
.tmpl {
|
||||
width: 100%;
|
||||
|
||||
.tmpl_header {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
@@ -315,25 +303,30 @@ export default defineComponent({
|
||||
|
||||
margin-left: 32px;
|
||||
margin-right: 32px;
|
||||
|
||||
.tmplh_inp {
|
||||
.inpbox {
|
||||
display: flex;
|
||||
margin-top: 32px;
|
||||
|
||||
.inpbox1 {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-right: 24px;
|
||||
|
||||
span {
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tmplh_btn {
|
||||
display: flex;
|
||||
margin-left: 38px;
|
||||
margin-top: 32px;
|
||||
|
||||
.btn {
|
||||
padding: 0px 26px 0px 26px;
|
||||
height: 38px;
|
||||
@@ -344,72 +337,90 @@ export default defineComponent({
|
||||
margin-left: 14px;
|
||||
cursor: pointer;
|
||||
flex-shrink: 0;
|
||||
|
||||
.search {
|
||||
background-size: 100%;
|
||||
}
|
||||
|
||||
.btnText {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
line-height: 36px;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.btnText1 {
|
||||
color: rgb(255, 255, 255);
|
||||
}
|
||||
|
||||
.btnText2 {
|
||||
color: rgba(64, 158, 255, 1);
|
||||
}
|
||||
}
|
||||
|
||||
.btn1 {
|
||||
background: #409eff;
|
||||
|
||||
.search {
|
||||
width: 15px;
|
||||
height: 17px;
|
||||
background-image: url("../../assets/images/courseManage/search0.png");
|
||||
}
|
||||
}
|
||||
|
||||
.btn2 {
|
||||
background: #ffffff;
|
||||
border: 1px solid #388be1;
|
||||
|
||||
.search {
|
||||
width: 16px;
|
||||
height: 18px;
|
||||
background-image: url("../../assets/images/courseManage/reset1.png");
|
||||
}
|
||||
}
|
||||
|
||||
.btn1:hover {
|
||||
background: rgb(255, 255, 255);
|
||||
border: 1px solid #388be1;
|
||||
|
||||
.search {
|
||||
background-image: url("../../assets/images/courseManage/search1.png");
|
||||
}
|
||||
|
||||
.btnText {
|
||||
color: rgba(64, 158, 255, 1);
|
||||
}
|
||||
}
|
||||
|
||||
.btn2:hover {
|
||||
background: rgba(64, 158, 255, 1);
|
||||
|
||||
.search {
|
||||
background-image: url("../../assets/images/courseManage/reset0.png");
|
||||
}
|
||||
|
||||
.btnText {
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tmpl_body {
|
||||
padding: 0px 30px;
|
||||
|
||||
.tmpl_tabbox {
|
||||
.operation {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: #4ea6ff;
|
||||
|
||||
.nselect {
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
display: flex;
|
||||
|
||||
.jc {
|
||||
margin-left: 20px;
|
||||
white-space: nowrap;
|
||||
|
||||
Reference in New Issue
Block a user