one push

.env.development

@@ -1,4 +1,6 @@
 NODE_ENV = development
 VUE_APP_BASE_URL = '/'
 VUE_APP_PUB_URL = '/'
-PROXY_API_URL = 'https://t-promoter.58duke.com/'
+PROXY_API_URL = 'https://t-promoter.58duke.com/'
+
+MAIN_API_URL = 'https://t-promoter.58duke.com/'

src/api/index.ts

@@ -105,7 +105,7 @@ export const getADPlanlist = (
     status: string;
     begin_date: any;
     end_date: any;
-    cost_order:number;
+    cost_order: number;
     page: number;
   }> = { page: 1, status: "AD_STATUS_DELIVERY_OK" }
 ): AxiosPromise<IList<ADPlanItem>> => {
@@ -280,7 +280,7 @@ export const setBackConfig = (data: {
   rate: number;
   condition: string;
   price: number;
-  float_rate:string | number;
+  float_rate: string | number;
 }) => {
   return axios.post("/setReportConfig", data);
 };
@@ -363,8 +363,8 @@ export const setGroupStatus = (data: {
 //广告组账户列表
 export const getAdgroupData = (
   query: Partial<{
-    advertiser_id: string| number;
-    account_id: string| number;
+    advertiser_id: string | number;
+    account_id: string | number;
     page: number;
     begin_date: string;
     end_date: string;
@@ -377,15 +377,15 @@ export const getAdgroupData = (
 export const setGroupDay = (data: {
   advertiser_id: string | number;
   budget_mode: string;
-  budget?:number | string;
+  budget?: number | string;
 }) => {
   return axios.post("/ad/updateAdvertiserBudget", data);
 };
 
 //获取自定义所有列
-export const getCoustomClomuns = (): AxiosPromise<any> =>{
+export const getCoustomClomuns = (): any => {
   return axios("/ad/getFields");
-}
+};
 
 //设置站点回传比例
 export const setChannelRate = (data: {
@@ -393,4 +393,9 @@ export const setChannelRate = (data: {
   channel_id: string;
 }) => {
   return axios.post("/setChannelConfig", data);
-}; 
+};
+
+//保存自定义列
+export const setCoustomClomuns = (data: any): any => {
+  return axios.post("/ad/saveFields", {fields:data});
+};

src/components/drag-wrapper/index.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2021-01-21 15:28:08
- * @LastEditTime: 2021-01-21 15:28:09
+ * @LastEditTime: 2021-01-22 17:05:22
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: \precise_delivery_distribution_front\src\components\drag-wrapper\index.vue
@@ -34,6 +34,7 @@ const DragWrapper = defineComponent({
   setup(props) {},
   methods: {
     onDrop(dropResult: DropResult) {
+      //console.log(dropResult)
       const result = this.doDropDataAction(this.source, dropResult);
       this.$emit("after-drag", result);
     },

src/components/edit-cell/index.vue

@@ -144,6 +144,7 @@ export default EditableCell;
     position: absolute;
     right: 0;
     width: 20px;
+    top:5px;
     cursor: pointer;
   }
 

src/plugins/install.ts

@@ -6,6 +6,7 @@ import {
   Form,
   Input,
   Layout,
+  Checkbox,
   Radio,
   Menu,
   message,
@@ -50,6 +51,7 @@ const install = (app: App<Element>) => {
     .use(Form)
     .use(Affix)
     .use(Tabs)
+    .use(Checkbox)
     .use(Input)
     .use(Button)
     .use(Select)

src/scss/index.scss

@@ -89,6 +89,7 @@ body {
     content: " ";
     clear: both;
     height: 0;
+    zoom: 1;
   }
 }
 

src/views/_pageOptions/table-account.ts

@@ -19,11 +19,7 @@ export const TableColumnOfAccount = [
     dataIndex: "channel_id",
     ellipsis: true,
   },
-  {
-    title: "推广员",
-    dataIndex: "nickname",
-    ellipsis: true,
-  },
+
   {
     title: "开始/结束时间",
     dataIndex: "start_time",

src/views/_pageOptions/table-put.ts

@@ -8,6 +8,7 @@ export const TableColumnOfPutBooks = [
     title: "公众号名称",
     dataIndex: "official_name",
     width: 150,
+    slots: { customRender: "official_name" },
   },
   {
     title: "书籍",
@@ -18,16 +19,17 @@ export const TableColumnOfPutBooks = [
     dataIndex: "delivery_platform",
     width: 120,
   },
-
   {
-    title: "开始时间",
+    title: "开始时间/结束时间",
     dataIndex: "start_time",
     width: 200,
+    slots: { customRender: "time" },
   },
   {
-    title: "结束时间",
-    dataIndex: "end_time",
-    width: 200,
+    title: "监测链接",
+    dataIndex: "monitor_link",
+    slots: { customRender: "link" },
+    width: 120,
   },
   {
     title: "操作",

src/views/put/component/customClomu.vue

@@ -1,18 +1,137 @@
 <template>
-  <div class="customized-column-content">
-    <div class="column-area">
-      <div class="column-select-panel">
-        <div class="panel-title-line">
-          可添加的列
+  <a-modal
+    v-model:visible="columnShow"
+    title="自定义列"
+    @ok="makeDine"
+    @cancel="cancelDine"
+    :width="722"
+    :confirm-loading="confirmLoading"
+    ok-text="应用自定义列"
+  >
+    <div class="customized-column-content">
+      <div class="column-area">
+        <div class="column-select-panel">
+          <div class="panel-title-line">
+            可添加的列
+          </div>
+          <div class="panel-content">
+            <div class="column-select-area column-select-area0">
+              <div class="column-group clearfix">
+                <div class="group-title ad-d-flex">
+                  <span>广告</span>
+                </div>
+                <div class="column-items clearfix">
+                  <div class="column-item">
+                    <a-checkbox
+                      v-model:checked="checkedadAll"
+                      :indeterminate="adIndeterminate"
+                      @change="onCheckAllChange('ad')"
+                    >
+                      全选
+                    </a-checkbox>
+                  </div>
+
+                  <a-checkbox-group
+                    v-model:value="adCheckedList"
+                    @change="onCheckChange('ad')"
+                  >
+                    <div class="column-item" v-for="ad in adList">
+                      <a-checkbox :value="ad.name" @change="checkOne">
+                        {{ ad.desc }}
+                      </a-checkbox>
+                    </div>
+                  </a-checkbox-group>
+                </div>
+              </div>
+              <div class="column-group clearfix">
+                <div class="group-title ad-d-flex">
+                  <span>数据</span>
+                </div>
+                <div class="column-items clearfix">
+                  <div class="column-item">
+                    <a-checkbox
+                      v-model:checked="checkedstatAll"
+                      :indeterminate="statIndeterminate"
+                      @change="onCheckAllChange('stat')"
+                    >
+                      全选
+                    </a-checkbox>
+                  </div>
+
+                  <a-checkbox-group
+                    v-model:value="statCheckedList"
+                    @change="onCheckChange('stat')"
+                  >
+                    <div class="column-item" v-for="ad in statList">
+                      <a-checkbox :value="ad.name" @change="checkOne">
+                        {{ ad.desc }}
+                      </a-checkbox>
+                    </div>
+                  </a-checkbox-group>
+                </div>
+              </div>
+            </div>
+          </div>
         </div>
-      </div>
-      <div class="column-selected">
-        <div class="panel-title-line">
-          已选26列<span class="delete-all">清空全部</span>
+        <div class="column-selected">
+          <div class="panel-title-line">
+            <span
+              >已选{{ dragList.length }}列&nbsp;
+              <a-tooltip>
+                <template #title>
+                  拖动单项可以排序，左侧可以设置列宽,右侧移除列
+                </template>
+                <question-circle-outlined></question-circle-outlined>
+              </a-tooltip>
+            </span>
+
+            <span class="delete-all" @click="clearAll">清空全部</span>
+          </div>
+          <div class="panel-selected" ref="draged">
+            <drag-wrapper :source="dragList" @after-drag="sureDrag">
+              <template v-slot:default="slotProps">
+                <div class="selected-column-item">
+                  <a-popover title="额外参数" trigger="click">
+                    <template #content>
+                      <div class="hovers-content">
+                        <span class="label">列宽:</span
+                        ><a-input-number
+                          size="small"
+                          :min="60"
+                          :max="1000"
+                          v-model:value="slotProps.data.width"
+                        />
+                      </div>
+                      <!-- <div class="hovers-content">
+                        <span class="label">固定:</span
+                        ><a-radio-group
+                          v-model:value="slotProps.data.fixed"
+                          size="small"
+                        >
+                          <a-radio-button :value="true">
+                            固定列
+                          </a-radio-button>
+                          <a-radio-button :value="false">
+                            原始列
+                          </a-radio-button>
+                        </a-radio-group>
+                      </div> -->
+                    </template>
+                    <align-left-outlined></align-left-outlined>
+                  </a-popover>
+                  <p>{{ slotProps.data.desc }}</p>
+                  <close-outlined
+                    style="font-size:10px;color:#666;"
+                    @click="clearSingle(slotProps.data)"
+                  ></close-outlined>
+                </div>
+              </template>
+            </drag-wrapper>
+          </div>
         </div>
       </div>
     </div>
-  </div>
+  </a-modal>
 </template>
 <script lang="ts">
 import {
@@ -22,36 +141,247 @@ import {
   ref,
   watchEffect,
   onMounted,
+  onUpdated,
 } from "vue";
-import { getCoustomClomuns } from "@/api";
-interface itemLine {}
+import { getCoustomClomuns, setCoustomClomuns } from "@/api";
+import DragWrapper from "@/components/drag-wrapper/index.vue";
+import {
+  AlignLeftOutlined,
+  CloseOutlined,
+  QuestionCircleOutlined,
+} from "@ant-design/icons-vue";
+import state from "@/store/modules/app/state";
+interface itemLine {
+  desc: string;
+  name: string;
+  fixed?: boolean;
+  order: number;
+  type: string;
+  width?: number;
+  checked: boolean;
+}
+
+type adList = "adList" | "statList";
+type adCheckedList = "adCheckedList" | "statCheckedList";
+type checkedadAll = "checkedadAll" | "checkedstatAll";
+type adIndeterminate = "adIndeterminate" | "statIndeterminate";
+
 const CustomCloumn = defineComponent({
-  props: {},
-  setup(props) {
+  props: {
+    show: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  components: {
+    DragWrapper,
+    AlignLeftOutlined,
+    CloseOutlined,
+    QuestionCircleOutlined,
+  },
+  setup(props, { emit }) {
     const state = reactive({
-      ad: ref<any[]>([]),
+      adList: ref<itemLine[]>([]),
+      statList: ref<itemLine[]>([]),
+      adCheckedList: ref<string[]>([]),
+      statCheckedList: ref<string[]>([]),
+      dragList: ref<itemLine[]>([]),
+      checkedadAll: false,
+      checkedstatAll: false,
+      adIndeterminate: false,
+      statIndeterminate: false,
+      confirmLoading: false,
+      columnShow: props.show,
+    });
+    watchEffect(() => {
+      state.columnShow = props.show;
     });
-
     const getData = () => {
-      getCoustomClomuns().then((res) => {
-        console.log(res);
+      state.adCheckedList = [];
+      state.statCheckedList = [];
+      getCoustomClomuns().then((res: any) => {
+        let drawgList: Array<itemLine> = [];
+        let nad = res.data.ad.map((r: itemLine) => {
+          if (r.order > 0) {
+            state.adCheckedList.push(r.name);
+            drawgList.push(r);
+          }
+          r.type = "ad";
+          return r;
+        });
+        let nstat = res.data.stat.map((r: itemLine) => {
+          if (r.order > 0) {
+            state.statCheckedList.push(r.name);
+            drawgList.push(r);
+          }
+          r.type = "stat";
+          return r;
+        });
+        drawgList.sort((a, b) => {
+          return b.order - a.order;
+        });
+        state.dragList = drawgList;
+        state.adCheckedList.length > 0 &&
+        state.adCheckedList.length < nad.length
+          ? (state.adIndeterminate = true)
+          : state.adCheckedList.length == nad.length
+          ? (state.checkedadAll = true)
+          : (state.checkedadAll = false);
+        state.statCheckedList.length > 0 &&
+        state.statCheckedList.length < nstat.length
+          ? (state.statIndeterminate = true)
+          : state.statCheckedList.length == nstat.length
+          ? (state.checkedstatAll = true)
+          : (state.checkedstatAll = false);
+
+        state.adList = nad;
+        state.statList = nstat;
       });
     };
 
-    onMounted(() => {
-      getData();
+    onUpdated(() => {
+      if (props.show && state.confirmLoading == false) {
+        getData();
+      }
     });
+    return { ...toRefs(state) };
+  },
+  methods: {
+    onCheckAllChange(type: string) {
+      let otype = type == "stat" ? "ad" : "stat";
+      if (this[<checkedadAll>`checked${type}All`]) {
+        //全选
+        let list: Array<string> = [];
+        let dragList: Array<itemLine> = [];
+        this[<adList>`${type}List`].forEach((d) => {
+          list.push(d.name);
+          dragList.push(d);
+        });
+        this[<adCheckedList>`${type}CheckedList`] = list;
+        let moreDragList = this.dragList.filter((r) => {
+          return this[<adList>`${otype}List`].find((d) => d.name === r.name);
+        });
+        dragList = moreDragList.concat(dragList);
+        this.dragList = dragList;
+        this.toListDown();
+      } else {
+        //全部取消
+        let dragList: Array<itemLine> = [];
+        this[<adCheckedList>`${type}CheckedList`] = [];
+        dragList = this.dragList.filter((r) => {
+          return !this[<adList>`${type}List`].some((d) => d.name === r.name);
+        });
+        this.dragList = dragList;
+      }
+      this[<adIndeterminate>`${type}Indeterminate`] = false;
+    },
+    onCheckChange(type: string) {
+      this[<adIndeterminate>`${type}Indeterminate`] = !!(
+        this[<adCheckedList>`${type}CheckedList`].length > 0 &&
+        this[<adCheckedList>`${type}CheckedList`].length <
+          this[<adList>`${type}List`].length
+      );
+      this[<checkedadAll>`checked${type}All`] =
+        this[<adCheckedList>`${type}CheckedList`].length ===
+        this[<adList>`${type}List`].length;
+    },
+    sureDrag(list: Array<itemLine>) {
+      this.dragList = list;
+    },
+    toListDown() {
+      this.$nextTick(() => {
+        let element = this.$refs.draged;
+        let listHeight =
+          document &&
+          (document.querySelector(".smooth-dnd-container") as HTMLElement)
+            .offsetHeight;
+        if (listHeight && listHeight > 395) {
+          (element as HTMLElement).scrollTop = (listHeight as number) - 380;
+        }
+      });
+    },
+    checkOne(e: any) {
+      if (e.target.checked) {
+        let current = [...this.adList, ...this.statList].find((r) => {
+          return r.name == e.target.value;
+        });
+        current && this.dragList.push(current) && this.toListDown();
+      } else {
+        let dragList = this.dragList;
+        let newList = dragList.filter((r) => r.name != e.target.value);
+        this.dragList = newList;
+      }
+    },
+    clearSingle(item: itemLine) {
+      let type = item.type;
+      let dragList = this.dragList.filter((r) => r.name !== item.name);
+      let checkList = this[<adCheckedList>`${type}CheckedList`].filter(
+        (r) => r !== item.name
+      );
+      this[<adCheckedList>`${type}CheckedList`] = checkList;
+      this.dragList = dragList;
+      if (this[<adCheckedList>`${type}CheckedList`].length == 0) {
+        this[<adIndeterminate>`${type}Indeterminate`] = false;
+      }
+      if (this[<checkedadAll>`checked${type}All`]) {
+        this[<checkedadAll>`checked${type}All`] = false;
+        this[<adIndeterminate>`${type}Indeterminate`] = true;
+      }
+    },
+    clearAll() {
+      this.dragList = [];
+      this.adCheckedList = [];
+      this.statCheckedList = [];
+      this.adIndeterminate = false;
+      this.statIndeterminate = false;
+      this.checkedadAll = false;
+      this.checkedstatAll = false;
+    },
+    makeDine() {
+      this.confirmLoading = true;
+      let list: Array<itemLine> = [];
+      this.dragList.forEach((d, i) => {
+        list[i] = d;
+        list[i].order = this.dragList.length - i;
+        delete list[i].type;
+      });
 
-    return {};
+      setCoustomClomuns(list).then((res: any) => {
+        this.$message.success("保存自定义列成功");
+        this.confirmLoading = false;
+      }).catch((e:any)=>{
+        this.confirmLoading = false;
+      });
+      //this.$emit('dineClounmList')
+    },
+    cancelDine() {
+      this.$emit("closeClomnShow");
+    },
   },
-  methods: {},
 });
 
 export default CustomCloumn;
 </script>
 <style lang="scss" scoped>
+.hovers-content {
+  margin: 8px 0 5px;
+  display: flex;
+  align-items: center;
+  .label {
+    display: inline-block;
+    max-width: 50px;
+    width: 50px;
+  }
+  .ant-switch {
+    width: 50px;
+  }
+}
 .column-area {
   height: 445px;
+  .ad-d-flex {
+    display: flex;
+    align-items: center;
+  }
   .panel-title-line {
     background-color: #f9fafd;
     border: #e4e9ed 1px solid;
@@ -64,6 +394,31 @@ export default CustomCloumn;
     float: left;
     height: 445px;
     padding-bottom: 9px;
+    .panel-selected {
+      border: #e4e9ed 1px solid;
+      border-top: 0;
+      box-sizing: border-box;
+      height: 395px;
+      padding: 0 12px 12px 4px;
+      overflow-y: auto;
+      .selected-column-item {
+        width: 198px;
+        height: auto;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        background: #f8f8f8;
+        border-radius: 4px;
+        margin-top: 8px;
+        line-height: 18px;
+        padding: 5px 12px;
+
+        p {
+          padding: 0 5px;
+          cursor: move;
+        }
+      }
+    }
     .delete-all {
       cursor: pointer;
       font-size: 14px;
@@ -76,6 +431,45 @@ export default CustomCloumn;
     float: left;
     margin-right: 16px;
     height: 445px;
+    .panel-content {
+      border: #e4e9ed 1px solid;
+      border-top: 0;
+      box-sizing: border-box;
+      height: 395px;
+      padding: 0;
+      overflow: hidden;
+      .column-select-area {
+        height: 395px;
+        overflow-y: auto;
+        width: 100%;
+        .column-group {
+          border-bottom: #e4e9ed 1px solid;
+          padding: 0 16px;
+          .column-items {
+            margin-bottom: 4px;
+          }
+          .group-title {
+            cursor: pointer;
+            line-height: 46px;
+            font-size: 16px;
+            color: #333;
+            position: relative;
+          }
+          .column-item {
+            width: 188px;
+            float: left;
+            min-height: 34px;
+          }
+        }
+      }
+    }
+  }
+}
+</style>
+<style lang="scss">
+.selected-column-item {
+  .anticon {
+    cursor: pointer;
   }
 }
 </style>

src/views/put/put-ad-plan.vue

@@ -44,7 +44,7 @@
       <a-button type="primary" @click="openBackDrawer">
         回本数据
       </a-button>
-      <a-button type="primary" @click="openCustomLine">
+      <a-button type="primary" @click="openCustomLine" style="margin-left:10px;">
         自定义列
       </a-button>
     </div>
@@ -251,9 +251,8 @@
         :back_platform="register.back_platform"
       ></register-datad>
     </a-drawer>
-    <!-- <a-modal v-model:visible="columnShow" title="自定义列" @ok="makeDine" :width="722">
-      <custom-cloumn></custom-cloumn>
-    </a-modal> -->
+
+    <custom-cloumn :show="columnShow" @closeClomnShow="openCustomLine" @dineClounmList="dineClounmList"></custom-cloumn>
   </div>
 </template>
 
@@ -297,7 +296,7 @@ const PutAdPlan = defineComponent({
     PutCount,
     InfoCircleOutlined,
     RegisterDatad,
-    CustomCloumn
+    CustomCloumn,
   },
 
   setup() {
@@ -660,6 +659,14 @@ const PutAdPlan = defineComponent({
         this.popForm = list;
       });
     },
+    openCustomLine() {
+      this.columnShow = !this.columnShow;
+    },
+    dineClounmList(){
+      setTimeout(()=>{
+        location.reload();
+      },1500)
+    }
   },
 });
 
@@ -707,7 +714,4 @@ export default PutAdPlan;
     margin-right: 10px;
   }
 }
-
-
-
 </style>

src/views/put/put-book.vue

@@ -1,84 +1,126 @@
 <template>
   <div class="page-wrap page-wrap-put-books">
-    <tool-bar :text="['official_name', 'book_name']"
-              :label="['公众号名称', '书名']"
-              v-model:loading="searching"
-              @confirm="onSearch" />
+    <tool-bar
+      :text="['official_name', 'book_name']"
+      :label="['公众号名称', '书名']"
+      v-model:loading="searching"
+      @confirm="onSearch"
+    />
     <div class="operator-bar">
-      <a-button type="primary"
-                @click="open = true">添加</a-button>
+      <a-button type="primary" @click="open = true">添加</a-button>
     </div>
-    <a-table row-key="id"
-             :pagination="tablePageOptions"
-             :loading="loading"
-             :columns="columns"
-             :data-source="list"
-             bordered
-             :scroll="{ y: 500 }"
-             @change="onBookLoaded">
+    <a-table
+      row-key="id"
+      :pagination="tablePageOptions"
+      :loading="loading"
+      :columns="columns"
+      :data-source="list"
+      bordered
+      :scroll="{ y: 500 }"
+      @change="onBookLoaded"
+    >
+      <template #official_name="{record}">
+        <p @click="goPushData(record)">
+          <a href="javascript:;">{{record.official_name}}</a>
+        </p>
+      </template>
+      <template #time="{record}">
+        <p>起:{{ record.start_time }}</p>
+        <p v-show="record.end_time">止:{{ record.end_time }}</p>
+      </template>
+      <template #link="{record}">
+        <p
+          v-clipboard:copy="record.monitor_link"
+          v-clipboard:success="copySuccess"
+          v-show="record.monitor_link"
+        >
+          <a>复制监测链接</a>
+        </p>
+      </template>
       <template #operator="{record}">
-        <confirm-button :label="record.status ? '停止' : '已停止'"
-                        :disabled="!record.status"
-                        type="link"
-                        confirm-content="确定要停止该条内容吗？"
-                        @click="onStop(record)" />
+        <confirm-button
+          :label="record.status ? '停止' : '已停止'"
+          :disabled="!record.status"
+          type="link"
+          confirm-content="确定要停止该条内容吗？"
+          @click="onStop(record)"
+        />
       </template>
     </a-table>
     <!-- 添加 -->
-    <a-modal title="投放书籍添加"
-             width="400px"
-             destroy-on-close
-             v-model:visible="open"
-             :confirm-loading="inConfirm"
-             :after-close="onReset"
-             @ok="onAdd">
-      <a-form :model="addFormState"
-              :labelCol="labelCol"
-              :wrapperCol="wrapperCol">
+    <a-modal
+      title="投放书籍添加"
+      width="400px"
+      destroy-on-close
+      v-model:visible="open"
+      :confirm-loading="inConfirm"
+      :after-close="onReset"
+      @ok="onAdd"
+    >
+      <a-form
+        :model="addFormState"
+        :labelCol="labelCol"
+        :wrapperCol="wrapperCol"
+      >
         <a-form-item label="公众号名称">
           <a-select v-model:value="addFormState.official_id">
-            <a-select-option v-for="official in officials"
-                             :key="official.value"
-                             :value="official.value">
-              {{official.label}}
+            <a-select-option
+              v-for="official in officials"
+              :key="official.value"
+              :value="official.value"
+            >
+              {{ official.label }}
             </a-select-option>
           </a-select>
         </a-form-item>
         <a-form-item label="书籍">
           <a-popover :title="addFormState.book.name">
             <template #content>
-              <div class="popover-book-info"
-                   v-if="addFormState.book.id">
-                <p>书籍Bid: <span>{{ addFormState.book.bid }}</span></p>
-                <p>书籍Channel: <span>{{ addFormState.book.channel_name }}</span></p>
-                <p>上架状态: <span>{{ addFormState.book.is_on_shelf }}</span></p>
-                <p>上架时间: <span>{{ addFormState.book.shelf_time }}</span></p>
+              <div class="popover-book-info" v-if="addFormState.book.id">
+                <p>
+                  书籍Bid: <span>{{ addFormState.book.bid }}</span>
+                </p>
+                <p>
+                  书籍Channel: <span>{{ addFormState.book.channel_name }}</span>
+                </p>
+                <p>
+                  上架状态: <span>{{ addFormState.book.is_on_shelf }}</span>
+                </p>
+                <p>
+                  上架时间: <span>{{ addFormState.book.shelf_time }}</span>
+                </p>
               </div>
               <p v-else>请先输入要选择的书籍</p>
             </template>
-            <a-select show-search
-                      placeholder="请输入要搜索的书名"
-                      not-found-content="暂无数据"
-                      :default-active-first-option="false"
-                      :filter-option="false"
-                      :show-arrow="false"
-                      :value="addFormState.book.bid"
-                      @search="onBookSearch"
-                      @change="onBookCheck">
-              <a-select-option v-for="book in addFormState.books"
-                               :value="book.bid"
-                               :key="book">
-                {{book.name}}
+            <a-select
+              show-search
+              placeholder="请输入要搜索的书名"
+              not-found-content="暂无数据"
+              :default-active-first-option="false"
+              :filter-option="false"
+              :show-arrow="false"
+              :value="addFormState.book.bid"
+              @search="onBookSearch"
+              @change="onBookCheck"
+            >
+              <a-select-option
+                v-for="book in addFormState.books"
+                :value="book.bid"
+                :key="book"
+              >
+                {{ book.name }}
               </a-select-option>
             </a-select>
           </a-popover>
         </a-form-item>
         <a-form-item label="流量平台">
           <a-select v-model:value="addFormState.platform">
-            <a-select-option v-for="platform in platforms"
-                             :key="platform.value"
-                             :value="platform.value">
-              {{platform.label}}
+            <a-select-option
+              v-for="platform in platforms"
+              :key="platform.value"
+              :value="platform.value"
+            >
+              {{ platform.label }}
             </a-select-option>
           </a-select>
         </a-form-item>
@@ -124,7 +166,7 @@ const PutBooks = defineComponent({
   setup() {
     let { loading, meta, tablePageOptions } = usePagination();
 
-    const { store } = useApp();
+    const { store, router, route } = useApp();
     const { labelCol, wrapperCol } = useFormLayout();
 
     const state = reactive({
@@ -183,7 +225,12 @@ const PutBooks = defineComponent({
     const onBookCheck = (value: number, options: any) => {
       addFormState.book = options.key;
     };
-
+    const goPushData = (record: any) => {
+      router.push({
+        path: "/put/data",
+        query: { official_name: record.official_name },
+      });
+    };
     onMounted(onBookLoaded);
 
     return {
@@ -197,6 +244,7 @@ const PutBooks = defineComponent({
       onSearch,
       onBookCheck,
       onBookLoaded,
+      goPushData,
     };
   },
   methods: {
@@ -224,6 +272,9 @@ const PutBooks = defineComponent({
         this.inConfirm = false;
       }
     },
+    copySuccess() {
+      this.$message.success("复制成功");
+    },
     onReset() {
       this.addFormState = useReset(this.addFormState);
     },

src/views/put/put-data.vue

@@ -3,6 +3,7 @@
     <tool-bar
       :text="['official_name', 'book_name']"
       :label="['公众号名称', '书名']"
+      :defaultVal="defaultToolvalue"
       @confirm="onSearch"
       v-model:loading="inSearching"
     >
@@ -34,12 +35,11 @@
     <a-table
       :columns="columns"
       :data-source="list"
-      :scroll="{ x: 1200,y:600 }"
+      :scroll="{ x: 1200, y: 600 }"
       @change="handleTableChange"
       bordered
     >
     </a-table>
-
   </div>
 </template>
 
@@ -68,7 +68,7 @@ const PutData = defineComponent({
     ToolBar,
   },
   setup() {
-    const { router } = useApp();
+    const { router, route } = useApp();
     let { loading, meta, tablePageOptions } = usePagination();
     let listed: any = [];
     const state = reactive({
@@ -81,12 +81,20 @@ const PutData = defineComponent({
       drawercolumns: TableColumnOfMoreStat,
       inSearching: false,
       rangePick: picker,
+      defaultToolvalue: {},
       drawerinSearching: false,
       drawermeta: {},
       filterNumber: 7,
       show: false,
     });
-
+    if (route.query && route.query.official_name) {
+      state.defaultToolvalue = {
+        official_name: route.query.official_name,
+      };
+      state.fields = {
+        official_name: route.query.official_name,
+      };
+    }
     const getList = (query: any) => {
       let [begin_dates, end_dates] = state.pickered;
       let start_time = moment(begin_dates).format("YYYY-MM-DD");
@@ -126,13 +134,12 @@ const PutData = defineComponent({
             slots?: any;
             width?: string | number;
             fixed?: string;
-            ellipsis?: boolean,
+            ellipsis?: boolean;
           } = {
             title: item.desc,
             dataIndex: item.name,
-            ellipsis:true,
+            ellipsis: true,
             width: 120,
-
           };
           if (whiteList.includes(item.name)) {
             lolumnItem.fixed = "left";
@@ -142,8 +149,6 @@ const PutData = defineComponent({
         state.columns = columns;
       });
     };
-    getCloums();
-
     const handleTableChange = (pagination: PageOptions) => {
       const { current, pageSize, total } = pagination;
       let data = Object.assign(state.fields, {
@@ -154,7 +159,11 @@ const PutData = defineComponent({
     };
     onMounted(() => {
       getCloums();
-      getList({ page: 1, day_num: state.filterNumber });
+      getList({
+        page: 1,
+        day_num: state.filterNumber,
+        official_name: route.query?.official_name ?? "",
+      });
     });
     return {
       ...toRefs(state),