123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369 |
- <style scoped lang="scss">
- ::v-deep a {
- color: #409eff;
- display: block;
- }
- </style>
- <template>
- <div class="app-container">
- <div></div>
- <el-form
- :model="queryParams"
- ref="queryForm"
- size="small"
- :inline="true"
- v-show="showSearch"
- label-width="100px"
- >
- <el-form-item label="商品名称" prop="itemTitle">
- {{ $route.query ? $route.query.name : "-" }}
- </el-form-item>
- <el-form-item label="商品Id" prop="itemId">
- {{ $route.query ? $route.query.id : "-" }}
- </el-form-item>
- <br/>
- <el-form-item label="达人名称" prop="promoterNickName">
- <el-input
- v-model="queryParams.promoterNickName"
- placeholder="请输入达人名称"
- clearable
- style="width: 240px"
- @keyup.enter.native="handleQuery"
- />
- </el-form-item>
- <el-form-item label="达人Id" prop="promoterId">
- <el-input
- v-model.number="queryParams.promoterId"
- placeholder="请输入达人Id"
- clearable
- style="width: 240px"
- @keyup.enter.native="handleQuery"
- />
- </el-form-item>
- <el-form-item label="人员名称" prop="userId">
- <el-select
- filterable
- v-model="queryParams.userId"
- placeholder="人员名称"
- clearable
- style="width: 240px"
- >
- <el-option
- v-for="item in queryParamsList.personList"
- :key="item.userId"
- :label="item.nickMame"
- :value="item.userId"
- >
- <div style="display: flex">
- <span
- style="
- width: 10px;
- height: 10px;
- border-radius: 50%;
- background-color: green;
- position: relative;
- top: 12px;
- margin-right: 5px;
- "
- :style="
- item.status == '0'
- ? 'backgroundColor:green'
- : 'backgroundColor:red'
- "
- >{{ item.value }}</span
- ><span>{{ item.nickMame }}</span>
- </div>
- </el-option>
- </el-select>
- </el-form-item>
- <el-form-item>
- <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery"
- >搜索
- </el-button
- >
- <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
- <el-button
- type="warning"
- plain
- icon="el-icon-download"
- size="mini"
- @click="handleExport"
- :loading="downLoadLoading"
- >导出
- </el-button
- >
- </el-form-item>
- </el-form>
- <el-table
- v-loading="loading"
- :data="typeList"
- @selection-change="handleSelectionChange"
- ref="multipleTable"
- >
- <!-- <el-table-column type="selection" width="55" align="center" /> -->
- <el-table-column label="达人名称" align="center" prop="promoterNickName">
- <template slot-scope="scope">
- <a @click="toIndexDetail(scope.row)">
- {{ scope.row.promoterNickName }}
- </a>
- </template>
- </el-table-column>
- <el-table-column label="达人Id" align="center" prop="promoterId"/>
- <el-table-column label="绑定人" align="center" prop="userName"/>
- <el-table-column label="订单数" align="center" prop="orderNum"></el-table-column>
- <el-table-column label="有效订单数" align="center" prop="validOrderNUm"/>
- <el-table-column label="有效率" align="center" prop="validRadio">
- <template slot-scope="scope">
- {{ scope.row.validRadio ? (scope.row.validRadio * 100).toFixed(2) + "%" : "-" }}
- </template>
- </el-table-column>
- <el-table-column label="发货数" align="center" prop="deliveryNum">
- </el-table-column>
- <el-table-column
- label="发货率"
- align="center"
- prop="shippingGreen"
- >
- <template slot-scope="scope">
- {{
- scope.row.shippingGreen
- ? (scope.row.shippingGreen * 100).toFixed(2) + "%"
- : "-"
- }}
- </template>
- </el-table-column>
- <el-table-column label="有效发货数" align="center" prop="effDeliveryNum">
- </el-table-column>
- <el-table-column label="有效发货率" align="center" prop="deliveryRadio">
- <template slot-scope="scope">
- {{
- scope.row.deliveryRadio
- ? (scope.row.deliveryRadio * 100).toFixed(2) + "%"
- : "-"
- }}
- </template>
- </el-table-column>
- <el-table-column label="未发货数" align="center" prop="notDeliveryNum">
- </el-table-column>
- <el-table-column label="付款金额" align="center" prop="payAmount">
- <template slot-scope="scope">
- {{ allMoney(scope.row.payAmount / 100) }}
- </template>
- </el-table-column>
- <el-table-column label="服务费率" align="center" prop="regimentalPromotionRate">
- <template slot-scope="scope">
- {{ scope.row.regimentalPromotionRate / 10 + "%" }}
- </template>
- </el-table-column>
- </el-table>
- <pagination
- v-show="total > 0"
- :total="total"
- :page.sync="queryParams.pageNum"
- :limit.sync="queryParams.pageSize"
- @pagination="getItemDetail"
- />
- </div>
- </template>
- <script>
- import {
- listType,
- getType,
- delType,
- addType,
- updateType,
- refreshCache,
- } from "@/api/system/dict/type";
- import {getOrderList, getItemDetail, downFilePost, getSupplyChainUserList} from "@/api/supplyChain/supplyChain";
- var echarts = require("echarts");
- export default {
- name: "sale",
- dicts: ["sys_normal_disable"],
- data() {
- return {
- downLoadLoading: false,
- dialogTableVisible: false,
- logPage: {
- pageNum: 1,
- pageSize: 10,
- },
- logData: [],
- logTotal: 0,
- logLoading: false,
- // 遮罩层
- loading: true,
- // 选中数组
- ids: [],
- // 非单个禁用
- single: true,
- // 非多个禁用
- multiple: true,
- // 显示搜索条件
- showSearch: true,
- // 总条数
- total: 0,
- // 字典表格数据
- typeList: [],
- // 弹出层标题
- title: "",
- // 是否显示弹出层
- open: false,
- // 分配销售
- openAllocation: false,
- // 选择的销售id
- saleId: undefined,
- // 获取用户id
- userId: undefined,
- // 销售列表
- saleList: [],
- // 分配销售确定loading
- confirmLoadingSale: false,
- // 日期范围
- dateRange: [],
- // 查询参数
- queryParams: {
- pageNum: 1,
- pageSize: 10,
- promoterId: undefined,
- promoterNickName: undefined,
- orderStartDate: undefined,
- orderEndDate: undefined,
- },
- uploadDate: [new Date(), new Date()],
- //查询参数所用下拉数据
- queryParamsList: {
- personList: [],
- },
- };
- },
- created() {
- if (
- this.$route &&
- this.$route.query.id &&
- this.$route.query.orderStartDate &&
- this.$route.query.orderEndDate
- ) {
- this.getItemDetail();
- }
- },
- mounted() {
- this.$nextTick(() => {
- this.getPersonList();
- });
- },
- methods: {
- /** 导出按钮操作 */
- handleExport() {
- this.downLoadLoading = true;
- downFilePost("/isv/supply_chain/exportItemDetail", {
- ...this.queryParams,
- orderStartDate: this.$route.query.orderStartDate,
- orderEndDate: this.$route.query.orderEndDate,
- itemId: this.$route.query.id,
- }).then((res) => {
- let blob = new Blob([res], {
- type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
- });
- let downloadElement = document.createElement("a");
- let href = window.URL.createObjectURL(blob); //创建下载的链接
- downloadElement.href = href;
- downloadElement.download = `商品_${this.$route.query.name}${this.$route.query.orderStartDate}-${this.$route.query.orderEndDate}详情.xlsx`; //下载后文件名
- document.body.appendChild(downloadElement);
- downloadElement.click(); //点击下载
- document.body.removeChild(downloadElement); //下载完成移除元素
- window.URL.revokeObjectURL(href); //释放掉blob对象
- this.downLoadLoading = false;
- });
- },
- getPersonList() {
- getSupplyChainUserList().then((response) => {
- this.queryParamsList.personList = response.rows;
- });
- },
- toDetail(id) {
- },
- toIndexDetail(item) {
- this.$router.replace({
- path: "/supplyChain/kuaishou/indexDetails",
- query: {
- id: item.promoterId,
- name: item.promoterNickName,
- orderStartDate: this.$route.query.orderStartDate,
- orderEndDate: this.$route.query.orderEndDate,
- },
- });
- },
- getItemDetail() {
- this.loading = true;
- getItemDetail({
- ...this.queryParams,
- orderStartDate: this.$route.query.orderStartDate,
- orderEndDate: this.$route.query.orderEndDate,
- itemId: this.$route.query.id,
- }).then((response) => {
- this.typeList = response.rows;
- this.total = response.total;
- this.loading = false;
- });
- },
- /** 查询字典类型列表 */
- getList() {
- this.loading = true;
- getOrderList(
- this.addDateRange(
- this.queryParams,
- this.uploadDate,
- "orderStartDate",
- "orderEndDate"
- )
- ).then((response) => {
- this.typeList = response.rows;
- this.total = response.total;
- this.loading = false;
- });
- },
- // 取消按钮
- cancel() {
- this.open = false;
- this.confirmLoading = false;
- this.reset();
- },
- // 表单重置
- reset() {
- this.form = {};
- this.dateFile = null;
- this.resetForm("form");
- },
- /** 搜索按钮操作 */
- handleQuery() {
- this.queryParams.pageNum = 1;
- this.getItemDetail();
- },
- /** 重置按钮操作 */
- resetQuery() {
- this.dateRange = [];
- // let date = new Date();
- // let y = date.getFullYear();
- // let MM = date.getMonth() + 1;
- // MM = MM < 10 ? "0" + MM : MM;
- // let dd = date.getDate();
- // dd = dd < 10 ? "0" + dd : dd;
- // this.uploadDate = [`${y}-${MM}-${dd}`, `${y}-${MM}-${dd}`];
- this.resetForm("queryForm");
- this.queryParams.pageNum = 1;
- this.handleQuery();
- },
- // 多选框选中数据
- handleSelectionChange(selection) {
- this.ids = selection.map((item) => item.id);
- },
- },
- };
- </script>
|