Song/xkrs_ms
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

备课-手机端响应式优化

Browse Source
This commit is contained in:
zhanglipeng
2020-11-23 17:04:07 +08:00
parent 2b20e74930
commit 0f38388fcb
21 changed files with 2257 additions and 1495 deletions
Download Patch File Download Diff File Expand all files Collapse all files

229
ruoyi-ui/src/views/benyi/thememonthplan/data.vue
View File

@ -1,89 +1,121 @@
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px">
<el-form-item label="月计划" prop="mpid">
<el-select v-model="queryParams.mpid" size="small">
<el-option
v-for="item in themeMonthPlanOptions"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item label="周次" prop="zc">
<el-input-number
v-model="queryParams.zc"
placeholder="周次"
clearable
size="small"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
<el-form :model="queryParams" ref="queryForm" label-width="70px">
<el-row :gutter="10">
<el-col :xs="24" :ms="12" :md="5">
<el-form-item label="月计划" prop="mpid">
<el-select v-model="queryParams.mpid" size="small">
<el-option
v-for="item in themeMonthPlanOptions"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :xs="24" :ms="12" :md="5">
<el-form-item label="周次" prop="zc">
<el-input-number
v-model="queryParams.zc"
placeholder="周次"
clearable
size="small"
class="my-date-picker"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
</el-col>
<el-col :xs="24" :ms="12" :md="4">
<el-form-item class="no-margin">
<el-button
type="primary"
icon="el-icon-search"
size="mini"
@click="handleQuery"
>搜索</el-button
>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
>重置</el-button
>
</el-form-item>
</el-col>
</el-row>
</el-form>
<el-row :gutter="10" class="mb8">
<!-- <el-col :span="1.5">
<el-button
type="primary"
icon="el-icon-plus"
size="mini"
@click="handleAdd"
v-hasPermi="['benyi:thememonthplan:add']"
v-show="isShow"
>新增</el-button>
</el-col> -->
<el-col :span="1.5">
<el-button
type="success"
icon="el-icon-edit"
size="mini"
:disabled="single"
@click="handleUpdate"
v-hasPermi="['benyi:thememonthplan:edit']"
v-show="isShow"
>填充</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="danger"
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['benyi:thememonthplan:remove']"
v-show="isShow"
>删除</el-button>
</el-col>
</el-row>
<div class="mb8 btn-list">
<el-button
type="primary"
icon="el-icon-plus"
size="mini"
@click="handleAdd"
v-hasPermi="['benyi:thememonthplan:add']"
v-show="isShow"
>新增</el-button
>
<el-button
type="success"
icon="el-icon-edit"
size="mini"
:disabled="single"
@click="handleUpdate"
v-hasPermi="['benyi:thememonthplan:edit']"
v-show="isShow"
>填充</el-button
>
<el-button
type="danger"
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['benyi:thememonthplan:remove']"
v-show="isShow"
>删除</el-button
>
</div>
<el-table v-loading="loading" :data="weekplanList" @selection-change="handleSelectionChange">
<el-table
border
v-loading="loading"
:data="weekplanList"
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" width="55" align="center" />
<!-- <el-table-column label="编号" align="center" prop="id" /> -->
<el-table-column label="所属月计划" align="center" prop="mpid" :formatter="themeMonthPlanFormat" />
<el-table-column label="周次" align="center" prop="zc" />
<el-table-column label="开始时间" align="center" prop="starttime" width="180">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.starttime, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column>
<el-table-column label="结束时间" align="center" prop="endtime" width="180">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.endtime, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column>
<el-table-column
fixed
label="活动"
align="center"
prop="activityid"
:formatter="themeactivityFormat"
/>
<el-table-column
label="所属月计划"
align="center"
prop="mpid"
:formatter="themeMonthPlanFormat"
/>
<el-table-column label="周次" align="center" prop="zc" />
<el-table-column label="开始时间" align="center" prop="starttime">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.starttime, "{y}-{m}-{d}") }}</span>
</template>
</el-table-column>
<el-table-column label="结束时间" align="center" prop="endtime">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.endtime, "{y}-{m}-{d}") }}</span>
</template>
</el-table-column>
<el-table-column label="家长支持" align="center" prop="jzzc" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<el-table-column
fixed="right"
label="操作"
align="center"
width="60"
class-name="small-padding fixed-width edit-btns"
>
<template slot-scope="scope">
<el-button
size="mini"
@ -92,7 +124,8 @@
@click="handleUpdate(scope.row)"
v-hasPermi="['benyi:thememonthplan:edit']"
v-show="isShow"
>填充</el-button>
>填充</el-button
>
<el-button
size="mini"
type="text"
@ -100,13 +133,14 @@
@click="handleDelete(scope.row)"
v-hasPermi="['benyi:thememonthplan:remove']"
v-show="isShow"
>删除</el-button>
>删除</el-button
>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
v-show="total > 0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@ -114,7 +148,12 @@
/>
<!-- 添加或修改主题整合周计划对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-dialog
:title="title"
:visible.sync="open"
class="v-dialog"
append-to-body
>
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="月计划" prop="mpid">
<el-select v-model="form.mpid" size="small" :disabled="true">
@ -127,13 +166,13 @@
</el-select>
</el-form-item>
<el-form-item label="周次" prop="zc">
<el-input-number v-model="form.zc" placeholder="请输入周次" />
<el-input-number class="my-date-picker" v-model="form.zc" placeholder="请输入周次" />
</el-form-item>
<el-form-item label="开始时间" prop="starttime">
<el-date-picker
clearable
size="small"
style="width: 200px"
class="my-date-picker"
v-model="form.starttime"
type="date"
value-format="yyyy-MM-dd"
@ -144,7 +183,7 @@
<el-date-picker
clearable
size="small"
style="width: 200px"
class="my-date-picker"
v-model="form.endtime"
type="date"
value-format="yyyy-MM-dd"
@ -158,15 +197,20 @@
@change="getThemeActivityIdValue"
>
<el-checkbox
v-for="(item,i) in themeactivityOptions"
v-for="(item, i) in themeactivityOptions"
:label="item.id"
:key="i"
>{{item.name}}</el-checkbox>
>{{ item.name }}</el-checkbox
>
</el-checkbox-group>
<el-input v-model="form.activityid" v-if="false" />
</el-form-item>
<el-form-item label="家长支持" prop="jzzc">
<el-input v-model="form.jzzc" type="textarea" placeholder="请输入内容" />
<el-input
v-model="form.jzzc"
type="textarea"
placeholder="请输入内容"
/>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
@ -307,7 +351,7 @@ export default {
getMonthplan(thememonthplanid).then((response) => {
this.queryParams.mpid = response.data.id;
this.defaultThemeMonthType = response.data.id;
console.log(response.data.themes);
// console.log(response.data.themes);
var themeids = response.data.themes.split(";");
var array = [];
//console.log(arr);
@ -470,4 +514,21 @@ export default {
},
},
};
</script>
</script>
<style lang="scss" scoped>
.el-select {
width: 100%;
}
.my-date-picker {
width: 100%;
}
.edit-btns {
.el-button {
display: block;
margin: 0 auto;
}
}
.no-margin ::v-deep.el-form-item__content {
margin: 0 !important;
}
</style>

323
ruoyi-ui/src/views/benyi/thememonthplan/index.vue
View File

@ -1,111 +1,174 @@
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px">
<el-form-item label="计划名称" prop="name">
<el-input
v-model="queryParams.name"
placeholder="请输入计划名称"
clearable
size="small"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="学年学期" prop="xnxq">
<el-select v-model="queryParams.xnxq" placeholder="请选择学年学期" clearable size="small">
<el-option
v-for="dict in xnxqOptions"
:key="dict.dictValue"
:label="dict.dictLabel"
:value="dict.dictValue"
/>
</el-select>
</el-form-item>
<el-form-item label="计划月份" prop="month">
<el-date-picker
clearable
size="small"
style="width: 200px"
v-model="queryParams.month"
type="month"
value-format="yyyy-MM"
placeholder="选择计划月份"
></el-date-picker>
</el-form-item>
<el-form-item label="主题内容" prop="themes">
<el-select v-model="queryParams.themes" size="small">
<el-option
v-for="item in themeOptions"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item label="当前状态" prop="status">
<el-select v-model="queryParams.status" placeholder="请选择状态" clearable size="small">
<el-option
v-for="dict in statusOptions"
:key="dict.dictValue"
:label="dict.dictLabel"
:value="dict.dictValue"
/>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
<el-form :model="queryParams" ref="queryForm" label-width="70px">
<el-row :gutter="10">
<el-col :xs="24" :ms="12" :md="5">
<el-form-item label="计划名称" prop="name">
<el-input
v-model="queryParams.name"
placeholder="请输入计划名称"
clearable
size="small"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
</el-col>
<el-col :xs="24" :ms="12" :md="5">
<el-form-item label="学年学期" prop="xnxq">
<el-select
v-model="queryParams.xnxq"
placeholder="请选择学年学期"
clearable
size="small"
>
<el-option
v-for="dict in xnxqOptions"
:key="dict.dictValue"
:label="dict.dictLabel"
:value="dict.dictValue"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :xs="24" :ms="12" :md="5">
<el-form-item label="计划月份" prop="month">
<el-date-picker
clearable
size="small"
class="my-date-picker"
v-model="queryParams.month"
type="month"
value-format="yyyy-MM"
placeholder="选择计划月份"
></el-date-picker>
</el-form-item>
</el-col>
<el-col :xs="24" :ms="12" :md="5">
<el-form-item label="主题内容" prop="themes">
<el-select v-model="queryParams.themes" size="small">
<el-option
v-for="item in themeOptions"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :xs="24" :ms="12" :md="5">
<el-form-item label="当前状态" prop="status">
<el-select
v-model="queryParams.status"
placeholder="请选择状态"
clearable
size="small"
>
<el-option
v-for="dict in statusOptions"
:key="dict.dictValue"
:label="dict.dictLabel"
:value="dict.dictValue"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :xs="24" :ms="12" :md="4">
<el-form-item class="no-margin">
<el-button
type="primary"
icon="el-icon-search"
size="mini"
@click="handleQuery"
>搜索</el-button
>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
>重置</el-button
>
</el-form-item>
</el-col>
</el-row>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
icon="el-icon-plus"
size="mini"
@click="handleAdd"
v-hasPermi="['benyi:thememonthplan:add']"
>新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="success"
icon="el-icon-edit"
size="mini"
:disabled="single"
@click="handleUpdate"
v-hasPermi="['benyi:thememonthplan:edit']"
>修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="danger"
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['benyi:thememonthplan:remove']"
>删除</el-button>
</el-col>
</el-row>
<div class="mb8 btn-list">
<el-button
type="primary"
icon="el-icon-plus"
size="mini"
@click="handleAdd"
v-hasPermi="['benyi:thememonthplan:add']"
>新增</el-button
>
<el-button
type="success"
icon="el-icon-edit"
size="mini"
:disabled="single"
@click="handleUpdate"
v-hasPermi="['benyi:thememonthplan:edit']"
>修改</el-button
>
<el-button
type="danger"
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['benyi:thememonthplan:remove']"
>删除</el-button
>
</div>
<el-table v-loading="loading" :data="monthplanList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" :selectable="isShow" />
<el-table-column label="计划名称" align="center" prop="name" :show-overflow-tooltip="true">
<el-table
border
v-loading="loading"
:data="monthplanList"
@selection-change="handleSelectionChange"
>
<el-table-column
type="selection"
width="55"
align="center"
:selectable="isShow"
/>
<el-table-column
fixed
label="计划名称"
align="center"
prop="name"
:show-overflow-tooltip="true"
>
<template slot-scope="scope">
<router-link :to="'/benyi_course/thememonthplan/data/' + scope.row.id" class="link-type">
<router-link
:to="'/benyi_course/thememonthplan/data/' + scope.row.id"
class="link-type"
>
<span>{{ scope.row.name }}</span>
</router-link>
</template>
</el-table-column>
<el-table-column label="班级名称" align="center" prop="classid" :formatter="classFormat" />
<el-table-column label="学年学期" align="center" prop="xnxq" :formatter="xnxqFormat" />
<el-table-column label="计划月份" align="center" prop="month" width="180">
<el-table-column
label="班级名称"
align="center"
prop="classid"
:formatter="classFormat"
/>
<el-table-column
label="学年学期"
align="center"
prop="xnxq"
:formatter="xnxqFormat"
/>
<el-table-column label="计划月份" align="center" prop="month">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.month, '{y}-{m}') }}</span>
<span>{{ parseTime(scope.row.month, "{y}-{m}") }}</span>
</template>
</el-table-column>
<el-table-column label="本月主题" align="center" prop="themes" :formatter="themeFormat" />
<el-table-column
label="本月主题"
align="center"
prop="themes"
:formatter="themeFormat"
/>
<el-table-column prop="wxkc" label="微型课程">
<template slot-scope="scope">
<div v-html="scope.row.wxkc"></div>
@ -113,8 +176,19 @@
</el-table-column>
<!-- <el-table-column label="家长支持" align="center" prop="support" />
<el-table-column label="备注" align="center" prop="remarks" />-->
<el-table-column label="状态" align="center" prop="status" :formatter="statusFormat" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="300">
<el-table-column
label="状态"
align="center"
prop="status"
:formatter="statusFormat"
/>
<el-table-column
fixed="right"
label="操作"
align="center"
class-name="small-padding fixed-width edit-btns"
width="60"
>
<template slot-scope="scope">
<el-button
size="mini"
@ -123,7 +197,8 @@
@click="handleUpdate(scope.row)"
v-hasPermi="['benyi:thememonthplan:edit']"
v-show="isShow(scope.row)"
>修改</el-button>
>修改</el-button
>
<el-button
size="mini"
type="text"
@ -131,7 +206,8 @@
@click="handleDelete(scope.row)"
v-hasPermi="['benyi:thememonthplan:remove']"
v-show="isShow(scope.row)"
>删除</el-button>
>删除</el-button
>
<el-button
size="mini"
type="text"
@ -139,20 +215,22 @@
@click="handleCheck(scope.row)"
v-hasPermi="['benyi:themetermplan:edit']"
v-show="isShow(scope.row)"
>提交</el-button>
<el-button
>提交</el-button
>
<el-button
size="mini"
type="text"
icon="el-icon-view"
@click="handleView(scope.row)"
v-hasPermi="['benyi:themetermplan:query']"
>预览</el-button>
>预览</el-button
>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
v-show="total > 0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@ -160,13 +238,13 @@
/>
<!-- 添加或修改主题整合月计划对话框 -->
<el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
<el-dialog :title="title" :visible.sync="open" class="v-dialog" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="计划月份" prop="month">
<el-date-picker
clearable
size="small"
style="width: 200px"
class="my-date-picker"
v-model="form.month"
type="month"
value-format="yyyy-MM"
@ -175,7 +253,11 @@
></el-date-picker>
</el-form-item>
<el-form-item label="学年学期" prop="xnxq">
<el-select v-model="form.xnxq" placeholder="请选择学年学期" :disabled="disable">
<el-select
v-model="form.xnxq"
placeholder="请选择学年学期"
:disabled="disable"
>
<el-option
v-for="dict in xnxqOptions"
:key="dict.dictValue"
@ -188,7 +270,11 @@
<Editor v-model="form.wxkc" placeholder="请输入微型课程" />
</el-form-item>
<el-form-item label="备注" prop="remarks">
<el-input v-model="form.remarks" type="textarea" placeholder="请输入内容" />
<el-input
v-model="form.remarks"
type="textarea"
placeholder="请输入内容"
/>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
@ -478,13 +564,30 @@ export default {
})
.catch(function () {});
},
/** 预览按钮操作 */
/** 预览按钮操作 */
handleView(row) {
const id = row.id;
this.$router.push({
path: "/benyi_course/thememonthplanprint/table/"+id,
path: "/benyi_course/thememonthplanprint/table/" + id,
});
},
},
};
</script>
</script>
<style lang="scss" scoped>
.el-select {
width: 100%;
}
.my-date-picker {
width: 100%;
}
.edit-btns {
.el-button {
display: block;
margin: 0 auto;
}
}
.no-margin ::v-deep.el-form-item__content {
margin: 0 !important;
}
</style>