|
|
@@ -0,0 +1,571 @@
|
|
|
+<template>
|
|
|
+ <!-- 订单-售后订单 -->
|
|
|
+ <div>
|
|
|
+ <Card :bordered="false" dis-hover class="ivu-mt" :padding="0">
|
|
|
+ <div class="new_card_pd">
|
|
|
+ <!-- 筛选条件 -->
|
|
|
+ <Form ref="pagination" inline :model="pagination" :label-width="labelWidth"
|
|
|
+ :label-position="labelPosition" @submit.native.prevent>
|
|
|
+
|
|
|
+ <FormItem label="选择员工:">
|
|
|
+ <Select v-model="pagination.member_id" class="input-add">
|
|
|
+ <Option v-for="(item, index) in ygList" :value="item.id" :key="index">{{ item.name }}
|
|
|
+ </Option>
|
|
|
+ </Select>
|
|
|
+ </FormItem>
|
|
|
+ <FormItem label="业绩类型:">
|
|
|
+ <Select v-model="pagination.type" class="input-add">
|
|
|
+ <Option v-for="(item, index) in num" :value="item.value" :key="index">{{ item.name }}
|
|
|
+ </Option>
|
|
|
+ </Select>
|
|
|
+ <Button type="primary" @click="orderSearch()">查询</Button>
|
|
|
+ </FormItem>
|
|
|
+ <!-- <FormItem label="订单搜索:" label-for="title">
|
|
|
+ <Input v-model="pagination.order_id" placeholder="请输入订单号" class="input-add mr14" />
|
|
|
+
|
|
|
+ </FormItem> -->
|
|
|
+ <!-- <FormItem label="退款时间:">
|
|
|
+ <DatePicker :editable="false" @on-change="onchangeTime" :value="pagination.time" format="yyyy/MM/dd"
|
|
|
+ type="daterange" placement="bottom-start" placeholder="自定义时间" class="input-add"
|
|
|
+ :options="options"></DatePicker>
|
|
|
+ </FormItem> -->
|
|
|
+ </Form>
|
|
|
+ </div>
|
|
|
+ </Card>
|
|
|
+ <Card :bordered="false" dis-hover class="ivu-mt">
|
|
|
+ <!-- 售后订单表格 -->
|
|
|
+ <Table :columns="thead" :data="tbody" ref="table" :loading="loading" highlight-row no-userFrom-text="暂无数据"
|
|
|
+ no-filtered-userFrom-text="暂无筛选结果">
|
|
|
+ <template slot-scope="{ row }" slot="order_id">
|
|
|
+ <span v-text="row.order_id" style="display: block"></span>
|
|
|
+ <span v-show="row.is_del === 1 && row.delete_time == null" class="span-del">用户已删除</span>
|
|
|
+ </template>
|
|
|
+ <template slot-scope="{ row }" slot="nickname">
|
|
|
+ <div>用户名:{{ row.real_name }}</div>
|
|
|
+ <div>手机号:{{ row.user_phone }}</div>
|
|
|
+ </template>
|
|
|
+ <template slot-scope="{ row, index }" slot="kf">
|
|
|
+ <span class="tabBox_pice">{{showName(row.work_member_id)}}</span>
|
|
|
+ </template>
|
|
|
+ <template slot-scope="{ row }" slot="info">
|
|
|
+ <div class="tabBox" v-for="(val, i) in row.info" :key="i">
|
|
|
+ <div class="tabBox_img" v-viewer>
|
|
|
+ <img v-lazy="val.slider_image" />
|
|
|
+ </div>
|
|
|
+ <span class="tabBox_tit">{{ val.store_name }}</span>
|
|
|
+ <span class="tabBox_pice">{{'¥' + val.pay_price}}</span>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template slot-scope="{ row, index }" slot="pay_price">
|
|
|
+ <span class="tabBox_pice">{{'¥' + showPrice(row.info)}}</span>
|
|
|
+ </template>
|
|
|
+ <template slot-scope="{ row, index }" slot="reservation_time">
|
|
|
+ <span class="tabBox_pice">{{showTime(row.reservation_time)}}</span>
|
|
|
+ </template>
|
|
|
+ <template slot-scope="{ row, index }" slot="store">
|
|
|
+ <span class="tabBox_pice">{{row.store.name}}</span>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template slot-scope="{ row }" slot="type">
|
|
|
+ <span v-if="row.type == 1">销售业绩</span>
|
|
|
+ <span v-if="row.type == 2">手工业绩</span>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template slot-scope="{ row }" slot="statusName">
|
|
|
+ <Tooltip theme="dark" max-width="300" :delay="600">
|
|
|
+ <div v-html="row.refund_reason" class="pt5"></div>
|
|
|
+ <div slot="content">
|
|
|
+ <div class="pt5">退款原因:{{row.refund_explain}}</div>
|
|
|
+ <div v-if="row.refund_goods_explain" class="pt5">退货原因:{{row.refund_goods_explain}}</div>
|
|
|
+ </div>
|
|
|
+ </Tooltip>
|
|
|
+ <div class="pictrue-box" v-if="row.refund_img">
|
|
|
+ <div v-viewer v-for="(item, index) in row.refund_img || []" :key="index">
|
|
|
+ <img class="pictrue mr10" v-lazy="item" :src="item" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template slot-scope="{ row, index }" slot="add_time">
|
|
|
+ <span class="tabBox_pice">{{showTime(row.add_time)}}</span>
|
|
|
+ </template>
|
|
|
+ <!-- <template slot-scope="{ row }" slot="statusGoodName">
|
|
|
+ <div v-html="row.refund_goods_explain" class="pt5"></div>
|
|
|
+ <div class="pictrue-box" v-if="row.refund_goods_img">
|
|
|
+ <div
|
|
|
+ v-viewer
|
|
|
+ v-for="(item, index) in row.refund_goods_img || []"
|
|
|
+ :key="index"
|
|
|
+ >
|
|
|
+ <img class="pictrue mr10" v-lazy="item" :src="item" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template> -->
|
|
|
+ <template slot-scope="{ row }" slot="action">
|
|
|
+ <a @click="changeMenu(row)" v-if="row.status == 0">修改服务员工</a>
|
|
|
+ </template>
|
|
|
+ </Table>
|
|
|
+ <div class="acea-row row-right page">
|
|
|
+ <Page :total="total" :current="pagination.page" show-elevator show-total @on-change="pageChange"
|
|
|
+ :page-size="pagination.limit" />
|
|
|
+ </div>
|
|
|
+ </Card>
|
|
|
+ <!-- 编辑 退款 退积分 不退款-->
|
|
|
+ <edit-from ref="edits" :FromData="FromData" @submitFail="submitFail"></edit-from>
|
|
|
+ <!-- 详情 -->
|
|
|
+ <details-from ref="detailss" :orderDatalist="orderDatalist" :orderId="orderId" :rowActive="rowActive"
|
|
|
+ :openErp="openErp"></details-from>
|
|
|
+ <!-- 备注 -->
|
|
|
+ <order-remark ref="remarks" remarkType="refund" :orderId="orderId" @submitFail="submitFail"></order-remark>
|
|
|
+ <!-- 记录 -->
|
|
|
+ <order-record ref="record"></order-record>
|
|
|
+ <Modal v-model="modals" scrollable title="选择员工" class="order_box" :closable="false">
|
|
|
+ <Form :label-width="80">
|
|
|
+ <FormItem label="员工:" prop="chooseId">
|
|
|
+ <Select v-model="chooseId" style="width: 250px">
|
|
|
+ <Option v-for="item in ygList" :key="item.id" :value="item.id">{{ item.name }}</Option>
|
|
|
+ </Select>
|
|
|
+ </FormItem>
|
|
|
+ </Form>
|
|
|
+ <div slot="footer">
|
|
|
+ <Button type="primary" @click="goCancal">提交</Button>
|
|
|
+ <Button @click="cancal">取消</Button>
|
|
|
+ </div>
|
|
|
+ </Modal>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import {
|
|
|
+ mapState
|
|
|
+ } from "vuex";
|
|
|
+ import {
|
|
|
+ orderRefundList,
|
|
|
+ orderList,
|
|
|
+ getOrdeDatas,
|
|
|
+ getDataInfo,
|
|
|
+ getRefundDataInfo,
|
|
|
+ getRefundFrom,
|
|
|
+ getRefundOrderFrom,
|
|
|
+ getnoRefund,
|
|
|
+ refundIntegral,
|
|
|
+ getDistribution,
|
|
|
+ writeUpdate,
|
|
|
+ getServeOrder,
|
|
|
+ member_update
|
|
|
+ } from "@/api/order";
|
|
|
+ import {
|
|
|
+ getYgList
|
|
|
+ } from "@/api/store"
|
|
|
+ import {
|
|
|
+ erpConfig
|
|
|
+ } from "@/api/erp";
|
|
|
+ import { getKpi } from "@/api/agent"
|
|
|
+ import editFrom from "@/components/from/from";
|
|
|
+ import timeOptions from "@/utils/timeOptions";
|
|
|
+ export default {
|
|
|
+ components: {
|
|
|
+ editFrom,
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ modals: false,
|
|
|
+ order_id: '',
|
|
|
+ ygList: [],
|
|
|
+ chooseId: 0,
|
|
|
+ openErp: false,
|
|
|
+ thead: [
|
|
|
+ {
|
|
|
+ title: "id",
|
|
|
+ align: "id",
|
|
|
+ key: "id",
|
|
|
+ minWidth: 50,
|
|
|
+ },{
|
|
|
+ title: "员工",
|
|
|
+ align: "name",
|
|
|
+ key: "name",
|
|
|
+ minWidth: 150,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "员工手机",
|
|
|
+ key: "mobile",
|
|
|
+ minWidth: 130,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "业绩值变动",
|
|
|
+ key: "performance",
|
|
|
+ minWidth: 130,
|
|
|
+ },
|
|
|
+
|
|
|
+ {
|
|
|
+ title: "业绩值分类",
|
|
|
+ slot: "type",
|
|
|
+ minWidth: 70,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "详情",
|
|
|
+ key: "content",
|
|
|
+ minWidth: 150,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "业绩值变动后",
|
|
|
+ key: "balance",
|
|
|
+ minWidth: 70,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "更新时间",
|
|
|
+ key: "create_time",
|
|
|
+ minWidth: 110,
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ tbody: [],
|
|
|
+ num: [{
|
|
|
+ name: '全部',
|
|
|
+ value: 0
|
|
|
+ },{
|
|
|
+ name: '销售业绩',
|
|
|
+ value: 1
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '手工业绩',
|
|
|
+ value: 2
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ orderDatalist: null,
|
|
|
+ loading: false,
|
|
|
+ FromData: null,
|
|
|
+ total: 0,
|
|
|
+ orderId: 0,
|
|
|
+ animal: 1,
|
|
|
+ pagination: {
|
|
|
+ type: 0,
|
|
|
+ member_id: 0,
|
|
|
+ page: 1,
|
|
|
+ limit: 15,
|
|
|
+ order_id: "",
|
|
|
+ time: "",
|
|
|
+ status: 0
|
|
|
+ },
|
|
|
+ options: timeOptions,
|
|
|
+ timeVal: [],
|
|
|
+ modal: false,
|
|
|
+ qrcode: null,
|
|
|
+ name: "",
|
|
|
+ spin: false,
|
|
|
+ rowActive: {},
|
|
|
+ };
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapState("order", ["orderChartType"]),
|
|
|
+ // ...mapState("admin/layout", ["isMobile"]),
|
|
|
+ labelWidth() {
|
|
|
+ return this.isMobile ? undefined : 96;
|
|
|
+ },
|
|
|
+ labelPosition() {
|
|
|
+ return this.isMobile ? "top" : "right";
|
|
|
+ },
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.getYgList()
|
|
|
+ this.getErpConfig();
|
|
|
+ this.getOrderList();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ showName( id) {
|
|
|
+ let yg = this.ygList.find(item => {
|
|
|
+ return item.id == id
|
|
|
+ })
|
|
|
+ console.log(yg,'ygygygyg')
|
|
|
+ return yg? yg.name: ''
|
|
|
+ },
|
|
|
+ getYgList() {
|
|
|
+ getYgList({
|
|
|
+ page: 1,
|
|
|
+ limit: 1000
|
|
|
+ }).then(res => {
|
|
|
+ this.ygList = res.data.list
|
|
|
+ })
|
|
|
+ },
|
|
|
+ showTime(time) {
|
|
|
+ var date = new Date(time * 1000);
|
|
|
+ var year = date.getFullYear(); // 获取年份
|
|
|
+ var month = ("0" + (date.getMonth() + 1)).slice(-2); // 获取月份(注意月份从 0 开始,需要加 1)
|
|
|
+ var day = ("0" + date.getDate()).slice(-2); // 获取日期
|
|
|
+ var hours = ("0" + date.getHours()).slice(-2); // 获取小时
|
|
|
+ var minutes = ("0" + date.getMinutes()).slice(-2); // 获取分钟
|
|
|
+ var seconds = ("0" + date.getSeconds()).slice(-2); // 获取秒钟
|
|
|
+ var dateString = year + "-" + month + "-" + day + " " + hours + ":" + minutes + ":" + seconds; // 自定义时间格式
|
|
|
+ return dateString
|
|
|
+ },
|
|
|
+ showPrice(list) {
|
|
|
+ let price = 0;
|
|
|
+ list.forEach(item => {
|
|
|
+ price += item.pay_price * 1
|
|
|
+ })
|
|
|
+ return price.toFixed(2)
|
|
|
+ },
|
|
|
+ //erp配置
|
|
|
+ getErpConfig() {
|
|
|
+ erpConfig().then(res => {
|
|
|
+ this.openErp = res.data.open_erp;
|
|
|
+ }).catch(err => {
|
|
|
+ this.$Message.error(err.msg);
|
|
|
+ })
|
|
|
+ },
|
|
|
+ onchangeCode(e) {
|
|
|
+ this.animal = e;
|
|
|
+ this.qrcodeShow();
|
|
|
+ },
|
|
|
+ // 具体日期搜索();
|
|
|
+ onchangeTime(e) {
|
|
|
+ console.log(e,'eeeeeee')
|
|
|
+ this.pagination.page = 1;
|
|
|
+ this.timeVal = e;
|
|
|
+ this.pagination.time = this.timeVal[0] ? this.timeVal.join("-") : "";
|
|
|
+ },
|
|
|
+ // 获取详情表单数据
|
|
|
+ getData(id, type) {
|
|
|
+ getRefundDataInfo(id)
|
|
|
+ .then(async (res) => {
|
|
|
+ if (!type) {
|
|
|
+ this.$refs.detailss.modals = true;
|
|
|
+ }
|
|
|
+ this.$refs.detailss.activeName = "detail";
|
|
|
+ this.orderDatalist = res.data;
|
|
|
+ // if (this.orderDatalist.orderInfo.refund_img) {
|
|
|
+ // try {
|
|
|
+ // this.orderDatalist.orderInfo.refund_img = JSON.parse(
|
|
|
+ // this.orderDatalist.orderInfo.refund_img
|
|
|
+ // );
|
|
|
+ // } catch (e) {
|
|
|
+ // this.orderDatalist.orderInfo.refund_img = [];
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ })
|
|
|
+ .catch((res) => {
|
|
|
+ this.$Message.error(res.msg);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 操作
|
|
|
+ changeMenu(row, name) {
|
|
|
+ console.log('dddddddddddddddd')
|
|
|
+ this.modals = true
|
|
|
+ this.order_id = row.id
|
|
|
+ },
|
|
|
+ cancal() {
|
|
|
+ this.modals = false
|
|
|
+ this.remark = ''
|
|
|
+ },
|
|
|
+ getygList() {
|
|
|
+ getYgList().then(res => {
|
|
|
+ console.log(res)
|
|
|
+ this.ygList = res.data.list
|
|
|
+ })
|
|
|
+ },
|
|
|
+ //goCancal
|
|
|
+ goCancal() {
|
|
|
+ if (this.chooseId == '') {
|
|
|
+ return this.$Message.error('请选择员工')
|
|
|
+ }
|
|
|
+ this.modals = false
|
|
|
+ member_update({
|
|
|
+ id: this.order_id,
|
|
|
+ work_member_id: this.chooseId
|
|
|
+ }).then(res => {
|
|
|
+ this.$Message.success(res.msg)
|
|
|
+ this.getOrderList()
|
|
|
+ }).catch(err => {
|
|
|
+ this.$Message.error(err.msg)
|
|
|
+ })
|
|
|
+
|
|
|
+ },
|
|
|
+ // 获取退款表单数据
|
|
|
+ getRefundData(id, refund_type) {
|
|
|
+ if (refund_type == 2) {
|
|
|
+ this.delfromData = {
|
|
|
+ title: "是否立即退货",
|
|
|
+ url: `/refund/agree/${id}`,
|
|
|
+ method: "get",
|
|
|
+ };
|
|
|
+ this.$modalSure(this.delfromData)
|
|
|
+ .then((res) => {
|
|
|
+ this.$Message.success(res.msg);
|
|
|
+ this.getOrderList();
|
|
|
+ this.getData(this.orderId, 1);
|
|
|
+ })
|
|
|
+ .catch((res) => {
|
|
|
+ this.$Message.error(res.msg);
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.$modalForm(getRefundOrderFrom(id)).then(() => {
|
|
|
+ this.getOrderList();
|
|
|
+ this.getData(this.orderId, 1);
|
|
|
+ this.$emit("changeGetTabs");
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 获取退积分表单数据
|
|
|
+ getRefundIntegral(id) {
|
|
|
+ refundIntegral(id)
|
|
|
+ .then(async (res) => {
|
|
|
+ this.FromData = res.data;
|
|
|
+ this.$refs.edits.modals = true;
|
|
|
+ })
|
|
|
+ .catch((res) => {
|
|
|
+ this.$Message.error(res.msg);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 删除单条订单
|
|
|
+ delOrder(row, data) {
|
|
|
+ if (row.is_del === 1) {
|
|
|
+ this.$modalSure(data)
|
|
|
+ .then((res) => {
|
|
|
+ this.$Message.success(res.msg);
|
|
|
+ this.getOrderList();
|
|
|
+ })
|
|
|
+ .catch((res) => {
|
|
|
+ this.$Message.error(res.msg);
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ const title = "错误!";
|
|
|
+ const content =
|
|
|
+ "<p>您选择的的订单存在用户未删除的订单,无法删除用户未删除的订单!</p>";
|
|
|
+ this.$Modal.error({
|
|
|
+ title: title,
|
|
|
+ content: content,
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 修改成功
|
|
|
+ submitFail() {
|
|
|
+ this.getOrderList();
|
|
|
+ this.getData(this.orderId, 1);
|
|
|
+ },
|
|
|
+ // 订单选择状态
|
|
|
+ selectChange2(tab) {
|
|
|
+ this.pagination.page = 1;
|
|
|
+ this.pagination.refund_type = tab;
|
|
|
+ this.getOrderList(tab);
|
|
|
+ },
|
|
|
+ // 不退款表单数据
|
|
|
+ getNoRefundData(id) {
|
|
|
+ this.$modalForm(getnoRefund(id)).then(() => {
|
|
|
+ this.getOrderList();
|
|
|
+ this.getData(this.orderId);
|
|
|
+ this.$emit("changeGetTabs");
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 订单列表
|
|
|
+ getOrderList() {
|
|
|
+ this.loading = true;
|
|
|
+ getKpi(this.pagination)
|
|
|
+ .then((res) => {
|
|
|
+ this.loading = false;
|
|
|
+ const {
|
|
|
+ count,
|
|
|
+ list,
|
|
|
+ num
|
|
|
+ } = res.data;
|
|
|
+ this.total = count;
|
|
|
+ this.tbody = list;
|
|
|
+ // this.num = num;
|
|
|
+ list.forEach((item) => {
|
|
|
+ if (item.id == this.orderId) {
|
|
|
+ this.rowActive = item;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ this.loading = false;
|
|
|
+ this.$Message.error(err.msg);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 分页
|
|
|
+ pageChange(index) {
|
|
|
+ this.pagination.page = index;
|
|
|
+ this.getOrderList();
|
|
|
+ },
|
|
|
+ nameSearch() {
|
|
|
+ this.pagination.page = 1;
|
|
|
+ this.getOrderList();
|
|
|
+ },
|
|
|
+ // 订单搜索
|
|
|
+ orderSearch() {
|
|
|
+ this.pagination.page = 1;
|
|
|
+ this.getOrderList();
|
|
|
+ },
|
|
|
+ // 配送信息表单数据
|
|
|
+ delivery(row) {
|
|
|
+ getDistribution(row.id)
|
|
|
+ .then(async (res) => {
|
|
|
+ this.FromData = res.data;
|
|
|
+ this.$refs.edits.modals = true;
|
|
|
+ })
|
|
|
+ .catch((res) => {
|
|
|
+ this.$Message.error(res.msg);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ },
|
|
|
+ };
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="stylus" scoped>
|
|
|
+ .span-del {
|
|
|
+ color: #ed4014;
|
|
|
+ display: block
|
|
|
+ }
|
|
|
+
|
|
|
+ .code {
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
+
|
|
|
+ .QRpic {
|
|
|
+ width: 180px;
|
|
|
+ height: 259px;
|
|
|
+
|
|
|
+ img {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .tabBox {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ .tabBox_img {
|
|
|
+ width: 30px;
|
|
|
+ height: 30px;
|
|
|
+
|
|
|
+ img {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .tabBox_tit {
|
|
|
+ width: 245px;
|
|
|
+ height: 30px;
|
|
|
+ line-height: 30px;
|
|
|
+ font-size: 12px !important;
|
|
|
+ margin: 0 2px 0 10px;
|
|
|
+ letter-spacing: 1px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .tabBox+.tabBox {
|
|
|
+ margin-top: 5px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .pictrue-box {
|
|
|
+ display: flex;
|
|
|
+ align-item: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .pictrue {
|
|
|
+ width: 25px;
|
|
|
+ height: 25px;
|
|
|
+ }
|
|
|
+</style>
|