123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239 |
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="utf-8">
- <title></title>
- <meta name="renderer" content="webkit">
- <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
- <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
- <link rel="stylesheet" href="/layuiadmin/layui/css/layui.css" media="all">
- <link rel="stylesheet" href="/layuiadmin/style/admin.css" media="all">
- </head>
- <body>
- <div class="layui-fluid">
- <div class="layui-card">
- <div class="layui-form layui-card-header layuiadmin-card-header-auto">
- <div class="layui-form-item">
- <div class="layui-inline">
- <label class="layui-form-label">姓名</label>
- <div class="layui-input-block">
- <input type="text" name="name" placeholder="请输入" autocomplete="off" class="layui-input">
- </div>
- </div>
- <div class="layui-inline">
- <label class="layui-form-label">邮箱</label>
- <div class="layui-input-block">
- <input type="text" name="email" placeholder="请输入" autocomplete="off" class="layui-input">
- </div>
- </div>
- <div class="layui-inline">
- <button class="layui-btn layuiadmin-btn-useradmin" lay-submit lay-filter="LAY-user-front-search">
- <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
- </button>
- </div>
- </div>
- </div>
- <div class="layui-card-body">
- <div style="padding-bottom: 10px;">
- <table id="LAY-user-manage" lay-filter="LAY-user-manage"></table>
- </div>
- </div>
- </div>
- </div>
- @verbatim
- <script type="text/html" id="user">
- <div style="height: 100%;display: flex;">
- <div style="height: 100%;">
- <img style="max-width: 100%;max-height: 100%;" src="{{d.user.avatar_url}}"/>
- </div>
- <div style="padding-left: 8px;">
- <span>{{d.user.username}}</span>
- </div>
- </div>
- </script>
- <script type="text/html" id="status">
- {{# if(d.status == 0 ){ }}
- <span>未支付</span>
- {{# } else { }}
- <span>已支付</span>
- {{# } }}
- </script>
- @endverbatim
- <script src="/layuiadmin/layui/layui.js"></script>
- <script src="/static/js/alpha_2.js"></script>
- <script>
- layui.config({
- base: '/layuiadmin/'
- }).extend({
- index: 'lib/index'
- }).use(['index', 'form', 'table', 'layer'], function () {
- const $ = layui.$, form = layui.form, table = layui.table, layer = layui.layer;
- let tableList = table.render({
- elem: '#LAY-user-manage',
- url: "{{url('wallet/getOrders')}}",
- // toolbar: true,
- // defaultToolbar: ['filter'],
- cols: [[
- {field: 'user', title: '用户', templet: "#user"},
- {field: 'order_no', title: '订单号'},
- {field: 'product_id', title: '产品ID'},
- {field: 'price', title: '价格'},
- {field: "wallet", title: "充值金额"},
- {field: "updated_at", title: '更新时间'},
- {field: "status", title: "状态", templet: "#status"},
- ]],
- page: true,
- limit: 50,
- limits: [50, 100, 200, 300],
- where: {lang: 'zh-CN'},
- height: 'full-137',
- text: {none: '无数据'},
- parseData(res) {
- return {
- code: res.data.code,
- msg: res.data.msg,
- count: res.data.count,
- data: res.data.data
- };
- }
- });
- table.on('tool(LAY-user-manage)', function (obj) {
- switch (obj.event) {
- case "buy":
- layer.prompt({
- title: "钱包余额充值",
- formType: 0,
- placeholder: '请输入要充值的金额'
- }, (value, index, elem) => {
- const priceRegex = /^\d+(\.\d{1,2})?$/;
- if (!priceRegex.test(value)) return false;
- if (parseInt(value) === 0) return false;
- $.ajax({
- url: "{{ route('user.buyWallet') }}",
- method: 'post',
- headers: {'X-CSRF-TOKEN': "{{ csrf_token() }}"},
- data: {userId: obj.data.id, wallet: value},
- success(res) {
- if (res.code === 0) {
- tableList.reloadData();
- layer.close(index);
- } else {
- layer.msg(res.msg);
- }
- }
- });
- });
- break;
- case "video":
- let src = obj.data.video;
- let deo = document.createElement('video');
- deo.src = src;
- deo.onloadedmetadata = function () {
- let videoWidth = deo.videoWidth;
- let videoHeight = deo.videoHeight;
- let maxWidth = 800;
- let maxHeight = 600;
- if (videoWidth > maxWidth) {
- let scale = maxWidth / videoWidth;
- videoWidth = maxWidth;
- videoHeight = videoHeight * scale;
- }
- if (videoHeight > maxHeight) {
- let scale = maxHeight / videoHeight;
- videoHeight = maxHeight;
- videoWidth = videoWidth * scale;
- }
- layer.open({
- type: 2,
- title: false,
- area: [`${videoWidth}px`, `${videoHeight}px`],
- shade: 0.8,
- closeBtn: 0,
- shadeClose: true,
- content: src, // video 地址
- });
- };
- break;
- case "mp4":
- let url = obj.data.photo[0];
- let video = document.createElement('video');
- video.src = url;
- video.onloadedmetadata = function () {
- let videoWidth = video.videoWidth;
- let videoHeight = video.videoHeight;
- let maxWidth = 800;
- let maxHeight = 600;
- if (videoWidth > maxWidth) {
- let scale = maxWidth / videoWidth;
- videoWidth = maxWidth;
- videoHeight = videoHeight * scale;
- }
- if (videoHeight > maxHeight) {
- let scale = maxHeight / videoHeight;
- videoHeight = maxHeight;
- videoWidth = videoWidth * scale;
- }
- layer.open({
- type: 2,
- title: false,
- area: [`${videoWidth}px`, `${videoHeight}px`],
- shade: 0.8,
- closeBtn: 0,
- shadeClose: true,
- content: url, // video 地址
- });
- };
- layer.msg('点击遮罩区域可关闭');
- break;
- case "img":
- let start = this.dataset.index - 1;
- let data = [];
- for (let i = 1; i < obj.data.photo.length; i++) {
- if (obj.data.photo[i]) {
- data.push({
- "alt": `个人自拍_${i}`,
- "pid": (i - 1),
- "src": obj.data.photo[i],
- "thumb": obj.data.photo[i],
- });
- }
- }
- layer.photos({
- toolbar: false,
- photos: {
- title: "个人自拍",
- id: obj.data.id,
- start: start,
- data: data
- }
- });
- break;
- }
- console.log(this.src);
- // console.log(obj)
- });
- form.on('submit(LAY-user-front-search)', function (data) {
- let field = data.field;
- table.reload('LAY-user-manage', {
- where: field
- });
- });
- });
- </script>
- </body>
- </html>
|