|
|
@@ -0,0 +1,799 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <ag-grid-layout
|
|
|
+ toolbar
|
|
|
+ :table-height="tableHeight"
|
|
|
+ theme="ag-theme-alpine"
|
|
|
+ :column-defs="columnDefs"
|
|
|
+ :row-data="rowData"
|
|
|
+ :locale-text="localeText"
|
|
|
+ :grid-options="gridOptions"
|
|
|
+ :default-col-def="defaultColDef"
|
|
|
+ :animate-rows="true"
|
|
|
+ :row-selection="rowSelection"
|
|
|
+ :enable-cell-change-flash="true"
|
|
|
+ @filterChanged="filterModifed"
|
|
|
+ @sortChanged="gridSortChange"
|
|
|
+ >
|
|
|
+ <!-- @rowDoubleClicked="getList"-->
|
|
|
+ <div slot="toolbar" class="inner-toolbar">
|
|
|
+ <div class="toolbar-search">
|
|
|
+ <en-table-search :placeholder="this.$t('action.keywords')" @search="handlerSearch" />
|
|
|
+ </div>
|
|
|
+ <div class="toolbar-btns">
|
|
|
+ <el-button type="primary" size="mini" @click="createScreenTip">{{ this.$t('screenTip.tipAdd') }}</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <el-pagination
|
|
|
+ v-if="pageData"
|
|
|
+ slot="pagination"
|
|
|
+ :current-page="pageData.page_no"
|
|
|
+ :page-sizes="[10, 20, 50, 100]"
|
|
|
+ :page-size="pageData.page_size"
|
|
|
+ layout="total, sizes, prev, pager, next, jumper"
|
|
|
+ :total="pageData.data_total"
|
|
|
+ @size-change="handlePageSizeChange"
|
|
|
+ @current-change="handlePageCurrentChange"
|
|
|
+ />
|
|
|
+ </ag-grid-layout>
|
|
|
+ <el-dialog :title.sync="formtitle" :visible.sync="formshow" width="35%">
|
|
|
+ <div>
|
|
|
+ <el-form ref="editform" :rules="rules" label-width="120px" :model="formmodel">
|
|
|
+
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form-item :label="this.$t('screenTip.showText')" prop="show_text">
|
|
|
+ <el-input
|
|
|
+ v-model="formmodel.show_text"
|
|
|
+ clearable
|
|
|
+ :maxlength="100"
|
|
|
+ :placeholder="this.$t('screenTip.showText')"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="this.$t('screenTip.textColor')">
|
|
|
+ <el-input :placeholder="this.$t('screenTip.textColor')" v-model="formmodel.text_color">
|
|
|
+ <el-color-picker slot="append" color-format="hex" v-model="formmodel.text_color" size="mini"></el-color-picker>
|
|
|
+ </el-input>
|
|
|
+
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item prop="text_size" :label="this.$t('screenTip.textSize')">
|
|
|
+ <el-input v-model.number="formmodel.text_size" :placeholder="this.$t('screenTip.textSize')"><span slot="append">dp</span></el-input>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <el-form-item :label="this.$t('screenTip.screenBgColor')">
|
|
|
+ <el-input :placeholder="this.$t('screenTip.screenBgColor')" v-model="formmodel.screen_bg_color">
|
|
|
+ <el-color-picker slot="append" color-format="hex" v-model="formmodel.screen_bg_color" size="mini"></el-color-picker>
|
|
|
+ </el-input>
|
|
|
+
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item prop="display_minutes" :label="this.$t('screenTip.displayLongest')">
|
|
|
+ <el-input v-model.number="formmodel.display_minutes" :placeholder="this.$t('screenTip.displayLongest')"><span slot="append">{{this.$t('action.minute2')}}</span></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item prop="bool_scroll" >
|
|
|
+ <el-checkbox v-model="formmodel.bool_scroll" @change="scrollChange">{{this.$t('screenTip.boolScroll')}}</el-checkbox>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="this.$t('screenTip.scrollDirect')" prop="scroll_direct">
|
|
|
+ <el-select v-model="formmodel.scroll_direct"
|
|
|
+ :placeholder="this.$t('screenTip.scrollDirect')"
|
|
|
+ filterable clearable >
|
|
|
+ <el-option v-for="(item,index) in animateRender" :key="index" :label="item.key" :value="item.value" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ <div slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="formshow = false">{{ this.$t('action.cancel') }}</el-button>
|
|
|
+ <el-button type="primary" @click="handlerFormSubmit('editform')">{{ this.$t('action.yes') }}</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+<!-- <el-dialog :title.sync="subscribeTitle" :visible.sync="formSubscribe" width="50%">-->
|
|
|
+
|
|
|
+<!-- <div>-->
|
|
|
+<!-- <fieldset v-for="(item,index) in channelSubscribers" v-if="item.roleName!=='管理员'" :key="index" style="margin-top: 10px">-->
|
|
|
+<!-- <legend><span style="margin-right: 10px">{{ item.roleName }} </span><el-checkbox v-model="item.allCkeck" style="float: right;" :indeterminate="item.indeterminate" @change="(checked)=>{handleCheckAll(checked,item)}">{{ choiceAll }}</el-checkbox></legend>-->
|
|
|
+<!-- <el-row :gutter="20" type="flex" style="padding: 10px">-->
|
|
|
+<!-- <el-col :span="24">-->
|
|
|
+<!-- <el-checkbox v-for="(clerk,_index) in item.clerks" :key="_index" v-model="clerk.checked" @change="handleCheckboxChanged(item)">{{ clerk.clerk_name }}</el-checkbox>-->
|
|
|
+<!-- </el-col>-->
|
|
|
+<!-- </el-row>-->
|
|
|
+<!-- </fieldset>-->
|
|
|
+<!-- </div>-->
|
|
|
+<!-- <div slot="footer" class="dialog-footer">-->
|
|
|
+<!-- <el-button @click="formSubscribe = false">{{ this.$t('action.cancel') }}</el-button>-->
|
|
|
+<!-- <el-button type="primary" @click="handlerSubscribeSubmit">{{ this.$t('action.yes') }}</el-button>-->
|
|
|
+<!-- </div>-->
|
|
|
+<!-- </el-dialog>-->
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import { AG_GRID_LOCALE_CN } from '@/utils/AgGridVueLocaleCn'
|
|
|
+ import ButtonCellRender from '../../components/AgGridCellRender/ButtonCellRender'
|
|
|
+ import * as API_ScreenTip from '@/api/ncs_screentip'
|
|
|
+ import { unix2Date } from '@/utils/Foundation'
|
|
|
+ import * as API_Clerk from '@/api/ncs_clerk'
|
|
|
+ import ListFilter from '@/components/AgGridCustomFilter/ListFilter'
|
|
|
+ import RadioFilter from '@/components/AgGridCustomFilter/RadioFilter'
|
|
|
+ import ButtonCellRenderList from "@/components/AgGridCellRender/ButtonCellRenderList";
|
|
|
+ export default {
|
|
|
+ name: "index",
|
|
|
+ components: { ButtonCellRenderList, ButtonCellRender, ListFilter, RadioFilter },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ tableData: [],
|
|
|
+ /** 列表参数 */
|
|
|
+ params: {
|
|
|
+ page_size: 20,
|
|
|
+ page_no: 1,
|
|
|
+ fixedCondition: ' part_id = ' + this.$store.getters.partId
|
|
|
+ },
|
|
|
+ /** 新建组织弹出参数 **/
|
|
|
+ formtitle: this.$t('screenTip.tipAdd'),
|
|
|
+ formshow: false,
|
|
|
+ /** 频道订阅设置 */
|
|
|
+ // formSubscribe: false,
|
|
|
+ formmodel: {},
|
|
|
+ // frameGroups: [],
|
|
|
+ rules: {
|
|
|
+ show_text: [
|
|
|
+ { required: true, message: this.$t('screenTip.showTextRequired'), trigger: 'blur' }
|
|
|
+ ],
|
|
|
+ scroll_direct:[{ required: false, message: this.$t('screenTip.scrollDirectRequired'), trigger: 'blur' }],
|
|
|
+ display_minutes:[{ required: true, message: this.$t('screenTip.displayMinutesRequired'), trigger: 'blur' },{ type: 'number', message: this.$t('screenTip.numberRequired')}],
|
|
|
+ text_size:[{ required: true, message: this.$t('screenTip.textSizeRequired'), trigger: 'blur' },{ type: 'number', message: this.$t('screenTip.numberRequired')}]
|
|
|
+ },
|
|
|
+ // timeRange: [new Date(2020, 11, 11, 7, 0), new Date(2020, 11, 11, 8, 0)],
|
|
|
+ // checkWeek: [],
|
|
|
+ /** ag-grid参数 **/
|
|
|
+ pageData: [],
|
|
|
+ loading: false,
|
|
|
+ errorId: null,
|
|
|
+ shopVisible: false,
|
|
|
+ columnDefs: null,
|
|
|
+ rowData: null,
|
|
|
+ defaultColDef: null,
|
|
|
+ gridOptions: null,
|
|
|
+ gridApi: null,
|
|
|
+ columnApi: null,
|
|
|
+ localeText: AG_GRID_LOCALE_CN,
|
|
|
+ filterState: null,
|
|
|
+ rowSelection: null,
|
|
|
+ frameworkComponents: null,
|
|
|
+ /** 频道订阅者情况数组 */
|
|
|
+ // channelSubscribers: [],
|
|
|
+ // subscribeTitle: '',
|
|
|
+ choiceAll: this.$t('action.choiceAll'),
|
|
|
+ booleanRender: [
|
|
|
+ { key: this.$t('entraceguardUser.yes'), value: true, color: 'green' },
|
|
|
+ { key: this.$t('entraceguardUser.nop'), value: false, color: 'red' }
|
|
|
+ ],
|
|
|
+ animateRender:[
|
|
|
+ {key:this.$t('screenTip.leftToRight'),value:1},
|
|
|
+ {key:this.$t('screenTip.rightToLeft'),value:2},
|
|
|
+ {key:this.$t('screenTip.upToDown'),value:3},
|
|
|
+ {key:this.$t('screenTip.downToUp'),value:4}
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ tableHeight() {
|
|
|
+ return this.mainAreaHeight - 130
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+ beforeMount() {
|
|
|
+ this.gridOptions = {}
|
|
|
+ this.columnDefs = [
|
|
|
+ {
|
|
|
+ headerName: '#',
|
|
|
+ headerCheckboxSelection: true,
|
|
|
+ headerCheckboxSelectionFilteredOnly: true,
|
|
|
+ checkboxSelection: true,
|
|
|
+ sortable: false, filter: false,
|
|
|
+ width: 100,
|
|
|
+ resizable: false,
|
|
|
+ valueGetter: this.hashValueGetter
|
|
|
+ },
|
|
|
+ { headerName: 'ID', field: 'id', sortable: true, filter: 'agNumberColumnFilter', width: 130 },
|
|
|
+ {
|
|
|
+ headerName: this.$t('screenTip.showText'), field: 'show_text', sortable: true, filter: 'agTextColumnFilter', flex: 1,
|
|
|
+ cellRenderer: (para) => {
|
|
|
+ return this.textShow(para)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ headerName: this.$t('screenTip.textColor'), field: 'text_color', sortable: true, filter: 'agTextColumnFilter', width: 130,
|
|
|
+ cellRenderer: (para) => {
|
|
|
+ return this.colorFormatter(para)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ headerName: this.$t('screenTip.textSize'), field: 'text_size', sortable: true, filter: 'agNumberColumnFilter', width: 130
|
|
|
+ },
|
|
|
+ {
|
|
|
+ headerName: this.$t('screenTip.screenBgColor'), field: 'screen_bg_color', sortable: true, filter: 'agTextColumnFilter', width: 130,
|
|
|
+ cellRenderer: (para) => {
|
|
|
+ return this.colorFormatter(para)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ headerName: this.$t('screenTip.displayMinutes'), field: 'display_minutes', sortable: true, filter: 'agNumberColumnFilter', width: 180
|
|
|
+ },
|
|
|
+ {
|
|
|
+ headerName: this.$t('screenTip.boolScroll'), field: 'bool_scroll', sortable: true, filterFramework: 'RadioFilter', filterParams: {
|
|
|
+ listData: this.booleanRender
|
|
|
+ }, width: 150,
|
|
|
+ cellRenderer: (para) => {
|
|
|
+ return this.radioFilterFormatter(para, this.booleanRender)
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ {
|
|
|
+ headerName: this.$t('screenTip.scrollDirect'), field: 'scroll_direct', sortable: true, filterFramework: 'ListFilter', filterParams: {
|
|
|
+ listData: this.animateRender
|
|
|
+ }, width: 150,
|
|
|
+ cellRenderer: (para) => {
|
|
|
+ return this.scrollDirectFormatter(para, this.animateRender)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // {
|
|
|
+ // headerName: this.$t('screenTip.boolScroll'), field: 'bool_scroll', sortable: true, filter: 'agTextColumnFilter', width: 130
|
|
|
+ // },
|
|
|
+
|
|
|
+ // lockPosition 锁定位置，会在第一列
|
|
|
+ // lockPinned = true 不能拖动然后固定
|
|
|
+ // resizeable 单元个大小是否可以调整
|
|
|
+
|
|
|
+ { headerName: this.$t('action.handle'), field: 'id',
|
|
|
+ cellRendererFramework: 'ButtonCellRenderList',
|
|
|
+ cellRendererParams: param => {
|
|
|
+ return {
|
|
|
+ list: [
|
|
|
+ {
|
|
|
+ onClick: this.handleEdit,
|
|
|
+ label: this.$t('action.edit'),
|
|
|
+ buttonType: 'primary',
|
|
|
+ buttonSize: 'mini'
|
|
|
+ },
|
|
|
+ // {
|
|
|
+ // onClick: this.manageSubscribe,
|
|
|
+ // label: this.$t('channel.subscribeManage'),
|
|
|
+ // buttonType: 'warning',
|
|
|
+ // buttonSize: 'mini',
|
|
|
+ // },
|
|
|
+ // {
|
|
|
+ // onClick: this.channelImHistory,
|
|
|
+ // label: this.$t('channel.channelImHistory'),
|
|
|
+ // buttonType: 'success',
|
|
|
+ // buttonSize: 'mini',
|
|
|
+ // },
|
|
|
+ {
|
|
|
+ onClick: this.deleteSingle,
|
|
|
+ label: this.$t('action.delete'),
|
|
|
+ buttonType: 'danger',
|
|
|
+ buttonSize: 'mini',
|
|
|
+ }
|
|
|
+ ]}
|
|
|
+ },
|
|
|
+ filter: false,
|
|
|
+ pinned: 'right',
|
|
|
+ lockPinned: true,
|
|
|
+ minWidth: this.$i18n.locale === 'zh' ? 200 : 300,
|
|
|
+ resizable: false,
|
|
|
+ sortable: false
|
|
|
+ }
|
|
|
+ // {
|
|
|
+ // headerName: this.$t('action.edit'), field: 'id',
|
|
|
+ // cellRendererFramework: 'ButtonCellRender',
|
|
|
+ // cellRendererParams: {
|
|
|
+ // onClick: this.handEdit,
|
|
|
+ // label: this.$t('action.edit'),
|
|
|
+ // buttonType: 'primary',
|
|
|
+ // buttonSize: 'mini'
|
|
|
+ // },
|
|
|
+ // filter: false,
|
|
|
+ // pinned: 'right',
|
|
|
+ // lockPinned: true,
|
|
|
+ // width: 100,
|
|
|
+ // resizable: false,
|
|
|
+ // sortable: false
|
|
|
+ // },
|
|
|
+ //
|
|
|
+ // {
|
|
|
+ // headerName: this.$t('channel.subscribeManage'), field: 'id',
|
|
|
+ // cellRendererFramework: 'ButtonCellRender',
|
|
|
+ // cellRendererParams: {
|
|
|
+ // onClick: this.manageSubscribe,
|
|
|
+ // label: this.$t('channel.subscribeManage'),
|
|
|
+ // buttonType: 'success',
|
|
|
+ // buttonSize: 'mini'
|
|
|
+ // },
|
|
|
+ // filter: false,
|
|
|
+ // pinned: 'right',
|
|
|
+ // lockPinned: true,
|
|
|
+ // width: 100,
|
|
|
+ // resizable: false,
|
|
|
+ // sortable: false
|
|
|
+ // },
|
|
|
+ //
|
|
|
+ // {
|
|
|
+ // headerName: "留言历史", field: 'id',
|
|
|
+ // cellRendererFramework: 'ButtonCellRender',
|
|
|
+ // cellRendererParams: {
|
|
|
+ // onClick: this.channelImHistory,
|
|
|
+ // label: "留言历史",
|
|
|
+ // buttonType: 'success',
|
|
|
+ // buttonSize: 'mini'
|
|
|
+ // },
|
|
|
+ // filter: false,
|
|
|
+ // pinned: 'right',
|
|
|
+ // lockPinned: true,
|
|
|
+ // width: 100,
|
|
|
+ // resizable: false,
|
|
|
+ // sortable: false
|
|
|
+ // },
|
|
|
+ //
|
|
|
+ // {
|
|
|
+ // headerName: this.$t('action.delete'), field: 'id',
|
|
|
+ // cellRendererFramework: 'ButtonCellRender',
|
|
|
+ // cellRendererParams: param => {
|
|
|
+ // return {
|
|
|
+ // onClick: this.deleteSingle,
|
|
|
+ // label: this.$t('action.delete'),
|
|
|
+ // buttonType: 'danger',
|
|
|
+ // buttonSize: 'mini'
|
|
|
+ // }
|
|
|
+ // },
|
|
|
+ // pinned: 'right',
|
|
|
+ // lockPinned: true,
|
|
|
+ // width: 100,
|
|
|
+ // resizable: false,
|
|
|
+ // filter: false,
|
|
|
+ // sortable: false
|
|
|
+ // }
|
|
|
+ ]
|
|
|
+ this.defaultColDef = {
|
|
|
+ sortable: true,
|
|
|
+ resizable: true,
|
|
|
+ comparator: this.dateCustomComparator,
|
|
|
+ filterParams: {
|
|
|
+ debounceMs: 200,
|
|
|
+ newRowsAction: 'keep',
|
|
|
+ textCustomComparator: this.textCustomComparator,
|
|
|
+ comparator: this.dateCustomComparator
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.rowSelection = 'multiple'
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ window.onresize = this.windowResize
|
|
|
+ this.gridApi = this.gridOptions.api
|
|
|
+ this.gridColumnApi = this.gridOptions.columnApi
|
|
|
+ // 设置默认排序字段，应用列状态之后会触发 gridSortChange 函数，会调用getlist，后面不需要再调用this.getlist
|
|
|
+ this.gridColumnApi.applyColumnState({
|
|
|
+ state: [
|
|
|
+ {
|
|
|
+ colId: 'id',
|
|
|
+ sort: 'asc'
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ })
|
|
|
+ // this.getEmployees()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ windowResize() {
|
|
|
+ this.$set(this, 'mainAreaHeight', Number(document.documentElement.clientHeight) - 84)
|
|
|
+ },
|
|
|
+ handlerDelete(ids) {
|
|
|
+ this.$confirm(this.$t('action.sureDelete'), this.$t('action.waring'), {
|
|
|
+ confirmButtonText: this.$t('action.yes'),
|
|
|
+ cancelButtonText: this.$t('action.cancel'),
|
|
|
+ type: 'warning'
|
|
|
+ }).then(() => {
|
|
|
+ API_ScreenTip.remove(ids).then(
|
|
|
+ response => {
|
|
|
+ this.getList()
|
|
|
+ this.$message({
|
|
|
+ type: 'success',
|
|
|
+ message: this.$t('action.deleted')
|
|
|
+ })
|
|
|
+ }
|
|
|
+ ).catch(response => {
|
|
|
+ this.$message({
|
|
|
+ type: 'info',
|
|
|
+ message: response.message
|
|
|
+ })
|
|
|
+ })
|
|
|
+ }).catch(() => {
|
|
|
+ this.$message({
|
|
|
+ type: 'info',
|
|
|
+ message: this.$t('action.cancelDelete')
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ deleteSingle(row) {
|
|
|
+ this.handlerDelete(row.id)
|
|
|
+ },
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 创建频道
|
|
|
+ */
|
|
|
+ createScreenTip() {
|
|
|
+ this.formshow = true
|
|
|
+ this.formmodel = {
|
|
|
+ text_color: '#FFFFFF',
|
|
|
+ screen_bg_color:'#409EFF',
|
|
|
+ part_id: this.$store.getters.partId
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /** 分页大小发生改变 */
|
|
|
+ handlePageSizeChange(size) {
|
|
|
+ this.params.page_size = size
|
|
|
+ this.getList()
|
|
|
+ },
|
|
|
+
|
|
|
+ /** 分页页数发生改变 */
|
|
|
+ handlePageCurrentChange(page) {
|
|
|
+ this.params.page_no = page
|
|
|
+ this.getList()
|
|
|
+ },
|
|
|
+ /** 加载列表数据 */
|
|
|
+ getList() {
|
|
|
+ this.loading = true
|
|
|
+ const param = this.MixinClone(this.params)
|
|
|
+ this.gridApi.showLoadingOverlay()
|
|
|
+ API_ScreenTip.getList(param).then(response => {
|
|
|
+ this.loading = false
|
|
|
+ // this.tableData = [...response.data]
|
|
|
+ this.pageData = {
|
|
|
+ page_no: response.page_no,
|
|
|
+ page_size: response.page_size,
|
|
|
+ data_total: response.data_total
|
|
|
+ }
|
|
|
+ this.$nextTick(() => {
|
|
|
+ const node = this.gridApi.getDisplayedRowAtIndex(0)
|
|
|
+ if (node !== null && node !== undefined) {
|
|
|
+ node.setSelected(true)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.rowData = [...response.data]
|
|
|
+ this.refreshPlayStatus()
|
|
|
+ }).catch(() => {
|
|
|
+ this.loading = false
|
|
|
+ })
|
|
|
+ },
|
|
|
+ /** 处理搜索 */
|
|
|
+ handlerSearch(keywords) {
|
|
|
+ this.params.query = keywords
|
|
|
+ this.getList()
|
|
|
+ },
|
|
|
+ /** 处理字段排序 */
|
|
|
+ tableSort(column) {
|
|
|
+ if (column.order !== null) {
|
|
|
+ this.params.sort = column.prop
|
|
|
+ this.params.dir = column.order === 'ascending' ? 'asc' : 'desc'
|
|
|
+ } else {
|
|
|
+ this.params.sort = null
|
|
|
+ this.params.dir = null
|
|
|
+ }
|
|
|
+ this.getList()
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 格式化unix时间戳
|
|
|
+ **/
|
|
|
+ unixDateFormatter(param) {
|
|
|
+ if (!param.value) return ''
|
|
|
+ return unix2Date(param.value * 1000)
|
|
|
+ },
|
|
|
+
|
|
|
+ gridSortChange(param) {
|
|
|
+ const columnState = param.columnApi.getColumnState()
|
|
|
+ // 排序状态
|
|
|
+ const sortState = columnState.filter(function(s) {
|
|
|
+ return s.sort != null
|
|
|
+ }).map(function(s) {
|
|
|
+ return {
|
|
|
+ colId: s.colId,
|
|
|
+ sort: s.sort,
|
|
|
+ sortIndex: s.sortIndex
|
|
|
+ }
|
|
|
+ }).sort(function(a, b) {
|
|
|
+ return a.sortIndex - b.sortIndex
|
|
|
+ })
|
|
|
+ if (sortState.length > 0) {
|
|
|
+ if (sortState.length === 1) {
|
|
|
+ this.params.sort = sortState[0].colId
|
|
|
+ this.params.dir = sortState[0].sort
|
|
|
+ } else {
|
|
|
+ let sortstring = ''
|
|
|
+ sortState.forEach(function(item) {
|
|
|
+ sortstring += item.colId + ' ' + item.sort + ','
|
|
|
+ })
|
|
|
+ this.params.sort = sortstring.substring(0, sortstring.length - 1)
|
|
|
+ this.params.dir = ' '
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ delete this.params.sort
|
|
|
+ delete this.params.dir
|
|
|
+ }
|
|
|
+ this.getList()
|
|
|
+ },
|
|
|
+
|
|
|
+ filterModifed(param) { // todo 通过转换后的数值过滤，需要转回原始数值
|
|
|
+ var model = param.api.getFilterModel()
|
|
|
+ this.params.filter = JSON.stringify(model)
|
|
|
+ this.getList()
|
|
|
+ },
|
|
|
+
|
|
|
+ handleEdit(row) {
|
|
|
+ this.formmodel = {
|
|
|
+ ...row
|
|
|
+ }
|
|
|
+ this.formtitle=this.$t('screenTip.tipEdit')
|
|
|
+ this.formshow = true
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 提交新增表单
|
|
|
+ * @param formname
|
|
|
+ */
|
|
|
+ handlerFormSubmit(formName) {
|
|
|
+ this.$refs[formName].validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ if (!this.formmodel.id) {
|
|
|
+ /** 新增 */
|
|
|
+ this.formmodel.part_id = this.$store.getters.partId
|
|
|
+
|
|
|
+ API_ScreenTip.add(this.formmodel).then(() => {
|
|
|
+ this.formshow = false
|
|
|
+ this.$message.success(this.$t('action.addSuccess'))
|
|
|
+ this.getList()
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ API_ScreenTip.update(this.formmodel.id, this.formmodel).then(() => {
|
|
|
+ this.formshow = false
|
|
|
+ this.$message.success(this.$t('action.editSuccess'))
|
|
|
+ this.getList()
|
|
|
+ })
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.$message.error(this.$t('action.fromError'))
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ radioFilterFormatter(params, array) {
|
|
|
+ const item = array.filter(p => p.value === params.value)[0]
|
|
|
+ if (item) {
|
|
|
+ if (item.color) {
|
|
|
+ return '<span style="color:' + item.color + '">' + item.key + '</span>'
|
|
|
+ } else {
|
|
|
+ return item.key
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ return ''
|
|
|
+ }
|
|
|
+ },
|
|
|
+ scrollDirectFormatter(params,array){
|
|
|
+ const item = array.filter(p => p.value === params.value)[0]
|
|
|
+ if (item) {
|
|
|
+ return item.key
|
|
|
+ } else {
|
|
|
+ return ''
|
|
|
+ }
|
|
|
+ },
|
|
|
+ colorFormatter(params){
|
|
|
+ return '<div style="background:' + params.value+ ';width:100%;height: 100%;"></div>'
|
|
|
+ },
|
|
|
+
|
|
|
+ textShow(params){
|
|
|
+ console.log('pms',params)
|
|
|
+ return '<div style="background:' + params.data.screen_bg_color+ ';color:'+params.data.text_color+';width:100%;height: 100%;overflow: hidden;text-align: center;"><div class="'+(params.data.bool_scroll?('animate'+params.data.scroll_direct):'')+'">'+params.value+'</div></div>'
|
|
|
+ },
|
|
|
+
|
|
|
+ scrollChange(val){
|
|
|
+ this.rules.scroll_direct[0].required=val
|
|
|
+ },
|
|
|
+
|
|
|
+ // handlerSubscribeSubmit() {
|
|
|
+ // let subscribeIds = []
|
|
|
+ // this.channelSubscribers.forEach(item => {
|
|
|
+ // subscribeIds = [...item.clerks.filter(p => p.checked).map(p => p.member_id), ...subscribeIds]
|
|
|
+ // })
|
|
|
+ // API_ScreenTip.setChannelSubscribers({ channel_id: this.formmodel.id, member_ids: subscribeIds.length === 0 ? null : [...subscribeIds] }).then(() => {
|
|
|
+ // this.formSubscribe = false
|
|
|
+ // this.$message.success(this.$t('action.editSuccess'))
|
|
|
+ // })
|
|
|
+ // },
|
|
|
+ // manageSubscribe(row) {
|
|
|
+ // this.formmodel = { ...row }
|
|
|
+ // API_ScreenTip.getChannelSubscribers(row.id).then(res => {
|
|
|
+ // this.channelSubscribers.forEach(item => {
|
|
|
+ // item.clerks.map(k => {
|
|
|
+ // k.checked = res.map(p => p.member_id).includes(k.member_id)
|
|
|
+ // return k
|
|
|
+ // })
|
|
|
+ // const checkedLength = item.clerks.filter(p => p.checked).length
|
|
|
+ // this.$set(item, 'allCkeck', item.clerks.length === checkedLength)
|
|
|
+ // this.$set(item, 'indeterminate', (checkedLength !== 0) && (item.clerks.length !== checkedLength))
|
|
|
+ // })
|
|
|
+ // })
|
|
|
+ // this.subscribeTitle = row.channel_name + this.$t('channel.subscribeManage')
|
|
|
+ // this.formSubscribe = true
|
|
|
+ // },
|
|
|
+ // channelImHistory(row) {
|
|
|
+ // this.$router.push({ name: 'channelImHistory', params: { id: row.id, callback: this.getList() }})
|
|
|
+ // },
|
|
|
+ // getEmployees() {
|
|
|
+ // const _this = this
|
|
|
+ // _this.nurses = []
|
|
|
+ // API_Clerk.listByPartRoleId({ partId: this.$store.getters.partId }).then(res => {
|
|
|
+ // _this.clerks = res
|
|
|
+ // const groupBy = (arr, func) =>
|
|
|
+ // arr.map(typeof func === 'function' ? func : val => val[func]).reduce((acc, val, i) => {
|
|
|
+ // acc[val] = (acc[val] || []).concat(arr[i])
|
|
|
+ // return acc
|
|
|
+ // }, {})
|
|
|
+ // const groupData = groupBy(res, item => item.role_name)
|
|
|
+ // _this.nurses = Object.entries(groupData)
|
|
|
+ //
|
|
|
+ // _this.nurses.forEach(item => {
|
|
|
+ // this.channelSubscribers.push({ 'roleName': item[0], 'clerks': item[1].map(i => { return { ...i, 'checked': false } }), 'allCheck': false, 'indeterminate': false })
|
|
|
+ // })
|
|
|
+ //
|
|
|
+ // })
|
|
|
+ // },
|
|
|
+ handleCheckboxChanged(item) {
|
|
|
+ this.countAllRole(item)
|
|
|
+ },
|
|
|
+ /** 计算传入角色组的选择情况 */
|
|
|
+ countAllRole(role) {
|
|
|
+ const _list = []
|
|
|
+ if (!Array.isArray(role)) {
|
|
|
+ if (role.clerks) _list.push(...this.countAllRole(role.clerks))
|
|
|
+ } else {
|
|
|
+ role.forEach(item => {
|
|
|
+ _list.push(item)
|
|
|
+ })
|
|
|
+ }
|
|
|
+ const length = _list.length
|
|
|
+ const length_checked = _list.filter(_item => _item.checked).length
|
|
|
+ this.$set(role, 'allCkeck', length === _list.filter(_item => _item.checked).length)
|
|
|
+ this.$set(role, 'indeterminate', (length_checked !== 0) && (length !== length_checked))
|
|
|
+ return _list
|
|
|
+ },
|
|
|
+ handleCheckAll(checked, item) {
|
|
|
+ this.$set(item, 'indeterminate', false)
|
|
|
+ this.setFrameCheck(item, checked)
|
|
|
+ },
|
|
|
+ /** 设置选择状态 */
|
|
|
+ setFrameCheck(item, checked) {
|
|
|
+ const perm = this.MixinClone(item)
|
|
|
+ if (!Array.isArray(perm)) {
|
|
|
+ this.$set(item, 'checked', checked)
|
|
|
+ if (item.clerks && item.clerks.length) {
|
|
|
+ this.$set(item, 'clerks', this.setFrameCheck(item.clerks, checked))
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ perm.map(item => {
|
|
|
+ item.checked = checked
|
|
|
+ this.$set(item, 'checked', checked)
|
|
|
+ if (item.clerks && item.clerks.length) {
|
|
|
+ this.$set(item, 'clerks', this.setFrameCheck(item.clerks, checked))
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ return perm
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style >
|
|
|
+
|
|
|
+ .animate1 {
|
|
|
+ white-space: nowrap;
|
|
|
+ animation: 10s wordsLoop1 linear infinite normal;
|
|
|
+ }
|
|
|
+ .animate2 {
|
|
|
+ white-space: nowrap;
|
|
|
+ animation: 10s wordsLoop2 linear infinite normal;
|
|
|
+ }
|
|
|
+ .animate3 {
|
|
|
+ white-space: nowrap;
|
|
|
+ animation: 10s wordsLoop3 linear infinite normal;
|
|
|
+ }
|
|
|
+ .animate4 {
|
|
|
+ white-space: nowrap;
|
|
|
+ animation: 10s wordsLoop4 linear infinite normal;
|
|
|
+ }
|
|
|
+
|
|
|
+ @keyframes wordsLoop1 {
|
|
|
+ 0% {
|
|
|
+ transform: translateX(-100%);
|
|
|
+ -webkit-transform: translateX(-100%);
|
|
|
+ }
|
|
|
+ 100% {
|
|
|
+ transform: translateX(100%);
|
|
|
+ -webkit-transform: translateX(100%);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ @-webkit-keyframes wordsLoop1 {
|
|
|
+ 0% {
|
|
|
+ transform: translateX(-100%);
|
|
|
+ -webkit-transform: translateX(-100%);
|
|
|
+ }
|
|
|
+ 100% {
|
|
|
+ transform: translateX(100%);
|
|
|
+ -webkit-transform: translateX(100%);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ @keyframes wordsLoop2 {
|
|
|
+ 0% {
|
|
|
+ transform: translateX(100%);
|
|
|
+ -webkit-transform: translateX(100%);
|
|
|
+ }
|
|
|
+ 100% {
|
|
|
+ transform: translateX(-100%);
|
|
|
+ -webkit-transform: translateX(-100%);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ @-webkit-keyframes wordsLoop2 {
|
|
|
+ 0% {
|
|
|
+ transform: translateX(100%);
|
|
|
+ -webkit-transform: translateX(100%);
|
|
|
+ }
|
|
|
+ 100% {
|
|
|
+ transform: translateX(-100%);
|
|
|
+ -webkit-transform: translateX(-100%);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ @keyframes wordsLoop4 {
|
|
|
+ 0% {
|
|
|
+ transform: translateY(100%);
|
|
|
+ -webkit-transform: translateY(100%);
|
|
|
+ }
|
|
|
+ 100% {
|
|
|
+ transform: translateY(-100%);
|
|
|
+ -webkit-transform: translateY(-100%);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ @-webkit-keyframes wordsLoop4 {
|
|
|
+ 0% {
|
|
|
+ transform: translateY(100%);
|
|
|
+ -webkit-transform: translateY(100%);
|
|
|
+ }
|
|
|
+ 100% {
|
|
|
+ transform: translateY(-100%);
|
|
|
+ -webkit-transform: translateY(-100%);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ @keyframes wordsLoop3 {
|
|
|
+ 0% {
|
|
|
+ transform: translateY(-100%);
|
|
|
+ -webkit-transform: translateY(-100%);
|
|
|
+ }
|
|
|
+ 100% {
|
|
|
+ transform: translateY(100%);
|
|
|
+ -webkit-transform: translateY(100%);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ @-webkit-keyframes wordsLoop3 {
|
|
|
+ 0% {
|
|
|
+ transform: translateY(-100%);
|
|
|
+ -webkit-transform: translateY(-100%);
|
|
|
+ }
|
|
|
+ 100% {
|
|
|
+ transform: translateY(100%);
|
|
|
+ -webkit-transform: translateY(100%);
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|
