满额活动增加card样式

seller/src/views/promotion/full-discount/full-discount.vue

@@ -1,29 +1,12 @@
 <template>
   <div class="search">
     <Card>
-      <Form
+      <Form ref="searchForm" :model="searchForm" inline :label-width="70" class="search-form">
-        ref="searchForm"
-        :model="searchForm"
-        inline
-        :label-width="70"
-        class="search-form"
-      >
         <Form-item label="活动名称">
-          <Input
+          <Input type="text" v-model="searchForm.promotionName" placeholder="请输入活动名称" clearable style="width: 200px" />
-            type="text"
-            v-model="searchForm.promotionName"
-            placeholder="请输入活动名称"
-            clearable
-            style="width: 200px"
-          />
         </Form-item>
         <Form-item label="活动状态" prop="promotionStatus">
-          <Select
+          <Select v-model="searchForm.promotionStatus" placeholder="请选择" clearable style="width: 200px">
-            v-model="searchForm.promotionStatus"
-            placeholder="请选择"
-            clearable
-            style="width: 200px"
-          >
             <Option value="NEW">未开始</Option>
             <Option value="START">已开始/上架</Option>
             <Option value="END">已结束/下架</Option>
@@ -31,13 +14,7 @@
           </Select>
         </Form-item>
         <Form-item label="活动时间">
-          <DatePicker
+          <DatePicker v-model="selectDate" type="daterange" clearable placeholder="选择起始时间" style="width: 200px">
-            v-model="selectDate"
-            type="daterange"
-            clearable
-            placeholder="选择起始时间"
-            style="width: 200px"
-          >
           </DatePicker>
         </Form-item>
         <Form-item>
@@ -60,54 +37,21 @@
         </template>
         <template slot-scope="{ row }" slot="action">
           <div>
-            <Button
+            <Button type="primary" v-if="row.promotionStatus == 'NEW'" size="small" @click="edit(row)">编辑</Button>
-              type="primary"
-              v-if="row.promotionStatus == 'NEW'"
-              size="small"
-              @click="edit(row)"
-              >编辑</Button
-            >
             <Button type="info" v-else size="small" @click="edit(row)">查看</Button>
-            <Button
+            <Button type="success" v-if="row.promotionStatus === 'START'" style="margin-left: 5px" size="small"
-              type="success"
+              @click="openOrClose(row)">关闭</Button>
-              v-if="row.promotionStatus === 'START'"
+            <Button type="success" v-if="row.promotionStatus === 'CLOSE'" style="margin-left: 5px" size="small"
-              style="margin-left: 5px"
+              @click="openOrClose(row)">开启</Button>
-              size="small"
+            <Button type="error" :disabled="row.promotionStatus == 'START'" style="margin-left: 5px" size="small"
-              @click="openOrClose(row)"
+              @click="del(row)">删除</Button>
-              >关闭</Button
-            >
-            <Button
-              type="success"
-              v-if="row.promotionStatus === 'CLOSE'"
-              style="margin-left: 5px"
-              size="small"
-              @click="openOrClose(row)"
-              >开启</Button
-            >
-            <Button
-              type="error"
-              :disabled="row.promotionStatus == 'START'"
-              style="margin-left: 5px"
-              size="small"
-              @click="del(row)"
-              >删除</Button
-            >
           </div>
         </template>
       </Table>
       <Row type="flex" justify="end" class="page operation">
-        <Page
+        <Page :current="searchForm.pageNumber" :total="total" :page-size="searchForm.pageSize" @on-change="changePage"
-          :current="searchForm.pageNumber"
+          @on-page-size-change="changePageSize" :page-size-opts="[10, 20, 50]" size="small" show-total show-elevator
-          :total="total"
+          show-sizer></Page>
-          :page-size="searchForm.pageSize"
-          @on-change="changePage"
-          @on-page-size-change="changePageSize"
-          :page-size-opts="[10, 20, 50]"
-          size="small"
-          show-total
-          show-elevator
-          show-sizer
-        ></Page>
       </Row>
     </Card>
   </div>
@@ -354,6 +298,8 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
+@import "@/styles/table-common.scss";
+
 .operation {
   margin: 10px 0;
 }