From 089bf5d2378b3c4a61d795b2a92bede2c193b771 Mon Sep 17 00:00:00 2001
From: admin <344137771@qq.com>
Date: Tue, 06 Jan 2026 11:22:58 +0800
Subject: [PATCH] 1
---
src/views/modules/c2c/c2c-order-other-msg.vue | 939 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 939 insertions(+), 0 deletions(-)
diff --git a/src/views/modules/c2c/c2c-order-other-msg.vue b/src/views/modules/c2c/c2c-order-other-msg.vue
new file mode 100644
index 0000000..7fa7924
--- /dev/null
+++ b/src/views/modules/c2c/c2c-order-other-msg.vue
@@ -0,0 +1,939 @@
+<template>
+ <el-dialog
+ title="订单详情"
+ :close-on-click-modal="false"
+ :visible.sync="visible"
+ @close="handClose"
+ width="1200px"
+ class="transport-dialog"
+ >
+ <div class="allBox">
+ <!-- 左侧详情 -->
+ <div class="leftBox">
+ <div class="minibox" v-if="roleList.direction == 'buy'">
+ {{ roleList.c2c_user_nick_name }}向{{ roleList.username }}出售<span
+ class="moneyText"
+ >{{ roleList.coin_amount + roleList.symbol }}</span
+ >
+ </div>
+ <div class="minibox" v-if="roleList.direction == 'sell'">
+ {{ roleList.username }}向{{ roleList.c2c_user_nick_name }}出售<span
+ class="moneyText"
+ >{{ roleList.coin_amount + roleList.symbol }}</span
+ >
+ </div>
+ <div class="miniMiddle">
+ <div class="chetBox">
+ <span class="cicle"></span>
+ <div class="title">订单信息</div>
+ <div class="miniTitle">
+ <span class="titLeft">订单号</span>
+ <span class="titRight">订单状态</span>
+ </div>
+ <div class="textTitle">
+ <span class="textBush">{{ roleList.order_no }}</span>
+ <span class="textFig yellow" v-if="roleList.state == '0'"
+ >待付款</span
+ >
+ <span class="textFig yellow" v-if="roleList.state == '1'"
+ >已付款</span
+ >
+ <span class="textFig red" v-if="roleList.state == '2'"
+ >申诉中</span
+ >
+ <span class="textFig green" v-if="roleList.state == '3'"
+ >已完成</span
+ >
+ <span class="textFig yellow" v-if="roleList.state == '4'"
+ >已取消</span
+ >
+ <span class="textFig red" v-if="roleList.state == '5'"
+ >已超时</span
+ >
+ </div>
+ </div>
+ <div class="chetBox">
+ <span class="cicle"></span>
+ <div class="title">价格</div>
+ <div class="miniTitle">
+ <span class="titLeft">单价</span>
+ <span class="titRight">总价</span>
+ </div>
+ <div class="textTitle">
+ <span class="textBush">{{
+ roleList.symbol_value +
+ roleList.currency +
+ "/" +
+ roleList.symbol
+ }}</span>
+ <span class="textFig green">{{
+ roleList.amount + roleList.currency
+ }}</span>
+ </div>
+ </div>
+ <div class="chetBox">
+ <span class="cicle"></span>
+ <div class="title">时间</div>
+ <div class="miniTitle">
+ <span class="titLeft">下单时间</span>
+ <span class="titRight" v-if="roleList.pay_time">付款时间</span>
+ </div>
+ <div class="textTitle">
+ <span class="textBush">{{ roleList.create_time }}</span>
+ <span class="textFigTwo">{{ roleList.pay_time }}</span>
+ </div>
+ </div>
+ <div class="chetBox">
+ <span class="cicle"></span>
+ <div class="title">收款信息</div>
+ <div class="miniTitle menuBox">
+ <span class="titLeft">支付方式类型</span>
+ <span class="textmela">{{ dataForm.method_type_name }}</span>
+ </div>
+ <div class="textTitle menuBox">
+ <span class="titLeft">支付方式名称</span>
+ <span class="textmela">{{ dataForm.method_name }}</span>
+ </div>
+ <div class="miniTitle menuBox">
+ <span class="titLeft">真实姓名</span>
+ <span class="textmela">{{ dataForm.real_name }}</span>
+ </div>
+ <div>
+ <div
+ class="miniTitle menuBox"
+ v-for="(item, index) in list"
+ :key="index"
+ >
+ <span class="titLeft">{{ item.param_name }}</span>
+ <span class="textmela">{{ item.param_value }}</span>
+ </div>
+ </div>
+ <!-- <div class="miniTitle" style="margin-top: 20px">
+ <span class="titLeft">真实姓名</span>
+ <span class="titRight" v-if="roleList.param_value1">{{
+ roleList.param_name1
+ }}</span>
+ <span class="titRight" v-if="roleList.param_value2">{{
+ roleList.param_name2
+ }}</span>
+ <span class="titRight" v-if="roleList.param_value3">{{
+ roleList.param_name3
+ }}</span>
+ <span class="titRight" v-if="roleList.param_value4">{{
+ roleList.param_name4
+ }}</span>
+ <span class="titRight" v-if="roleList.param_value5">{{
+ roleList.param_name5
+ }}</span>
+ <span class="titRight" v-if="roleList.param_value6">{{
+ roleList.param_name6
+ }}</span>
+ <span class="titRight" v-if="roleList.param_value7">{{
+ roleList.param_name7
+ }}</span>
+ <span class="titRight" v-if="roleList.param_value8">{{
+ roleList.param_name8
+ }}</span>
+ <span class="titRight" v-if="roleList.param_value9">{{
+ roleList.param_name9
+ }}</span>
+ <span class="titRight" v-if="roleList.param_value10">{{
+ roleList.param_name10
+ }}</span>
+ <span class="titRight" v-if="roleList.param_value11">{{
+ roleList.param_name11
+ }}</span>
+ <span class="titRight" v-if="roleList.param_value12">{{
+ roleList.param_name12
+ }}</span>
+ <span class="titRight" v-if="roleList.param_value13">{{
+ roleList.param_name13
+ }}</span>
+ <span class="titRight" v-if="roleList.param_value14">{{
+ roleList.param_name14
+ }}</span>
+ <span class="titRight" v-if="roleList.param_value15">{{
+ roleList.param_name15
+ }}</span>
+ </div>
+ <div class="textTitle">
+ <span class="textBush">{{ roleList.real_name }}</span>
+ <span class="textFigTwo" v-if="roleList.param_value1">{{
+ roleList.param_value1
+ }}</span>
+ <span class="textFigTwo" v-if="roleList.param_value2">{{
+ roleList.param_value2
+ }}</span>
+ <span class="textFigTwo" v-if="roleList.param_value3">{{
+ roleList.param_value3
+ }}</span>
+ <span class="textFigTwo" v-if="roleList.param_value4">{{
+ roleList.param_value4
+ }}</span>
+ <span class="textFigTwo" v-if="roleList.param_value5">{{
+ roleList.param_value5
+ }}</span>
+ <span class="textFigTwo" v-if="roleList.param_value6">{{
+ roleList.param_value6
+ }}</span>
+ <span class="textFigTwo" v-if="roleList.param_value7">{{
+ roleList.param_value7
+ }}</span>
+ <span class="textFigTwo" v-if="roleList.param_value8">{{
+ roleList.param_value8
+ }}</span>
+ <span class="textFigTwo" v-if="roleList.param_value9">{{
+ roleList.param_value9
+ }}</span>
+ <span class="textFigTwo" v-if="roleList.param_value10">{{
+ roleList.param_value10
+ }}</span>
+ <span class="textFigTwo" v-if="roleList.param_value11">{{
+ roleList.param_value11
+ }}</span>
+ <span class="textFigTwo" v-if="roleList.param_value12">{{
+ roleList.param_value12
+ }}</span>
+ <span class="textFigTwo" v-if="roleList.param_value13">{{
+ roleList.param_value13
+ }}</span>
+ <span class="textFigTwo" v-if="roleList.param_value14">{{
+ roleList.param_value14
+ }}</span>
+ <span class="textFigTwo" v-if="roleList.param_value15">{{
+ roleList.param_value15
+ }}</span>
+ </div> -->
+ <div v-if="roleList.qrcode" class="miniTitle" style="margin-top: 20px">
+ <span class="titLeft">支付二维码</span>
+ </div>
+ <div v-if="roleList.qrcode">
+ <img :src="roleList.qrcode" alt="" width="150" height="150" />
+ </div>
+ </div>
+ <div class="chetBox">
+ <span class="cicle"></span>
+ <div class="title">操作</div>
+ <div>
+ <el-button
+ type="primary"
+ size="medium"
+ v-if="
+ roleList.direction == 'buy' &&
+ (roleList.state == '1' ||
+ roleList.state == '2' ||
+ roleList.state == '5')
+ "
+ @click.stop="passtHandle(row, 'n')"
+ >手动放行</el-button
+ >
+ <el-button
+ type="primary"
+ icon="el-icon-edit"
+ size="medium"
+ v-if="
+ roleList.direction == 'sell' &&
+ (roleList.state == '1' ||
+ roleList.state == '2' ||
+ roleList.state == '5')
+ "
+ @click.stop="passtHandle(row, 'n')"
+ >已付款管理员手动放行</el-button
+ >
+ <el-button
+ type="primary"
+ size="medium "
+ v-if="roleList.state == '0' && roleList.direction == 'buy'"
+ @click.stop="passtHandle(row)"
+ >一键通过</el-button
+ >
+ <el-button
+ type="primary"
+ icon="el-icon-edit"
+ size="medium"
+ v-if="
+ roleList.direction == 'sell' &&
+ (roleList.state == '0' || roleList.state == '2')
+ "
+ @click.stop="passtSellHandle(row)"
+ >手动转账</el-button
+ >
+ <el-button
+ type="text"
+ size="medium"
+ v-if="
+ roleList.state == '0' ||
+ roleList.state == '1' ||
+ roleList.state == '2' ||
+
+ roleList.state == '5'
+ "
+ @click.stop="deletOrdeHandle(row)"
+ style="margin-left: 70px"
+ >取消订单</el-button
+ >
+ </div>
+ </div>
+ </div>
+ </div>
+ <!-- 右侧聊天框 -->
+ <div class="rightBox">
+ <div class="kefu">
+ <div
+ :isActive="true"
+ :w="500"
+ :h="620"
+ v-on:resizing="resize"
+ class="kefu-tuozhuai"
+ @activated="activateEv"
+ :isResizable="false"
+ v-on:dragging="resize"
+ :isDrag="false"
+ >
+ <div class="kefu-title">
+ <div id="panel-header" class="header">
+ <div class="module1 left-module left-1">
+ <div
+ style="
+ width: 100%;
+ height: 100%;
+ display: flex;
+ justify-content: space-between;
+ "
+ >
+ <div class="module" style="">
+ <div>
+ <span class="nickname">{{ dataForm.username }}</span>
+ </div>
+
+ <!-- <div>
+ <span class="nickname">{{ params.remarks ? '(' + params.remarks + ')' : '' }}</span>
+ </div> -->
+
+ <!-- <div class="pointer" style="height: auto;padding-left: 10px;" @click="editFriendRemarks(params)">
+ <img src="~@/assets/img/ri_delete-bin-3-line.png" width="24px" height="25px"/>
+ </div>
+
+ <div>
+ <span class="nickname">设置备注</span>
+ </div> -->
+ </div>
+
+ <!-- <div class="module" style="height: auto;display: flex;justify-content: flex-end;">
+ <div class="pointer" style="height: auto;margin-right: 40px;" @click="deleteChat(params)">
+ <i class="el-icon-delete"></i>
+ </div>
+ <div class="pointer" style="height: auto;margin-right: 20px;" @click="close()">
+ <img src="~@/assets/img/clear.png" width="28px" height="28px"/>
+ </div>
+ </div> -->
+ </div>
+ </div>
+ <div class="module left-module left-2">
+ <span class="text1">UID:{{ dataForm.usercode }}</span>
+ <span class="text1"
+ >账户类型:<span style="color: #38e1a5">{{
+ dataForm.roleNameDesc
+ }}</span></span
+ >
+ <!-- <span class="text1">推荐人:{{ params.recom_parent_name }}</span> -->
+ <!-- <span class="text1">登录IP:{{ params.loginIp }}</span> -->
+ <span class="text1">订单时间:{{ dataForm.create_time }}</span>
+ <!-- <span class="text1">最后登录时间:{{ params.last_login_time }}</span> -->
+ </div>
+ </div>
+ <!-- <span>在线客服</span> -->
+ <!-- <img src="@/assets/img/Group609.png" @click="show_kefu=false" /> -->
+ </div>
+ <div class="kegu-nrkegu-nr">
+ <chat ref="chat" />
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <span slot="footer" class="dialog-footer">
+ <el-button @click="closeDiog()">取消</el-button>
+ <el-button type="primary" @click="closeDiog()">确定</el-button>
+ </span>
+ <!-- 取消订单 -->
+ <passtpn
+ v-if="passtpnVisible"
+ @refreshDataList="getC2cManagerInfo"
+ :append-to-body="true"
+ ref="passtpnUpdate"
+ >
+ </passtpn>
+ <!-- 取消订单 -->
+ <deletMsg
+ v-if="deletVisible"
+ @refreshDataList="getC2cManagerInfo"
+ :append-to-body="true"
+ ref="deletUpdate"
+ >
+ </deletMsg>
+ <!-- 手动转账 -->
+ <passSelltpn
+ v-if="passSelltpnVisible"
+ @refreshDataList="getC2cManagerInfo"
+ ref="passSelltUpdate"
+ >
+ </passSelltpn>
+ </el-dialog>
+</template>
+
+<script>
+import { Debounce } from "@/utils/debounce";
+import passtpn from "./c2c-ord-passtpn";
+import { encrypt } from "@/utils/crypto";
+import VueDragResize from "vue-drag-resize";
+import Chat from "@/components/chat2";
+import deletMsg from "./c2c-ord-delet";
+import passSelltpn from "./c2c-ord-passtSellpn";
+export default {
+ data() {
+ return {
+ hasFreeCondition: 0,
+ visible: false,
+ row:'',
+ list:[],
+ addOrUpdateVisible: false,
+ passSelltpnVisible:false,
+ passtpnVisible: false,
+ deletVisible: false,
+ dataForm: {
+ id: "",
+ },
+ roleList: [],
+ page: {
+ total: 0, // 总页数
+ currentPage: 1, // 当前页数
+ pageSize: 10, // 每页显示多少条
+ },
+ dataRule: {
+ login_safeword: [
+ { required: true, message: "资金密码不能为空", trigger: "blur" },
+ ],
+ },
+ };
+ },
+ components: { VueDragResize, Chat, passtpn, deletMsg,passSelltpn },
+ methods: {
+ //拖拽事件
+ resize(newRect) {},
+ activateEv() {
+ // 结局文本框无法输入的问题
+ if (this.$refs["chat"] && this.$refs["chat"].$refs["input"]) {
+ this.$refs["chat"].$refs["input"].focus();
+ }
+ },
+ init(row) {
+ console.log(row);
+ this.row = row || ''
+ this.dataForm = { ...row };
+ this.getC2cManagerInfo();
+ this.visible = true;
+ this.$nextTick(() => {
+ this.$refs["chat"].init(this.dataForm);
+ });
+ },
+ handClose() {
+ this.$nextTick(() => {
+ this.$refs["chat"].close();
+ });
+ this.list = [],
+ this.roleList = []
+ this.$emit("refreshDataList", this.page);
+ this.$data.dataForm = JSON.parse(
+ JSON.stringify(this.$options.data().dataForm)
+ );
+ this.$nextTick(() => {
+ this.$refs["dataForm"].clearValidate(); // 清除表单验证
+ });
+ },
+ getC2cManagerInfo() {
+ //获取详情
+ this.$http({
+ url: this.$http.adornUrl("/c2cOrder/detail"),
+ method: "post",
+ data: this.$http.adornData(
+ Object.assign({
+ order_no: this.dataForm.order_no,
+ })
+ ),
+ }).then(({ data }) => {
+ if (data.code == 0) {
+ this.roleList = data.data;
+ this.formatData()
+ }
+ });
+ },
+ formatData() {
+ let index = 1;
+ console.log(this.roleList)
+ Object.keys(this.roleList).forEach((key) => {
+ if (key.indexOf("param_name") !== -1) {
+ if (this.roleList[key] && this.roleList[key].length > 0) {
+ this.list.push({
+ ["param_name"]: this.roleList["param_name" + index],
+ ["param_value"]: this.roleList["param_value" + index],
+ });
+ index++;
+ }
+ }
+ });
+ console.log(this.list)
+ },
+ passtHandle(row, n) {
+ this.passtpnVisible = true;
+ this.$nextTick(() => {
+ this.$refs.passtpnUpdate.init(row, n);
+ });
+ },
+ passtSellHandle(row) {
+ this.passSelltpnVisible = true;
+ this.$nextTick(() => {
+ this.$refs.passSelltUpdate.init(row);
+ });
+ },
+ deletOrdeHandle(row) {
+ this.deletVisible = true;
+ this.$nextTick(() => {
+ this.$refs.deletUpdate.init(row);
+ });
+ },
+ // 表单提交
+ closeDiog() {
+ this.visible = false;
+ this.$emit("refreshDataList", this.page);
+ },
+ },
+};
+</script>
+
+<style lang="scss" scoped>
+.transport-dialog .table-con .el-form-item {
+ margin-top: 16px;
+ margin-bottom: 16px !important;
+}
+.allBox {
+ width: 100%;
+ overflow: hidden;
+}
+.leftBox {
+ width: 550px;
+ float: left;
+}
+.rightBox {
+ width: 500px;
+ float: right;
+ padding: 30px;
+ height: 600px;
+ // background: yellow;
+}
+.moneyText {
+ font-size: 20px;
+}
+.minibox {
+ height: 50px;
+ line-height: 50px;
+ letter-spacing: 1px;
+ border-bottom: 1px solid #eaecef;
+}
+.miniMiddle {
+ margin-top: 20px;
+ overflow: hidden;
+ min-height: 800px;
+ border-left: 1px solid #eaecef;
+}
+.cicle {
+ display: block;
+ width: 10px;
+ height: 10px;
+ border: 2px solid #1d91ff;
+ border-radius: 50%;
+ position: absolute;
+ left: 13px;
+ margin-top: 3px;
+}
+.chetBox {
+ padding-left: 10px;
+ margin-bottom: 40px;
+}
+.title {
+ font-size: 17px;
+ color: black;
+ margin-bottom: 10px;
+ font-weight: 540;
+}
+.titLeft {
+ float: left;
+ color: #727a89;
+ font-size: 14px;
+}
+.titRight {
+ float: right;
+ color: #727a89;
+}
+.textBush {
+ float: left;
+ font-size: 16px;
+ color: black;
+}
+.textFig {
+ float: right;
+ font-size: 19px;
+}
+.textFigTwo {
+ float: right;
+ font-size: 16px;
+ color: black;
+}
+.textTitle {
+ overflow: hidden;
+ width: 400px;
+}
+.miniTitle {
+ overflow: hidden;
+ margin-bottom: 10px;
+ width: 400px;
+}
+</style>
+
+<style>
+#app {
+ min-height: 100vh;
+ overflow-x: hidden;
+}
+body {
+ margin: 0;
+}
+/* 客服 */
+.service-box {
+ bottom: 1px;
+ cursor: pointer;
+}
+.vdr.active:before {
+ display: none;
+}
+
+/* .item-dropdown-wrapper.el-dropdown-menu,.quotes-dropdown.el-dropdown-menu {
+ background: #24282D !important;
+ border: 1px solid #24282D !important;
+}
+
+.popper__arrow {
+ border-bottom-color: #24282D !important;
+}
+
+.el-popper[x-placement^=bottom] .popper__arrow::after {
+ border-bottom-color: #24282D !important;
+} */
+
+.item-dropdown-wrapper .el-dropdown-menu__item:focus,
+.item-dropdown-wrapper .el-dropdown-menu__item:not(.is-disabled):hover {
+ background-color: transparent !important;
+ color: #1d91ff !important;
+}
+
+.quotes-dropdown.el-dropdown-menu {
+ padding: 0 !important;
+}
+
+.quotes-dropdown .el-dropdown-menu__item {
+ min-width: 60px !important;
+ padding: 6px 13px !important;
+}
+
+.quotes-dropdown .el-dropdown-menu__item:hover {
+ background: #2c3138 !important;
+}
+</style>
+<style scoped>
+.kefu {
+ cursor: pointer;
+}
+.embed-responsive-item {
+ width: 100%;
+ height: 100%;
+ border: none;
+}
+.kefu-title {
+ width: 100%;
+ height: 87px;
+ position: relative;
+ text-align: center;
+ background: linear-gradient(
+ 90.3deg,
+ rgba(45, 45, 53, 0.71) 0.21%,
+ #23232e 99.83%
+ );
+ border-radius: 10px 10px 0px 0px;
+}
+.kegu-nrkegu-nr {
+ width: 100%;
+ height: 559px;
+}
+.kefu-title span {
+ text-align: center;
+ font-style: normal;
+ font-weight: 400;
+ font-size: 20px;
+ line-height: 61px;
+ color: #ffffff;
+}
+.kefu-title img {
+ position: absolute;
+ width: 30px;
+ height: 30px;
+ right: 21px;
+ top: 16px;
+}
+
+::v-deep .kefu-title .date {
+ color: #fff !important;
+}
+.kefu-tuozhuai {
+ box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.5);
+ outline: none;
+ background: #ffffff;
+ border-radius: 10px;
+}
+
+.kefu-tuozhuai:before {
+ position: absolute;
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box;
+}
+</style>
+
+<style lang="less" scoped>
+.pointer {
+ cursor: pointer;
+}
+
+.header {
+ // max-width: 1450px;
+ // max-width: 1290px;
+ width: auto;
+ height: 87px;
+ background-color: #2e2f33;
+ // display: flex;
+}
+
+#panel-header {
+ align-items: center;
+ justify-content: space-between;
+ box-sizing: border-box;
+ border-bottom: 1px solid #f5eeee;
+ color: #ffffff;
+
+ .module1 {
+ width: 100%;
+ height: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ flex-shrink: 0;
+ }
+
+ .module {
+ width: 100%;
+ height: 100%;
+ display: flex;
+ align-items: center;
+ }
+
+ .left-1 {
+ background: linear-gradient(90deg, #121212 0%, #2f3032 51.04%, #6e6f75 100%),
+ linear-gradient(0deg, #393939, #393939);
+ // width: 1171px;
+ height: 55px;
+ // top: 204px;
+ // left: 720px;
+ border-radius: 0px 10px 0px 0px;
+ }
+
+ .left-2 {
+ background-color: #2e2f33;
+ // width: 1171px
+ height: 32px;
+ // top: 259px
+ // left: 720px
+ }
+
+ .left-module {
+ padding-right: 0px;
+
+ .nickname {
+ // overflow: hidden;
+ // white-space: nowrap;
+ // text-overflow: ellipsis;
+ font-family: PingFang SC;
+ font-size: 18px;
+ font-weight: 500;
+ line-height: 25px;
+ letter-spacing: 0em;
+ text-align: center;
+
+ padding-left: 10px;
+ }
+
+ .text1 {
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ font-family: PingFang SC;
+ font-size: 12px;
+ font-weight: 400;
+ line-height: 17px;
+ letter-spacing: 0em;
+ text-align: center;
+
+ font-family: PingFang SC;
+ font-size: 12px;
+ font-weight: 500;
+ line-height: 17px;
+ letter-spacing: 0em;
+ text-align: center;
+
+ padding-left: 10px;
+ }
+ }
+
+ .center-module {
+ flex-direction: column;
+ justify-content: center;
+
+ .online {
+ color: #cccccc;
+ font-weight: 300;
+ font-size: 15px;
+
+ &.color {
+ color: #1890ff;
+ }
+
+ .online-status {
+ position: relative;
+ top: -1px;
+ display: inline-block;
+ width: 6px;
+ height: 6px;
+ vertical-align: middle;
+ border-radius: 50%;
+ position: relative;
+ background-color: #1890ff;
+ margin-right: 5px;
+
+ &:after {
+ position: absolute;
+ top: -1px;
+ left: -1px;
+ width: 100%;
+ height: 100%;
+ border: 1px solid #1890ff;
+ border-radius: 50%;
+ -webkit-animation: antStatusProcessing 1.2s ease-in-out infinite;
+ animation: antStatusProcessing 1.2s ease-in-out infinite;
+ content: "";
+ }
+ }
+ }
+
+ .keyboard-status {
+ height: 20px;
+ line-height: 18px;
+ font-size: 10px;
+ animation: inputfade 600ms infinite;
+ -webkit-animation: inputfade 600ms infinite;
+ }
+ }
+
+ .right-module {
+ display: flex;
+ justify-content: flex-end;
+ align-items: center;
+
+ p {
+ cursor: pointer;
+ margin: 0 8px;
+ font-size: 20px;
+ color: #828f95;
+ &:active i {
+ font-size: 26px;
+ transform: scale(1.3);
+ transition: ease 0.5s;
+ color: red;
+ }
+ }
+ }
+}
+
+/* css 动画 */
+@keyframes inputfade {
+ from {
+ opacity: 1;
+ }
+
+ 50% {
+ opacity: 0.4;
+ }
+
+ to {
+ opacity: 1;
+ }
+}
+
+@-webkit-keyframes inputfade {
+ from {
+ opacity: 1;
+ }
+
+ 50% {
+ opacity: 0.4;
+ }
+
+ to {
+ opacity: 1;
+ }
+}
+
+@-webkit-keyframes antStatusProcessing {
+ 0% {
+ -webkit-transform: scale(0.8);
+ transform: scale(0.8);
+ opacity: 0.5;
+ }
+
+ to {
+ -webkit-transform: scale(2.4);
+ transform: scale(2.4);
+ opacity: 0;
+ }
+}
+
+@keyframes antStatusProcessing {
+ 0% {
+ -webkit-transform: scale(0.8);
+ transform: scale(0.8);
+ opacity: 0.5;
+ }
+
+ to {
+ -webkit-transform: scale(2.4);
+ transform: scale(2.4);
+ opacity: 0;
+ }
+}
+.textmela {
+ float: right;
+ font-size: 16px;
+ color: black;
+}
+.menuBox {
+ border-bottom: 1px dashed #ece9e9;
+ margin-top: 25px;
+}
+</style>
--
Gitblit v1.9.3