123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250 |
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="utf-8">
- <title>layuiAdmin 网站用户</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">
- <style>
- .layui-form-radio > i {
- margin-right: 8px !important;
- }
- .layui-form-radio {
- margin-right: 20px !important;
- }
- .layui-form-radioed > .lay-skin-tag {
- color: #fff !important;
- background-color: #16b777 !important;
- border-radius: 100px;
- }
- </style>
- </head>
- <body>
- <div class="layui-fluid">
- <div class="layui-card">
- <div class="layui-card-body" style="margin-bottom: 30px;">
- <div class="layui-btn-container">
- <button class="layui-btn layui-btn-sm abbb" id="langButton">
- <span style="display: inline-block;width: 45px;">中文</span>
- <i class="layui-icon layui-icon-down layui-font-12"></i>
- </button>
- </div>
- <table id="table" lay-filter="table"></table>
- </div>
- </div>
- </div>
- <script type="text/html" id="toolbar">
- <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
- </script>
- <script src="/layuiadmin/layui/layui.js"></script>
- <script>
- layui.config({
- base: '/layuiadmin/'
- }).extend({
- index: 'lib/index'
- }).use(['index', 'table', 'dropdown'], function () {
- const $ = layui.$, table = layui.table, dropdown = layui.dropdown, layer = layui.layer;
- let lang = 'zh';
- table.on('edit(table)', function (obj) {
- let data = obj.data;
- let value = obj.value;
- if (value.replace(/\s/g, '') === '') {
- layer.tips('值不能为空', this, {tips: 1});
- return obj.reedit();
- }
- let lang = aTable.config.where.lang;
- $.ajax({
- url: "{{ route('user.setData') }}",
- method: "post",
- headers: {
- 'X-CSRF-TOKEN': "{{ csrf_token() }}",
- },
- data: {
- lang, data
- },
- success(res) {
- if (res.code !== 0) {
- layer.alert(res.msg);
- }
- }
- });
- });
- table.on('tool(table)', (obj) => {
- let event = obj.event, data = obj.data;
- switch (event) {
- case "edit":
- location.href = `/user/evaluation/edit?id=${data.id}&lang=${lang}`;
- break;
- case 'cover':
- layer.photos({
- toolbar: false,
- photos: {
- title: "封面",
- id: data.id,
- start: 0,
- data: [{
- "alt": `封面${data.id}`,
- "pid": data.id,
- "src": data.cover,
- "thumb": data.cover,
- }]
- }
- });
- break;
- case "show":
- case "skip":
- $.ajax({
- url: "{{ route('user.setData') }}",
- method: "post",
- headers: {
- 'X-CSRF-TOKEN': "{{ csrf_token() }}",
- },
- data: {
- id: data.id,
- [event]: data[event] ? 0 : 1,
- },
- success(res) {
- if (res.code === 0) {
- obj.update({
- [event]: data[event] ? 0 : 1,
- }, true);
- } else {
- layer.alert(res.msg);
- }
- }
- });
- break;
- }
- });
- table.on('toolbar(table)', (obj) => {
- var id = obj.config.id;
- var checkStatus = table.checkStatus(id);
- var data = checkStatus.data;
- layer.alert(layui.util.escape(JSON.stringify(data)));
- });
- let aTable = table.render({
- elem: '#table',
- url: "{{url('user/data')}}",
- defaultContextmenu: false,
- where: {lang: 'zh'},
- cols: [[
- {field: "name", title: '采集项', width: 100, templet: nameForZh,},
- {
- field: "cover", title: '封面', width: 100, templet(d) {
- if (d.cover === '') return '';
- return `<img lay-event="cover" lay-tips="查看大图" style="height: 30px;object-fit: contain;border: 1px solid rgba(0,0,0,.3);margin-right: 3px; width: 48px;object-fit: cover;" src="${d.cover}" />`;
- }
- },
- {field: "title", title: '标题', maxWidth: 250},
- {field: 'subTitle', title: '指引语',},
- // {title: "内容", templet: content, width: 200},
- {
- title: "是否必填", width: 100, templet: (d) => {
- return (!d.skip) ?
- `<i lay-event="skip" style="cursor: pointer;font-size: 20px;color:#16BAAA;" class="layui-icon layui-icon-ok"/>`
- :
- `<i lay-event="skip" style="cursor: pointer;font-size: 20px;color: #FF5722;" class="layui-icon layui-icon-close"/>`;
- }
- },
- // {
- // title: '是否开启', width: 100, templet: (d) => {
- // return (!d.show) ?
- // `<i lay-event="show" style="cursor: pointer;font-size: 20px;color: #FF5722;" class="layui-icon layui-icon-close"/>`
- // :
- // `<i lay-event="show" style="cursor: pointer;font-size: 20px;color:#16BAAA;" class="layui-icon layui-icon-ok"/>`;
- // }
- // },
- {title: '操作', width: 100, toolbar: '#toolbar'}
- ]],
- page: false,
- done: function (a) {
- dropdown.render({
- elem: '.abbb',
- data: [{id: 'zh', title: '中文'}, {id: 'en', title: 'English'}],
- click: function (obj) {
- this.elem.find('span').text(obj.title);
- lang = obj.id;
- if (lang !== aTable.config.where.lang) {
- aTable.config.where.lang = lang;
- aTable.reloadData({where: {lang: obj.id}});
- }
- }
- });
- },
- });
- function nameForZh(d) {
- let zh = {
- name: '姓名',
- sex: '性别',
- birthday: '生日',
- city: '家庭地址',
- occupation: '职业',
- income: '年收入',
- declaration: '恋爱宣言',
- phone: '手机号',
- tags: '标签',
- line: '社交账号',
- video: '视频'
- };
- return zh[d.name];
- }
- function content(d) {
- switch (d.type) {
- case "longText":
- case 'text':
- case "phone":
- case "date":
- return `<input class="layui-input" readonly>`;
- case 'radio':
- case "checkbox":
- return radio(d);
- case 'address':
- if (aTable.config.where.lang === 'zh') {
- return `<a href="javascript:;" class="layui-btn layui-btn-sm layui-btn-disabled">选择</a>`;
- } else {
- return `<a href="javascript:;" class="layui-btn layui-btn-sm layui-btn-disabled">Choose</a>`;
- }
- case 'image':
- if (aTable.config.where.lang === 'zh') {
- return `<a href="javascript:;" class="layui-btn layui-btn-sm layui-btn-disabled">上传</a>`;
- } else {
- return `<a href="javascript:;" class="layui-btn layui-btn-sm layui-btn-disabled">Upload</a>`;
- }
- default:
- return "";
- }
- }
- function radio(data) {
- let title = data.title;
- data = data.data;
- let msg = '';
- for (let i = 0; i < data.length; i++) {
- msg += `<input disabled `;
- if (i === 0) msg += 'checked';
- msg += ` type="radio" name="${title}" value="${data[i]}" title="${data[i]}">`;
- }
- return msg;
- }
- });
- </script>
- </body>
- </html>
|