|
|
@@ -1,212 +1,268 @@
|
|
|
<template>
|
|
|
<div class="manage-root edit-person">
|
|
|
- <Header/>
|
|
|
+ <Header />
|
|
|
<div class="manage-root-contain">
|
|
|
- <div class="common-title-box">
|
|
|
- <h3><i class="el-icon-arrow-left" @click="$router.go(-1)"></i>栏目模板</h3>
|
|
|
- <div class="btn-box">
|
|
|
- <el-button type="primary" size="small" @click="handleEdit()">创建模板</el-button>
|
|
|
- </div>
|
|
|
+ <div class="common-title-box">
|
|
|
+ <h3>
|
|
|
+ <i class="el-icon-arrow-left" @click="$router.go(-1)"></i>栏目模板
|
|
|
+ </h3>
|
|
|
+ <div class="btn-box">
|
|
|
+ <el-button type="primary" size="small" @click="handleEdit()"
|
|
|
+ >创建模板</el-button
|
|
|
+ >
|
|
|
</div>
|
|
|
- <div class="search-box">
|
|
|
- <div class="search-item">
|
|
|
- <label>搜索</label>
|
|
|
- <el-input
|
|
|
- placeholder="输入搜索内容"
|
|
|
- v-model="searchInput" maxlength="200">
|
|
|
- <i slot="suffix" class="el-input__icon el-icon-search" @click="getList(1)" style="cursor: pointer;"></i>
|
|
|
- </el-input>
|
|
|
- </div>
|
|
|
- <div class="search-item">
|
|
|
- <label>状态</label>
|
|
|
- <el-select v-model="searchStatus" @change="getList(1)" placeholder="请选择">
|
|
|
- <el-option
|
|
|
- v-for="item in channelStatusList"
|
|
|
- :key="item.value"
|
|
|
- :label="item.label"
|
|
|
- :value="item.value">
|
|
|
- </el-option>
|
|
|
- </el-select>
|
|
|
- </div>
|
|
|
- <div class="search-item">
|
|
|
- <label>学段</label>
|
|
|
- <el-select v-model="searchStudy" @change="getList(1)" placeholder="请选择">
|
|
|
- <el-option
|
|
|
- v-for="item in $studyTypeAll"
|
|
|
- :key="item.study_phase"
|
|
|
- :label="item.study_phase_name"
|
|
|
- :value="item.study_phase">
|
|
|
- </el-option>
|
|
|
- </el-select>
|
|
|
- </div>
|
|
|
+ </div>
|
|
|
+ <div class="search-box">
|
|
|
+ <div class="search-item">
|
|
|
+ <label>搜索</label>
|
|
|
+ <el-input
|
|
|
+ placeholder="输入搜索内容"
|
|
|
+ v-model="searchInput"
|
|
|
+ maxlength="200"
|
|
|
+ >
|
|
|
+ <i
|
|
|
+ slot="suffix"
|
|
|
+ class="el-input__icon el-icon-search"
|
|
|
+ @click="getList(1)"
|
|
|
+ style="cursor: pointer"
|
|
|
+ ></i>
|
|
|
+ </el-input>
|
|
|
</div>
|
|
|
- <el-table
|
|
|
- class="search-table"
|
|
|
- :data="tableData"
|
|
|
- style="width: 100%"
|
|
|
- @sort-change="handleSort"
|
|
|
- :default-sort = dataSort
|
|
|
- :max-height="tableHeight"
|
|
|
- v-loading="tableLoading">
|
|
|
- <el-table-column
|
|
|
- type="index"
|
|
|
- label="#"
|
|
|
- sortable
|
|
|
- width="56"
|
|
|
- :index="(pageNumber-1)*pageSize+1">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="tpl_name"
|
|
|
- label="名称"
|
|
|
- sortable="custom"
|
|
|
- min-width="226">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="study_phase"
|
|
|
- label="学段"
|
|
|
- width="72">
|
|
|
- <template slot-scope="scope">
|
|
|
- {{formatterStudy(scope.row)}}
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="chn_count"
|
|
|
- label="栏目数"
|
|
|
- sortable
|
|
|
- min-width="94">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="creator_real_name"
|
|
|
- label="创建人"
|
|
|
- width="88"
|
|
|
- sortable="custom">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="create_time"
|
|
|
- label="创建时间"
|
|
|
- width="144"
|
|
|
- sortable="custom">
|
|
|
- <template slot-scope="scope">
|
|
|
- {{scope.row.create_time?scope.row.create_time.substring(0,16):'-'}}
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="status"
|
|
|
- label="状态"
|
|
|
- width="104" >
|
|
|
- <template slot-scope="scope">
|
|
|
- <div class="status-box">
|
|
|
- <span :style="{background:statusColorList[scope.row.tpl_status].bg}"></span>
|
|
|
- <b :style="{color:statusColorList[scope.row.tpl_status].color}">{{statusColorList[scope.row.tpl_status].text}}</b>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="tpl_note"
|
|
|
- label="说明"
|
|
|
- width="144">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- fixed="right"
|
|
|
- label="操作"
|
|
|
- width="150">
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-button
|
|
|
- @click.native.prevent="handleEdit(scope.row)"
|
|
|
- type="text"
|
|
|
- size="small"
|
|
|
- class="primary-btn">
|
|
|
- 编辑
|
|
|
- </el-button>
|
|
|
- <el-button
|
|
|
- @click.native.prevent="handleUp(scope.row, scope.$index)"
|
|
|
- type="text"
|
|
|
- size="small"
|
|
|
- class="primary-btn"
|
|
|
- v-if="scope.row.tpl_status===0">
|
|
|
- 启用
|
|
|
- </el-button>
|
|
|
- <el-button
|
|
|
- @click.native.prevent="handleUp(scope.row, scope.$index)"
|
|
|
- type="text"
|
|
|
- size="small"
|
|
|
- class="red-btn"
|
|
|
- v-else-if="scope.row.tpl_status===1">
|
|
|
- 停用
|
|
|
- </el-button>
|
|
|
- <el-button
|
|
|
- @click.native.prevent="handleDelete(scope.row, scope.$index)"
|
|
|
- type="text"
|
|
|
- size="small"
|
|
|
- class="red-btn">
|
|
|
- 删除
|
|
|
- </el-button>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- <el-pagination
|
|
|
- background
|
|
|
- @size-change="handleSizeChange"
|
|
|
- @current-change="handleCurrentChange"
|
|
|
- :current-page="pageNumber"
|
|
|
- :page-sizes="[10, 20, 30, 40]"
|
|
|
- :page-size="pageSize"
|
|
|
- layout="total, prev, pager, next, sizes, jumper"
|
|
|
- :total="total_count">
|
|
|
- </el-pagination>
|
|
|
+ <div class="search-item">
|
|
|
+ <label>状态</label>
|
|
|
+ <el-select
|
|
|
+ v-model="searchStatus"
|
|
|
+ @change="getList(1)"
|
|
|
+ placeholder="请选择"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in channelStatusList"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ <div class="search-item">
|
|
|
+ <label>学段</label>
|
|
|
+ <el-select
|
|
|
+ v-model="searchStudy"
|
|
|
+ @change="getList(1)"
|
|
|
+ placeholder="请选择"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in $studyTypeAll"
|
|
|
+ :key="item.study_phase"
|
|
|
+ :label="item.study_phase_name"
|
|
|
+ :value="item.study_phase"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <el-table
|
|
|
+ class="search-table"
|
|
|
+ :data="tableData"
|
|
|
+ style="width: 100%"
|
|
|
+ @sort-change="handleSort"
|
|
|
+ :default-sort="dataSort"
|
|
|
+ :max-height="tableHeight"
|
|
|
+ v-loading="tableLoading"
|
|
|
+ >
|
|
|
+ <el-table-column
|
|
|
+ type="index"
|
|
|
+ label="#"
|
|
|
+ sortable
|
|
|
+ width="56"
|
|
|
+ :index="(pageNumber - 1) * pageSize + 1"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="tpl_name"
|
|
|
+ label="名称"
|
|
|
+ sortable="custom"
|
|
|
+ min-width="226"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="study_phase" label="学段" width="72">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ {{ formatterStudy(scope.row) }}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="chn_count"
|
|
|
+ label="栏目数"
|
|
|
+ sortable
|
|
|
+ min-width="94"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="creator_real_name"
|
|
|
+ label="创建人"
|
|
|
+ width="88"
|
|
|
+ sortable="custom"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="create_time"
|
|
|
+ label="创建时间"
|
|
|
+ width="144"
|
|
|
+ sortable="custom"
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ {{
|
|
|
+ scope.row.create_time
|
|
|
+ ? scope.row.create_time.substring(0, 16)
|
|
|
+ : "-"
|
|
|
+ }}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="status" label="状态" width="104">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div class="status-box">
|
|
|
+ <span
|
|
|
+ :style="{
|
|
|
+ background: statusColorList[scope.row.tpl_status].bg,
|
|
|
+ }"
|
|
|
+ ></span>
|
|
|
+ <b
|
|
|
+ :style="{ color: statusColorList[scope.row.tpl_status].color }"
|
|
|
+ >{{ statusColorList[scope.row.tpl_status].text }}</b
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="tpl_note" label="说明" width="144">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column fixed="right" label="操作" width="150">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button
|
|
|
+ @click.native.prevent="handleEdit(scope.row)"
|
|
|
+ type="text"
|
|
|
+ size="small"
|
|
|
+ class="primary-btn"
|
|
|
+ >
|
|
|
+ 编辑
|
|
|
+ </el-button>
|
|
|
+ <el-button
|
|
|
+ @click.native.prevent="handleUp(scope.row, scope.$index)"
|
|
|
+ type="text"
|
|
|
+ size="small"
|
|
|
+ class="primary-btn"
|
|
|
+ v-if="scope.row.tpl_status === 0"
|
|
|
+ >
|
|
|
+ 启用
|
|
|
+ </el-button>
|
|
|
+ <el-button
|
|
|
+ @click.native.prevent="handleUp(scope.row, scope.$index)"
|
|
|
+ type="text"
|
|
|
+ size="small"
|
|
|
+ class="red-btn"
|
|
|
+ v-else-if="scope.row.tpl_status === 1"
|
|
|
+ >
|
|
|
+ 停用
|
|
|
+ </el-button>
|
|
|
+ <el-button
|
|
|
+ @click.native.prevent="handleDelete(scope.row, scope.$index)"
|
|
|
+ type="text"
|
|
|
+ size="small"
|
|
|
+ class="red-btn"
|
|
|
+ >
|
|
|
+ 删除
|
|
|
+ </el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <el-pagination
|
|
|
+ background
|
|
|
+ @size-change="handleSizeChange"
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
+ :current-page="pageNumber"
|
|
|
+ :page-sizes="[10, 20, 30, 40]"
|
|
|
+ :page-size="pageSize"
|
|
|
+ layout="total, prev, pager, next, sizes, jumper"
|
|
|
+ :total="total_count"
|
|
|
+ >
|
|
|
+ </el-pagination>
|
|
|
</div>
|
|
|
<el-dialog
|
|
|
- :visible.sync="channelFlag"
|
|
|
- :show-close="true"
|
|
|
- :close-on-click-modal="false"
|
|
|
- :modal-append-to-body="false"
|
|
|
- width="484px"
|
|
|
- class="login-dialog"
|
|
|
- v-if="channelFlag">
|
|
|
- <div class="channel-header">
|
|
|
- {{channelForm.id?'编辑模板':'创建模版'}}
|
|
|
- </div>
|
|
|
- <el-form :model="channelForm" :rules="rulesChannelForm" ref="channelForm" label-width="100px" class="channelForm" v-loading="pageLoading">
|
|
|
- <el-form-item label="模板名称" prop="tpl_name">
|
|
|
- <el-input v-model="channelForm.tpl_name" placeholder="请输入模板名称" @blur="handleTrim('channelForm','tpl_name')" maxlength="200"></el-input>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="学段" prop="study_phase">
|
|
|
- <el-select v-model="channelForm.study_phase" placeholder="请选择">
|
|
|
- <el-option
|
|
|
- v-for="item in $studyType"
|
|
|
- :key="item.study_phase"
|
|
|
- :label="item.study_phase_name"
|
|
|
- :value="item.study_phase">
|
|
|
- </el-option>
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="栏目" prop="chn_data_str">
|
|
|
- <el-input
|
|
|
- type="textarea"
|
|
|
- :rows="4"
|
|
|
- placeholder="请输入栏目"
|
|
|
- v-model="channelForm.chn_data_str"
|
|
|
- @blur="handleChn" maxlength="300"
|
|
|
- show-word-limit>
|
|
|
- </el-input>
|
|
|
- <p class="tips">请按一行一个栏目进行输入</p>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="说明" prop="tpl_note">
|
|
|
- <el-input
|
|
|
- type="textarea"
|
|
|
- :rows="4"
|
|
|
- placeholder="请输入说明"
|
|
|
- v-model="channelForm.tpl_note"
|
|
|
- @blur="handleTrim('channelForm','tpl_note')"
|
|
|
- maxlength="50"
|
|
|
- show-word-limit>
|
|
|
- </el-input>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item>
|
|
|
- <el-button type="primary" @click="onSubmit('channelForm')" size="small" :loading="loading">保存</el-button>
|
|
|
- <el-button @click="onCancel('channelForm')" size="small">取消</el-button>
|
|
|
- </el-form-item>
|
|
|
- </el-form>
|
|
|
+ :visible.sync="channelFlag"
|
|
|
+ :show-close="true"
|
|
|
+ :close-on-click-modal="false"
|
|
|
+ :modal-append-to-body="false"
|
|
|
+ width="484px"
|
|
|
+ class="login-dialog"
|
|
|
+ v-if="channelFlag"
|
|
|
+ >
|
|
|
+ <div class="channel-header">
|
|
|
+ {{ channelForm.id ? "编辑模板" : "创建模版" }}
|
|
|
+ </div>
|
|
|
+ <el-form
|
|
|
+ :model="channelForm"
|
|
|
+ :rules="rulesChannelForm"
|
|
|
+ ref="channelForm"
|
|
|
+ label-width="100px"
|
|
|
+ class="channelForm"
|
|
|
+ v-loading="pageLoading"
|
|
|
+ >
|
|
|
+ <el-form-item label="模板名称" prop="tpl_name">
|
|
|
+ <el-input
|
|
|
+ v-model="channelForm.tpl_name"
|
|
|
+ placeholder="请输入模板名称"
|
|
|
+ @blur="handleTrim('channelForm', 'tpl_name')"
|
|
|
+ maxlength="200"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="学段" prop="study_phase">
|
|
|
+ <el-select v-model="channelForm.study_phase" placeholder="请选择">
|
|
|
+ <el-option
|
|
|
+ v-for="item in $studyType"
|
|
|
+ :key="item.study_phase"
|
|
|
+ :label="item.study_phase_name"
|
|
|
+ :value="item.study_phase"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="栏目" prop="chn_data_str">
|
|
|
+ <el-input
|
|
|
+ type="textarea"
|
|
|
+ :rows="4"
|
|
|
+ placeholder="请输入栏目"
|
|
|
+ v-model="channelForm.chn_data_str"
|
|
|
+ @blur="handleChn"
|
|
|
+ maxlength="300"
|
|
|
+ show-word-limit
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
+ <p class="tips">请按一行一个栏目进行输入</p>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="说明" prop="tpl_note">
|
|
|
+ <el-input
|
|
|
+ type="textarea"
|
|
|
+ :rows="4"
|
|
|
+ placeholder="请输入说明"
|
|
|
+ v-model="channelForm.tpl_note"
|
|
|
+ @blur="handleTrim('channelForm', 'tpl_note')"
|
|
|
+ maxlength="50"
|
|
|
+ show-word-limit
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ @click="onSubmit('channelForm')"
|
|
|
+ size="small"
|
|
|
+ :loading="loading"
|
|
|
+ >保存</el-button
|
|
|
+ >
|
|
|
+ <el-button @click="onCancel('channelForm')" size="small"
|
|
|
+ >取消</el-button
|
|
|
+ >
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
</el-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
@@ -216,7 +272,7 @@
|
|
|
//例如：import 《组件名称》from ‘《组件路径》';
|
|
|
import Header from "../../../components/Header.vue";
|
|
|
import { getLogin } from "@/api/ajax";
|
|
|
-import { mapState } from 'vuex';
|
|
|
+import { mapState } from "vuex";
|
|
|
|
|
|
export default {
|
|
|
//import引入的组件需要注入到对象中才能使用
|
|
|
@@ -225,129 +281,130 @@ export default {
|
|
|
data() {
|
|
|
//这里存放数据
|
|
|
return {
|
|
|
- pageLoading: false,
|
|
|
- searchInput: '',
|
|
|
- searchStudy: -1,
|
|
|
- searchStatus: '',
|
|
|
- pageSize: 10,
|
|
|
- pageNumber: 1,
|
|
|
- dataSort: {},
|
|
|
- channelStatusList: [
|
|
|
- {
|
|
|
- value: '',
|
|
|
- label: '全部'
|
|
|
- },
|
|
|
- {
|
|
|
- value: 1,
|
|
|
- label: '已使用'
|
|
|
- },
|
|
|
- {
|
|
|
- value: 0,
|
|
|
- label: '未使用'
|
|
|
- }
|
|
|
- ],
|
|
|
- statusColorList:{
|
|
|
- 0: {
|
|
|
- text: '未使用',
|
|
|
- bg: '#165DFF',
|
|
|
- color: ''
|
|
|
- },
|
|
|
- 1: {
|
|
|
- text: '已使用',
|
|
|
- bg: '#00B42A',
|
|
|
- color: ''
|
|
|
- }
|
|
|
+ pageLoading: false,
|
|
|
+ searchInput: "",
|
|
|
+ searchStudy: -1,
|
|
|
+ searchStatus: "",
|
|
|
+ pageSize: 10,
|
|
|
+ pageNumber: 1,
|
|
|
+ dataSort: {},
|
|
|
+ channelStatusList: [
|
|
|
+ {
|
|
|
+ value: "",
|
|
|
+ label: "全部",
|
|
|
},
|
|
|
- tableData:[],
|
|
|
- tableHeight: "", // 表格高度
|
|
|
- total_count: 0,
|
|
|
- channelForm:{
|
|
|
- id: '',
|
|
|
- tpl_name: '',
|
|
|
- study_phase: '',
|
|
|
- chn_data_str:'',
|
|
|
- chn_data: [],
|
|
|
- tpl_note: ''
|
|
|
+ {
|
|
|
+ value: 1,
|
|
|
+ label: "已使用",
|
|
|
},
|
|
|
- rulesChannelForm:{
|
|
|
- tpl_name:[
|
|
|
- { required: true, message: '请输入模板名称', trigger: 'blur' }
|
|
|
- ],
|
|
|
- study_phase: [
|
|
|
- { required: true, message: '请选择学段', trigger: 'change' }
|
|
|
- ],
|
|
|
- chn_data_str: [
|
|
|
- { required: true, message: '请输入栏目', trigger: 'blur' }
|
|
|
- ]
|
|
|
+ {
|
|
|
+ value: 0,
|
|
|
+ label: "未使用",
|
|
|
},
|
|
|
- channelFlag: false,
|
|
|
- loading: false,
|
|
|
- tableLoading: false,
|
|
|
- oldInfo: null,
|
|
|
- }
|
|
|
+ ],
|
|
|
+ statusColorList: {
|
|
|
+ 0: {
|
|
|
+ text: "未使用",
|
|
|
+ bg: "#165DFF",
|
|
|
+ color: "",
|
|
|
+ },
|
|
|
+ 1: {
|
|
|
+ text: "已使用",
|
|
|
+ bg: "#00B42A",
|
|
|
+ color: "",
|
|
|
+ },
|
|
|
+ },
|
|
|
+ tableData: [],
|
|
|
+ tableHeight: "", // 表格高度
|
|
|
+ total_count: 0,
|
|
|
+ channelForm: {
|
|
|
+ id: "",
|
|
|
+ tpl_name: "",
|
|
|
+ study_phase: "",
|
|
|
+ chn_data_str: "",
|
|
|
+ chn_data: [],
|
|
|
+ tpl_note: "",
|
|
|
+ },
|
|
|
+ rulesChannelForm: {
|
|
|
+ tpl_name: [
|
|
|
+ { required: true, message: "请输入模板名称", trigger: "blur" },
|
|
|
+ ],
|
|
|
+ study_phase: [
|
|
|
+ { required: true, message: "请选择学段", trigger: "change" },
|
|
|
+ ],
|
|
|
+ chn_data_str: [
|
|
|
+ { required: true, message: "请输入栏目", trigger: "blur" },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ channelFlag: false,
|
|
|
+ loading: false,
|
|
|
+ tableLoading: false,
|
|
|
+ oldInfo: null,
|
|
|
+ };
|
|
|
},
|
|
|
//计算属性 类似于data概念
|
|
|
computed: {
|
|
|
- ...mapState(['$studyTypeAll','$studyType']),
|
|
|
+ ...mapState(["$studyTypeAll", "$studyType"]),
|
|
|
},
|
|
|
//监控data中数据变化
|
|
|
watch: {},
|
|
|
//方法集合
|
|
|
methods: {
|
|
|
- handleEdit(row){
|
|
|
- this.channelFlag = true
|
|
|
- if(row){
|
|
|
- this.channelForm.id = row.id
|
|
|
- this.getInfo()
|
|
|
- }else{
|
|
|
- this.channelForm ={
|
|
|
- id: '',
|
|
|
- tpl_name: '',
|
|
|
- study_phase: '',
|
|
|
- chn_data_str:'',
|
|
|
- chn_data: [],
|
|
|
- tpl_note: ''
|
|
|
- }
|
|
|
- }
|
|
|
+ handleEdit(row) {
|
|
|
+ this.channelFlag = true;
|
|
|
+ if (row) {
|
|
|
+ this.channelForm.id = row.id;
|
|
|
+ this.getInfo();
|
|
|
+ } else {
|
|
|
+ this.channelForm = {
|
|
|
+ id: "",
|
|
|
+ tpl_name: "",
|
|
|
+ study_phase: "",
|
|
|
+ chn_data_str: "",
|
|
|
+ chn_data: [],
|
|
|
+ tpl_note: "",
|
|
|
+ };
|
|
|
+ }
|
|
|
},
|
|
|
- getList(val){
|
|
|
- this.tableLoading = true
|
|
|
- if(val){
|
|
|
- this.pageNumber = val
|
|
|
- }
|
|
|
- let MethodName = "/PaperServer/Manager/ChannelTplManager/PageQueryChannelTpl"
|
|
|
- let order_column_list = []
|
|
|
- if(this.dataSort != {}){
|
|
|
- if(this.dataSort.order=='descending'){
|
|
|
- order_column_list.push({
|
|
|
- name: this.dataSort.prop,
|
|
|
- asc: false
|
|
|
- })
|
|
|
- }else if(this.dataSort.order=='ascending'){
|
|
|
- order_column_list.push({
|
|
|
- name: this.dataSort.prop,
|
|
|
- asc: true
|
|
|
- })
|
|
|
- }
|
|
|
- }
|
|
|
- let data = {
|
|
|
- key_word: this.searchInput.trim(),
|
|
|
- tpl_status: this.searchStatus,
|
|
|
- study_phase: this.searchStudy===-1?null:this.searchStudy,
|
|
|
- page_capacity:this.pageSize,
|
|
|
- cur_page:this.pageNumber,
|
|
|
- order_bys: order_column_list
|
|
|
+ getList(val) {
|
|
|
+ this.tableLoading = true;
|
|
|
+ if (val) {
|
|
|
+ this.pageNumber = val;
|
|
|
+ }
|
|
|
+ let MethodName =
|
|
|
+ "/PaperServer/Manager/ChannelTplManager/PageQueryChannelTpl";
|
|
|
+ let order_column_list = [];
|
|
|
+ if (this.dataSort != {}) {
|
|
|
+ if (this.dataSort.order == "descending") {
|
|
|
+ order_column_list.push({
|
|
|
+ name: this.dataSort.prop,
|
|
|
+ asc: false,
|
|
|
+ });
|
|
|
+ } else if (this.dataSort.order == "ascending") {
|
|
|
+ order_column_list.push({
|
|
|
+ name: this.dataSort.prop,
|
|
|
+ asc: true,
|
|
|
+ });
|
|
|
}
|
|
|
- getLogin(MethodName, data)
|
|
|
+ }
|
|
|
+ let data = {
|
|
|
+ key_word: this.searchInput.trim(),
|
|
|
+ tpl_status: this.searchStatus,
|
|
|
+ study_phase: this.searchStudy === -1 ? null : this.searchStudy,
|
|
|
+ page_capacity: this.pageSize,
|
|
|
+ cur_page: this.pageNumber,
|
|
|
+ order_bys: order_column_list,
|
|
|
+ };
|
|
|
+ getLogin(MethodName, data)
|
|
|
.then((res) => {
|
|
|
- this.tableLoading = false
|
|
|
- if(res.status===1){
|
|
|
- this.tableData = res.data.list
|
|
|
- this.total_count = res.data.total_count
|
|
|
- }
|
|
|
+ this.tableLoading = false;
|
|
|
+ if (res.status === 1) {
|
|
|
+ this.tableData = res.data.list;
|
|
|
+ this.total_count = res.data.total_count;
|
|
|
+ }
|
|
|
})
|
|
|
.catch(() => {
|
|
|
- this.tableLoading = false
|
|
|
+ this.tableLoading = false;
|
|
|
});
|
|
|
},
|
|
|
//计算table高度(动态设置table高度)
|
|
|
@@ -361,43 +418,43 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
// 处理学段
|
|
|
- formatterStudy(row){
|
|
|
- let studyCn = ''
|
|
|
- let list = this.$studyTypeAll
|
|
|
- if(row.study_phase){
|
|
|
- for(let i=0;i<list.length;i++){
|
|
|
- if(row.study_phase===list[i].study_phase){
|
|
|
- studyCn = list[i].study_phase_name
|
|
|
- }
|
|
|
- }
|
|
|
- }else{
|
|
|
- studyCn = '未知'
|
|
|
+ formatterStudy(row) {
|
|
|
+ let studyCn = "";
|
|
|
+ let list = this.$studyTypeAll;
|
|
|
+ if (row.study_phase) {
|
|
|
+ for (let i = 0; i < list.length; i++) {
|
|
|
+ if (row.study_phase === list[i].study_phase) {
|
|
|
+ studyCn = list[i].study_phase_name;
|
|
|
+ }
|
|
|
}
|
|
|
- return studyCn
|
|
|
+ } else {
|
|
|
+ studyCn = "未知";
|
|
|
+ }
|
|
|
+ return studyCn;
|
|
|
},
|
|
|
- handleSort(value){
|
|
|
- let dataSort = {
|
|
|
- prop: value.prop,
|
|
|
- order: value.order
|
|
|
- }
|
|
|
- this.dataSort = dataSort
|
|
|
- this.getList()
|
|
|
+ handleSort(value) {
|
|
|
+ let dataSort = {
|
|
|
+ prop: value.prop,
|
|
|
+ order: value.order,
|
|
|
+ };
|
|
|
+ this.dataSort = dataSort;
|
|
|
+ this.getList();
|
|
|
},
|
|
|
handleSizeChange(val) {
|
|
|
- this.pageSize = val
|
|
|
- this.pageNumber = 1
|
|
|
- this.getList()
|
|
|
+ this.pageSize = val;
|
|
|
+ this.pageNumber = 1;
|
|
|
+ this.getList();
|
|
|
},
|
|
|
handleCurrentChange(val) {
|
|
|
- this.pageNumber = val
|
|
|
- this.getList()
|
|
|
+ this.pageNumber = val;
|
|
|
+ this.getList();
|
|
|
},
|
|
|
// 停用 启用
|
|
|
handleUp(row, index) {
|
|
|
let Mname = "/PaperServer/Manager/ChannelTplManager/EditChannelTplStatus";
|
|
|
let updataData = JSON.parse(JSON.stringify(row));
|
|
|
let data = {
|
|
|
- id: row.id
|
|
|
+ id: row.id,
|
|
|
};
|
|
|
if (row.tpl_status === 1) {
|
|
|
// 下架状态
|
|
|
@@ -407,189 +464,211 @@ export default {
|
|
|
data.tpl_status = 1;
|
|
|
updataData.tpl_status = 1;
|
|
|
}
|
|
|
- getLogin(Mname, data).then(res => {
|
|
|
+ getLogin(Mname, data).then((res) => {
|
|
|
this.$message.success("操作成功");
|
|
|
this.$set(this.tableData, index, updataData);
|
|
|
});
|
|
|
},
|
|
|
// 删除
|
|
|
- handleDelete(row){
|
|
|
- this.$confirm('确定删除吗?', '提示', {
|
|
|
- confirmButtonText: '确定',
|
|
|
- cancelButtonText: '取消',
|
|
|
- type: 'warning'
|
|
|
- }).then(() => {
|
|
|
- let Mname = "/PaperServer/Manager/ChannelTplManager/DelChannelTplById";
|
|
|
- let data = {
|
|
|
- id: row.id,
|
|
|
- };
|
|
|
- getLogin(Mname, data).then(res => {
|
|
|
- this.$message({
|
|
|
- type: 'success',
|
|
|
- message: '删除成功!'
|
|
|
- });
|
|
|
- this.getList()
|
|
|
+ handleDelete(row) {
|
|
|
+ this.$confirm("确定删除吗?", "提示", {
|
|
|
+ confirmButtonText: "确定",
|
|
|
+ cancelButtonText: "取消",
|
|
|
+ type: "warning",
|
|
|
+ })
|
|
|
+ .then(() => {
|
|
|
+ let Mname =
|
|
|
+ "/PaperServer/Manager/ChannelTplManager/DelChannelTplById";
|
|
|
+ let data = {
|
|
|
+ id: row.id,
|
|
|
+ };
|
|
|
+ getLogin(Mname, data).then((res) => {
|
|
|
+ this.$message({
|
|
|
+ type: "success",
|
|
|
+ message: "删除成功!",
|
|
|
});
|
|
|
- }).catch(() => {
|
|
|
-
|
|
|
- });
|
|
|
+ this.getList();
|
|
|
+ });
|
|
|
+ })
|
|
|
+ .catch(() => {});
|
|
|
},
|
|
|
// 去掉前后空格
|
|
|
- handleTrim(form,fild){
|
|
|
- this[form][fild] = this[form][fild].trim()
|
|
|
+ handleTrim(form, fild) {
|
|
|
+ this[form][fild] = this[form][fild].trim();
|
|
|
},
|
|
|
- handleChn(){
|
|
|
- this.channelForm.chn_data_str = this.channelForm.chn_data_str.trim()
|
|
|
- this.channelForm.chn_data = this.channelForm.chn_data_str.split("\n")
|
|
|
+ handleChn() {
|
|
|
+ this.channelForm.chn_data_str = this.channelForm.chn_data_str.trim();
|
|
|
+ this.channelForm.chn_data = this.channelForm.chn_data_str.split("\n");
|
|
|
},
|
|
|
// 提交表单
|
|
|
- onSubmit(formName){
|
|
|
- this.channelForm.chn_data = this.channelForm.chn_data_str.split("\n")
|
|
|
- this.$refs[formName].validate((valid) => {
|
|
|
- if (valid) {
|
|
|
- this.loading = true
|
|
|
- let MethodName = "/PaperServer/Manager/ChannelTplManager/AddChannelTpl";
|
|
|
- if(this.channelForm.id){
|
|
|
- MethodName = "/PaperServer/Manager/ChannelTplManager/EditChannelTpl";
|
|
|
- }
|
|
|
- let data = {
|
|
|
- id: this.channelForm.id,
|
|
|
- tpl_name: this.channelForm.tpl_name,
|
|
|
- study_phase: this.channelForm.study_phase,
|
|
|
- tpl_status: this.channelForm.id?this.oldInfo.tpl_status:1,
|
|
|
- chn_data: this.channelForm.chn_data,
|
|
|
- tpl_note: this.channelForm.tpl_note
|
|
|
- }
|
|
|
- getLogin(MethodName, data)
|
|
|
+ onSubmit(formName) {
|
|
|
+ this.channelForm.chn_data = this.channelForm.chn_data_str.split("\n");
|
|
|
+ this.$refs[formName].validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ this.loading = true;
|
|
|
+ let MethodName =
|
|
|
+ "/PaperServer/Manager/ChannelTplManager/AddChannelTpl";
|
|
|
+ if (this.channelForm.id) {
|
|
|
+ MethodName =
|
|
|
+ "/PaperServer/Manager/ChannelTplManager/EditChannelTpl";
|
|
|
+ }
|
|
|
+ let data = {
|
|
|
+ id: this.channelForm.id,
|
|
|
+ tpl_name: this.channelForm.tpl_name,
|
|
|
+ study_phase: this.channelForm.study_phase,
|
|
|
+ tpl_status: this.channelForm.id ? this.oldInfo.tpl_status : 1,
|
|
|
+ chn_data: this.channelForm.chn_data,
|
|
|
+ tpl_note: this.channelForm.tpl_note,
|
|
|
+ goods_type: 2,
|
|
|
+ };
|
|
|
+ getLogin(MethodName, data)
|
|
|
.then((res) => {
|
|
|
- this.loading = false
|
|
|
- if(res.status===1){
|
|
|
- this.$message.success("保存成功")
|
|
|
- this.$refs['channelForm'].resetFields();
|
|
|
- this.channelFlag = false
|
|
|
- this.getList(1)
|
|
|
- }
|
|
|
- }).catch((res) =>{
|
|
|
- this.loading = false
|
|
|
+ this.loading = false;
|
|
|
+ if (res.status === 1) {
|
|
|
+ this.$message.success("保存成功");
|
|
|
+ this.$refs["channelForm"].resetFields();
|
|
|
+ this.channelFlag = false;
|
|
|
+ this.getList(1);
|
|
|
+ }
|
|
|
})
|
|
|
- } else {
|
|
|
- return false;
|
|
|
- }
|
|
|
- });
|
|
|
+ .catch((res) => {
|
|
|
+ this.loading = false;
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ });
|
|
|
},
|
|
|
// 取消 恢复到修改前状态
|
|
|
- onCancel(formName){
|
|
|
- // this.$refs[formName].resetFields();
|
|
|
- this.channelForm.tpl_name = JSON.parse(JSON.stringify(this.oldInfo.tpl_name))
|
|
|
- this.channelForm.study_phase = JSON.parse(JSON.stringify(this.oldInfo.study_phase))
|
|
|
- this.channelForm.chn_data_str = JSON.parse(JSON.stringify(this.oldInfo.chn_data.join("\n")))
|
|
|
- this.channelForm.tpl_note = JSON.parse(JSON.stringify(this.oldInfo.tpl_note))
|
|
|
+ onCancel(formName) {
|
|
|
+ // this.$refs[formName].resetFields();
|
|
|
+ this.channelForm.tpl_name = JSON.parse(
|
|
|
+ JSON.stringify(this.oldInfo.tpl_name)
|
|
|
+ );
|
|
|
+ this.channelForm.study_phase = JSON.parse(
|
|
|
+ JSON.stringify(this.oldInfo.study_phase)
|
|
|
+ );
|
|
|
+ this.channelForm.chn_data_str = JSON.parse(
|
|
|
+ JSON.stringify(this.oldInfo.chn_data.join("\n"))
|
|
|
+ );
|
|
|
+ this.channelForm.tpl_note = JSON.parse(
|
|
|
+ JSON.stringify(this.oldInfo.tpl_note)
|
|
|
+ );
|
|
|
},
|
|
|
// 获取信息
|
|
|
- getInfo(){
|
|
|
- this.pageLoading = true
|
|
|
- let MethodName = "/PaperServer/Manager/ChannelTplManager/FindChannelTplById";
|
|
|
- let data = {
|
|
|
- id: this.channelForm.id
|
|
|
- }
|
|
|
- getLogin(MethodName, data)
|
|
|
+ getInfo() {
|
|
|
+ this.pageLoading = true;
|
|
|
+ let MethodName =
|
|
|
+ "/PaperServer/Manager/ChannelTplManager/FindChannelTplById";
|
|
|
+ let data = {
|
|
|
+ id: this.channelForm.id,
|
|
|
+ };
|
|
|
+ getLogin(MethodName, data)
|
|
|
.then((res) => {
|
|
|
- this.pageLoading = false
|
|
|
- if(res.status===1){
|
|
|
- this.channelForm.tpl_name = JSON.parse(JSON.stringify(res.data.tpl_name))
|
|
|
- this.channelForm.study_phase = JSON.parse(JSON.stringify(res.data.study_phase))
|
|
|
- this.channelForm.chn_data_str = JSON.parse(JSON.stringify(res.data.chn_data.join("\n")))
|
|
|
- this.channelForm.tpl_note = JSON.parse(JSON.stringify(res.data.tpl_note))
|
|
|
- this.oldInfo = res.data
|
|
|
- }
|
|
|
+ this.pageLoading = false;
|
|
|
+ if (res.status === 1) {
|
|
|
+ this.channelForm.tpl_name = JSON.parse(
|
|
|
+ JSON.stringify(res.data.tpl_name)
|
|
|
+ );
|
|
|
+ this.channelForm.study_phase = JSON.parse(
|
|
|
+ JSON.stringify(res.data.study_phase)
|
|
|
+ );
|
|
|
+ this.channelForm.chn_data_str = JSON.parse(
|
|
|
+ JSON.stringify(res.data.chn_data.join("\n"))
|
|
|
+ );
|
|
|
+ this.channelForm.tpl_note = JSON.parse(
|
|
|
+ JSON.stringify(res.data.tpl_note)
|
|
|
+ );
|
|
|
+ this.oldInfo = res.data;
|
|
|
+ }
|
|
|
})
|
|
|
.catch(() => {
|
|
|
- this.pageLoading = false
|
|
|
+ this.pageLoading = false;
|
|
|
});
|
|
|
- }
|
|
|
+ },
|
|
|
},
|
|
|
//生命周期 - 创建完成（可以访问当前this实例）
|
|
|
created() {
|
|
|
- this.getList()
|
|
|
- this.getTableHeight()
|
|
|
+ this.getList();
|
|
|
+ this.getTableHeight();
|
|
|
},
|
|
|
//生命周期 - 挂载完成（可以访问DOM元素）
|
|
|
mounted() {
|
|
|
- let _this = this
|
|
|
- let input = document.querySelector('input');
|
|
|
- input.addEventListener('keyup', function(event) {
|
|
|
- // 判断是否按下回车键
|
|
|
- if (event.keyCode === 13) {
|
|
|
- // 回车键被按下，执行你想要的操作
|
|
|
- _this.getList(1)
|
|
|
- }
|
|
|
+ let _this = this;
|
|
|
+ let input = document.querySelector("input");
|
|
|
+ input.addEventListener("keyup", function (event) {
|
|
|
+ // 判断是否按下回车键
|
|
|
+ if (event.keyCode === 13) {
|
|
|
+ // 回车键被按下，执行你想要的操作
|
|
|
+ _this.getList(1);
|
|
|
+ }
|
|
|
});
|
|
|
},
|
|
|
//生命周期-创建之前
|
|
|
- beforeCreated() { },
|
|
|
+ beforeCreated() {},
|
|
|
//生命周期-挂载之前
|
|
|
- beforeMount() { },
|
|
|
+ beforeMount() {},
|
|
|
//生命周期-更新之前
|
|
|
- beforUpdate() { },
|
|
|
+ beforUpdate() {},
|
|
|
//生命周期-更新之后
|
|
|
- updated() { },
|
|
|
+ updated() {},
|
|
|
//生命周期-销毁之前
|
|
|
- beforeDestory() { },
|
|
|
+ beforeDestory() {},
|
|
|
//生命周期-销毁完成
|
|
|
- destoryed() { },
|
|
|
+ destoryed() {},
|
|
|
//如果页面有keep-alive缓存功能，这个函数会触发
|
|
|
- activated() { }
|
|
|
-}
|
|
|
+ activated() {},
|
|
|
+};
|
|
|
</script>
|
|
|
<style lang="scss" scoped>
|
|
|
/* @import url(); 引入css类 */
|
|
|
-.manage-root-contain{
|
|
|
- width: 1192px;
|
|
|
- height: calc(100vh - 84px);
|
|
|
- margin: 16px auto;
|
|
|
- border-radius: 4px;
|
|
|
- background: #FFF;
|
|
|
- padding: 24px;
|
|
|
- display: block;
|
|
|
- .common-title-box{
|
|
|
- width: 100%;
|
|
|
- .el-icon-arrow-left{
|
|
|
- font-weight: 500;
|
|
|
- margin-right: 8px;
|
|
|
- cursor: pointer;
|
|
|
- }
|
|
|
+.manage-root-contain {
|
|
|
+ width: 1192px;
|
|
|
+ height: calc(100vh - 84px);
|
|
|
+ margin: 16px auto;
|
|
|
+ border-radius: 4px;
|
|
|
+ background: #fff;
|
|
|
+ padding: 24px;
|
|
|
+ display: block;
|
|
|
+ .common-title-box {
|
|
|
+ width: 100%;
|
|
|
+ .el-icon-arrow-left {
|
|
|
+ font-weight: 500;
|
|
|
+ margin-right: 8px;
|
|
|
+ cursor: pointer;
|
|
|
}
|
|
|
- .status-box {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- span {
|
|
|
- width: 6px;
|
|
|
- height: 6px;
|
|
|
- border-radius: 3px;
|
|
|
- margin-right: 8px;
|
|
|
- margin-top: 2px;
|
|
|
- }
|
|
|
- b {
|
|
|
- font-weight: 400;
|
|
|
- font-size: 14px;
|
|
|
- line-height: 22px;
|
|
|
- color: #1D2129;
|
|
|
- }
|
|
|
+ }
|
|
|
+ .status-box {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ span {
|
|
|
+ width: 6px;
|
|
|
+ height: 6px;
|
|
|
+ border-radius: 3px;
|
|
|
+ margin-right: 8px;
|
|
|
+ margin-top: 2px;
|
|
|
+ }
|
|
|
+ b {
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 14px;
|
|
|
+ line-height: 22px;
|
|
|
+ color: #1d2129;
|
|
|
}
|
|
|
+ }
|
|
|
}
|
|
|
-.channel-header{
|
|
|
- border-bottom: 1px solid #E5E6EB;
|
|
|
- padding: 12px 16px;
|
|
|
- font-size: 16px;
|
|
|
- color: #1D2129;
|
|
|
- font-weight: 500;
|
|
|
- line-height: 24px;
|
|
|
- margin-bottom: 24px;
|
|
|
+.channel-header {
|
|
|
+ border-bottom: 1px solid #e5e6eb;
|
|
|
+ padding: 12px 16px;
|
|
|
+ font-size: 16px;
|
|
|
+ color: #1d2129;
|
|
|
+ font-weight: 500;
|
|
|
+ line-height: 24px;
|
|
|
+ margin-bottom: 24px;
|
|
|
}
|
|
|
-.tips{
|
|
|
- margin: 0;
|
|
|
- color: #86909C;
|
|
|
- font-size: 12px;
|
|
|
- line-height: 20px;
|
|
|
+.tips {
|
|
|
+ margin: 0;
|
|
|
+ color: #86909c;
|
|
|
+ font-size: 12px;
|
|
|
+ line-height: 20px;
|
|
|
}
|
|
|
</style>
|
natasha