<template>
|
<!-- <div class="block">
|
<span class="leixing">类型</span>
|
<el-select v-model="value" class="m-2" placeholder="Select" size="large">
|
<el-option
|
v-for="item in options"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
/>
|
</el-select>
|
<span class="demonstration">时间</span>
|
<el-date-picker v-model="value" type="date" placeholder="Pick a day"
|
:shortcuts="shortcuts" :size="size" value-format="YYYY-MM-DD HH:mm:ss"/>
|
<el-button type="primary" icon="el-icon-search" @click="getListData()">搜索</el-button>
|
</div> -->
|
<el-form :inline="true" :model="formInline" class="demo-form-inline">
|
<el-form-item label="类型">
|
<el-select v-model="item" class="m-2" clearable placeholder="Select">
|
<el-option
|
v-for="item in options"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
/>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="时间">
|
<el-date-picker
|
v-model="value"
|
type="date"
|
placeholder="Pick a day"
|
:shortcuts="shortcuts"
|
value-format="YYYY-MM-DD HH:mm:ss"
|
/>
|
</el-form-item>
|
<el-form-item>
|
<el-button type="primary" @click="getListData">Query</el-button>
|
</el-form-item>
|
</el-form>
|
<el-table :data="tableData" style="width: 100%">
|
<el-table-column prop="reportTime1" label="时间"> </el-table-column>
|
<el-table-column prop="chanpin" label="产品" />
|
<el-table-column prop="leixing1" label="类型" />
|
<el-table-column prop="shengcx" label="产线" />
|
<el-table-column prop="banci" label="班次" />
|
<el-table-column prop="id" label="编号" />
|
<el-table-column prop="createDate" label="最新时间" />
|
<el-table-column prop="createdby" label="上传人" />
|
<el-table-column label="操作">
|
<template #default="scope">
|
<el-button
|
size="small"
|
type="primary"
|
@click="handleEdit(scope.$index, scope.row)"
|
>详情</el-button
|
>
|
</template>
|
</el-table-column>
|
</el-table>
|
<div class="page">
|
<el-pagination
|
background
|
layout="prev, pager, next"
|
:page-count="pageData.total"
|
:current-page="pageData.ListData.pageNo"
|
@current-change="handleCurrentChange"
|
/>
|
</div>
|
</template>
|
|
<script>
|
import { ref, reactive, onMounted } from "vue";
|
import { headPage, leixList } from "@/api/head";
|
import { useRouter } from "vue-router";
|
export default {
|
name: "NewsIndex",
|
components: {},
|
props: {},
|
setup() {
|
const router = useRouter();
|
const value = ref("");
|
const item = ref("");
|
let tableData = ref([]);
|
const formLabelWidth = "140px";
|
let options = ref([]);
|
let leixingMap = new Map();
|
let pageData = reactive({
|
ListData: {
|
pageNo: 1,
|
pageSize: 10,
|
},
|
total: 0,
|
});
|
let value2 = "";
|
|
const shortcuts = [
|
{
|
text: "今天",
|
value: new Date(),
|
},
|
{
|
text: "昨天",
|
value: () => {
|
const date = new Date();
|
date.setTime(date.getTime() - 3600 * 1000 * 24);
|
return date;
|
},
|
},
|
{
|
text: "一周前",
|
value: () => {
|
const date = new Date();
|
date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
|
return date;
|
},
|
},
|
];
|
const search = async () => {
|
pageData.ListData.shijian = value.value;
|
console.log("data manager....", value.value);
|
const data = await getListData(pageData.ListData);
|
|
parse(data);
|
};
|
|
const getOptions = async () => {
|
const data = await leixList();
|
console.log(".....leixing..", data);
|
options.value = data.result.map((node) => {
|
leixingMap.set(node.split("@")[1], node);
|
return {
|
value: node.split("@")[1],
|
label: node.split("@")[0],
|
};
|
});
|
console.log(".....leixing..", leixingMap);
|
};
|
getOptions();
|
|
function handleEdit(index, row) {
|
// console.log("xxxxxxxxxxxxxxx", index);
|
console.log(
|
"xxxxxxxxxxxxxxx",
|
row.leixing.substr(0, 1) + "0" + row.leixing.substr(1, 1)
|
);
|
// console.log("oooooooooooooooo");
|
if (row.leixing.indexOf("g") == 0 && row.leixing.length == 2) {
|
router.push({
|
path: "/" + row.leixing.substr(0, 1) + "0" + row.leixing.substr(1, 1),
|
query: {
|
id: row.id,
|
leixing: row.leixing,
|
},
|
});
|
} else
|
router.push({
|
path: "/" + row.leixing,
|
query: {
|
id: row.id,
|
leixing: row.leixing,
|
},
|
});
|
|
return handleEdit;
|
}
|
const formInline = reactive({
|
region: "",
|
});
|
const dialogFormVisible = ref(false);
|
//确定搜索动作
|
const onSubmit = () => {};
|
//请求列表方法leixList
|
const getListData = async () => {
|
pageData.ListData.shijian = value.value;
|
pageData.ListData.leixing = item.value;
|
const data = await headPage(pageData.ListData);
|
// console.log("data manager....", data);
|
|
parse(data);
|
};
|
function parse(e) {
|
console.log(".....search 2", e);
|
pageData.total = Math.ceil(e.data.total / pageData.ListData.pageSize);
|
tableData.value = e.data.records;
|
tableData.value.filter((item) => {
|
if (item.reportTime != null && item.reportTime.length > 0) {
|
options.value;
|
item.reportTime1 = item.reportTime.substr(0, 10);
|
item.leixing1 = leixingMap.get(item.leixing);
|
}
|
|
return item;
|
});
|
}
|
// 分页器
|
const handleCurrentChange = (val) => {
|
pageData.ListData.pageNo = val;
|
|
getListData();
|
};
|
//删除用户
|
const handleDelete = (val) => {
|
// console.log(val);
|
};
|
//新增用户
|
const addUser = () => {};
|
|
getListData();
|
|
function showState(row, column, cellValue, index) {
|
// console.log("row", row);
|
// console.log("col", column);
|
// console.log("cel", cellValue);
|
// console.log("index", index);
|
if (cellValue === 0) return "正常";
|
else return "异常";
|
}
|
return {
|
item,
|
value,
|
getListData,
|
pageData,
|
options,
|
onSubmit,
|
formInline,
|
tableData,
|
handleCurrentChange,
|
handleDelete,
|
showState,
|
dialogFormVisible,
|
formLabelWidth,
|
addUser,
|
handleEdit,
|
|
shortcuts,
|
search,
|
leixingMap,
|
};
|
},
|
};
|
</script>
|
<style lang="scss" scoped>
|
.page {
|
display: flex;
|
justify-content: flex-end;
|
margin-top: 20px;
|
}
|
|
.header_nox {
|
text-align: right;
|
}
|
</style>
|
