|
@@ -1,95 +1,144 @@
|
|
|
<template>
|
|
|
- <div>
|
|
|
- <el-dialog
|
|
|
- :title="$t('title.operationLog')"
|
|
|
- append-to-body
|
|
|
- top="5vh"
|
|
|
- width="60%"
|
|
|
- :visible.sync="dialogFormVisible"
|
|
|
+ <div class="app-container">
|
|
|
+ <div class="filter-container">
|
|
|
+ <el-input
|
|
|
+ :placeholder="$t('label.promotionName')"
|
|
|
+ style="width: 200px;"
|
|
|
+ clearable
|
|
|
+ class="filter-item"
|
|
|
+ v-model="listQuery.keywords"
|
|
|
+ @keyup.enter.native="handleFilter"
|
|
|
+ />
|
|
|
+ <el-button
|
|
|
+ v-waves
|
|
|
+ class="filter-item"
|
|
|
+ type="primary"
|
|
|
+ icon="el-icon-search"
|
|
|
+ @click="handleFilter"
|
|
|
+ >{{ $t("search") }}</el-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ <el-table
|
|
|
+ v-loading="listLoading"
|
|
|
+ :key="tableKey"
|
|
|
+ :data="list"
|
|
|
+ stripe
|
|
|
+ border
|
|
|
+ fit
|
|
|
+ highlight-current-row
|
|
|
+ style="width: 100%;"
|
|
|
>
|
|
|
- <div style="height: 72vh; overflow: auto">
|
|
|
- <el-table
|
|
|
- v-loading="listLoading"
|
|
|
- :key="tableKey"
|
|
|
- :data="list"
|
|
|
- stripe
|
|
|
- border
|
|
|
- fit
|
|
|
- highlight-current-row
|
|
|
- style="width: 100%;"
|
|
|
- >
|
|
|
- <el-table-column type="index" width="40"></el-table-column>
|
|
|
+ <el-table-column type="index" width="40"></el-table-column>
|
|
|
|
|
|
- <el-table-column
|
|
|
- :label="$t('label.operator')"
|
|
|
- align="center"
|
|
|
- width="220"
|
|
|
- show-overflow-tooltip
|
|
|
+ <el-table-column
|
|
|
+ :label="$t('shopifyPromotion.logType')"
|
|
|
+ align="center"
|
|
|
+ width="220"
|
|
|
+ visible-overflow-tooltip
|
|
|
+ >
|
|
|
+ <template v-slot="{ row }">
|
|
|
+ <span>{{ row.userName }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ :label="$t('shopifyPromotion.executionInfo')"
|
|
|
+ align="center"
|
|
|
+ width="220"
|
|
|
+ >
|
|
|
+ <template v-slot="{ row }">
|
|
|
+ <el-popover
|
|
|
+ placement="bottom-start"
|
|
|
+ width="400"
|
|
|
+ trigger="hover"
|
|
|
+ :content="row.remark"
|
|
|
>
|
|
|
- <template v-slot="{ row }">
|
|
|
- <span>{{ row.userName }}</span>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- :label="$t('label.operationTime')"
|
|
|
- align="center"
|
|
|
- width="220"
|
|
|
- show-overflow-tooltip
|
|
|
- >
|
|
|
- <template v-slot="{ row }">
|
|
|
- <span>{{ row.createTime }}</span>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
+ <span slot="reference" class="tooltip">{{ row.remark }}</span>
|
|
|
+ </el-popover>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
|
|
|
- <el-table-column
|
|
|
- :label="$t('label.operationMethod')"
|
|
|
- align="center"
|
|
|
- show-overflow-tooltip
|
|
|
+ <el-table-column :label="$t('shopifyPromotion.resultInfo')">
|
|
|
+ <template v-slot="{ row }">
|
|
|
+ <el-popover
|
|
|
+ placement="bottom-start"
|
|
|
+ width="400"
|
|
|
+ trigger="hover"
|
|
|
+ :content="row.remark"
|
|
|
>
|
|
|
- <template v-slot="{ row }">
|
|
|
- <span>{{ row.remark }}</span>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- <!-- 分页 -->
|
|
|
- <swPage
|
|
|
- v-if="total > 0"
|
|
|
- key="2"
|
|
|
- :listQuery="listQuery"
|
|
|
- :total="total"
|
|
|
- pos="btmRight"
|
|
|
- @retPage="getList"
|
|
|
- />
|
|
|
- </div>
|
|
|
-
|
|
|
- <template slot="footer">
|
|
|
- <el-button @click="dialogFormVisible = false"
|
|
|
- >{{ $t("tagsView.close") }}
|
|
|
- </el-button>
|
|
|
- </template>
|
|
|
- </el-dialog>
|
|
|
+ <span slot="reference" class="tooltip">{{ row.remark }}</span>
|
|
|
+ </el-popover>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ :label="$t('shopifyPromotion.logStatus')"
|
|
|
+ visible-overflow-tooltip
|
|
|
+ >
|
|
|
+ <template v-slot="{ row }">
|
|
|
+ <span>{{ row.remark }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ :label="$t('shopifyPromotion.executionTime')"
|
|
|
+ visible-overflow-tooltip
|
|
|
+ >
|
|
|
+ <template v-slot="{ row }">
|
|
|
+ <span>{{ row.remark }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ :label="$t('shopifyPromotion.operator')"
|
|
|
+ visible-overflow-tooltip
|
|
|
+ >
|
|
|
+ <template v-slot="{ row }">
|
|
|
+ <span>{{ row.remark }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ :label="$t('label.operation')"
|
|
|
+ align="center"
|
|
|
+ fixed="right"
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <a
|
|
|
+ class="active"
|
|
|
+ href="javascript:void(0)"
|
|
|
+ @click="visibleDetailDialog(scope.row)"
|
|
|
+ >{{ $t("details") }}</a
|
|
|
+ >
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <!-- 分页 -->
|
|
|
+ <swPage
|
|
|
+ v-if="total > 0"
|
|
|
+ key="2"
|
|
|
+ :listQuery="listQuery"
|
|
|
+ :total="total"
|
|
|
+ pos="btmRight"
|
|
|
+ @retPage="getList"
|
|
|
+ />
|
|
|
+ <DetailDialog :visible.sync="dialog.visible" :params="dialog.params" />
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import waves from "@/directive/waves"; // 水波纹指令
|
|
|
import SwPage from "@/views/common/swPage.vue";
|
|
|
-import ElContainer from "element-ui/packages/container/src/main";
|
|
|
import { promotionLogs } from "@/api/oms/order/promotion";
|
|
|
+import DetailDialog from "./component/promotionLogDetail.vue";
|
|
|
|
|
|
export default {
|
|
|
inject: ["reload"], //刷新
|
|
|
components: {
|
|
|
SwPage,
|
|
|
- ElContainer
|
|
|
+ DetailDialog
|
|
|
},
|
|
|
- name: "shopifyPromotionLogList",
|
|
|
+ name: "shopifyPromotionPromotionLogList",
|
|
|
directives: {
|
|
|
waves
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
- dialogFormVisible: false,
|
|
|
tableKey: 0,
|
|
|
list: [],
|
|
|
total: 0,
|
|
@@ -99,23 +148,23 @@ export default {
|
|
|
keywords: null,
|
|
|
page: 1,
|
|
|
limit: 10
|
|
|
+ },
|
|
|
+ dialog: {
|
|
|
+ visible: false,
|
|
|
+ params: {}
|
|
|
}
|
|
|
};
|
|
|
},
|
|
|
- created() {},
|
|
|
- computed: {},
|
|
|
+ created() {
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
methods: {
|
|
|
- handleOpen(id) {
|
|
|
- this.listQuery.promotionId = id;
|
|
|
- this.dialogFormVisible = true;
|
|
|
- this.retPage();
|
|
|
- },
|
|
|
getList() {
|
|
|
this.listLoading = true;
|
|
|
promotionLogs(this.listQuery)
|
|
|
.then(response => {
|
|
|
if (response.code === 200) {
|
|
|
- this.list = response.data.list;
|
|
|
+ this.list = response.data.list || arr;
|
|
|
this.total = response.data.total;
|
|
|
setTimeout(() => {
|
|
|
this.listLoading = false;
|
|
@@ -128,6 +177,17 @@ export default {
|
|
|
}, 0.5 * 1000);
|
|
|
});
|
|
|
},
|
|
|
+ handleFilter() {
|
|
|
+ this.listQuery.page = 1;
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+ visibleDetailDialog(row) {
|
|
|
+ this.dialog.visible = !this.dialog.visible;
|
|
|
+ this.dialog.params = row;
|
|
|
+ },
|
|
|
+ handleCloseDialog(params) {
|
|
|
+ this.dialog.visible = params;
|
|
|
+ },
|
|
|
retPage() {
|
|
|
this.listQuery.page = 1;
|
|
|
this.getList();
|
|
@@ -136,4 +196,12 @@ export default {
|
|
|
};
|
|
|
</script>
|
|
|
|
|
|
-<style scoped lang="scss"></style>
|
|
|
+<style scoped lang="scss">
|
|
|
+.tooltip {
|
|
|
+ white-space: nowrap;
|
|
|
+ min-width: 50px;
|
|
|
+}
|
|
|
+.active {
|
|
|
+ color: #ae8877;
|
|
|
+}
|
|
|
+</style>
|