网页设计实验报告实验方法_电商分销系统开发_微博推广方法有哪些_哪里可以代写软文

<template><div class="app-container user-manage"><el-form:model="queryParams"ref="queryForm"><el-row><el-form-item prop="name"><el-col :span="24"><el-input v-model="queryParams.name" placeholder="请输入搜索内容" @keyup.enter.native="getTree"><i slot="suffix" class="el-icon-search" @click="getTree" style="width:30px;color: #1c84c6"></i></el-input></el-col></el-form-item></el-row><el-row style="height: 100%"><el-tree:data="tzLyLabelTree"node-key="id"ref="treeRef"highlight-current:props="defaultProps"@node-click="treeNodeClick":expand-on-click-node="false"default-expand-all><span slot-scope="{ node, data }"><span style="display: flex; justify-content: space-between;"><span style="width: 200px">{{ node.label }}</span><el-dropdown @command="(command) => handleCommand(command, node)"><span style="display: inline-block; color: #1c84c6"><i class="el-icon-more" style="transform: rotate(90deg);"></i></span><el-dropdown-menu slot="dropdown"><el-dropdown-item command="add">新增</el-dropdown-item><el-dropdown-item command="edit">修改</el-dropdown-item><el-dropdown-item command="remove">删除</el-dropdown-item></el-dropdown-menu></el-dropdown></span></span></el-tree></el-row></el-form><div class="user-panel"><el-row :gutter="10" class="mb8"><el-col :span="1.5"><el-buttontype="primary"plainicon="el-icon-plus"size="mini"@click="handleAdd"v-hasPermi="['tzly:tzLyLabel:add']">新增</el-button></el-col><el-col :span="1.5"><el-buttontype="success"plainicon="el-icon-edit"size="mini":disabled="single"@click="handleUpdate"v-hasPermi="['tzly:tzLyLabel:edit']">修改</el-button></el-col><el-col :span="1.5"><el-buttontype="danger"plainicon="el-icon-delete"size="mini":disabled="multiple"@click="handleDelete"v-hasPermi="['tzly:tzLyLabel:remove']">删除</el-button></el-col><el-col :span="1.5"><el-buttontype="warning"plainicon="el-icon-refresh"size="mini"@click="handleRefresh('manual')"v-hasPermi="['tzly:tzLyLabel:list']">刷新</el-button></el-col><!--        <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>--></el-row><el-table v-loading="loading" :data="tzLyLabelList" @selection-change="handleSelectionChange"><el-table-column type="selection" width="55" align="center"/><el-table-column label="标签名称" align="center" prop="name"/><el-table-column label="共享设置" align="center" prop="isShare"><template slot-scope="scope"><dict-tag :options="dict.type.train_questionnaire_template_share" :value="scope.row.isShare"/></template></el-table-column><el-table-column label="操作" align="center" class-name="small-padding fixed-width"><template slot-scope="scope"><el-buttonsize="mini"type="text"icon="el-icon-edit"@click="handleUpdate(scope.row)"v-hasPermi="['tzly:tzLyLabel:edit']">修改</el-button><el-buttonsize="mini"type="text"icon="el-icon-delete"@click="handleDelete(scope.row)"v-hasPermi="['tzly:tzLyLabel:remove']">删除</el-button></template></el-table-column></el-table><paginationv-show="total>0":total="total":page.sync="queryParams.pageNum":limit.sync="queryParams.pageSize"@pagination="getList"/></div><!-- 添加或修改标签库对话框 --><el-dialog :title="title" :visible.sync="open" width="500px" append-to-body><el-form ref="form" :model="form" :rules="rules" label-width="80px"><el-form-item label="标签名称" prop="name"><el-input v-model="form.name" placeholder="请输入标签名称"/></el-form-item><el-form-item label="共享设置" prop="isShare"><el-radio v-model="form.isShare" label="0">私有</el-radio><el-radio v-if="$auth.hasPermi('tzly:tzLyLabel:share')" v-model="form.isShare" label="1">共享</el-radio></el-form-item></el-form><div slot="footer" class="dialog-footer"><el-button type="primary" @click="submitForm">确 定</el-button><el-button @click="cancel">取 消</el-button></div></el-dialog></div>
</template><script>
import {listTzLyLabel,treeTzLyLabel,getTzLyLabel,delTzLyLabel,addTzLyLabel,updateTzLyLabel
} from '@/api/tzly/tzLyLabel'export default {name: 'TzLyLabel',dicts: ['train_questionnaire_template_share'],data() {return {// 遮罩层loading: true,// 选中数组ids: [],// 非单个禁用single: true,// 非多个禁用multiple: true,// 显示搜索条件showSearch: true,// 总条数total: 0,// 标签库表格数据tzLyLabelList: [],// 弹出层标题title: '',// 是否显示弹出层open: false,// 查询参数queryParams: {pageNum: 1,pageSize: 10,parentId: '0',name: null,isShare: null,createOrgId: null,createOrgName: null,createUser: null,modifyUser: null,modifyTime: null},// 表单参数form: {},// 表单校验rules: {name: [{ required: true, message: '标签名称不能为空', trigger: 'blur' }],isShare: [{ required: true, message: '共享设置不能为空', trigger: 'blur' }]},tzLyLabelTree: [],defaultProps: {children: 'children',label: 'name'},action: ''}},created() {this.getTree()},methods: {// 更多操作触发handleCommand(command, node) {let row = node.datathis.action = 'left'switch (command) {case 'add':this.treeNodeClick(row)this.handleAdd()breakcase 'edit':this.queryParams.parentId = '0'this.handleUpdate(row)breakcase 'remove':this.handleDelete(row)breakdefault:break}},handleRefresh(action) {//用户强制刷新if (action === 'manual') {this.$refs.treeRef.setCurrentKey(undefined)this.queryParams.parentId = '0'this.tzLyLabelList = []}else {//自动刷新//左侧添加树if (this.action === 'left') {this.getTree()this.$refs.treeRef.setCurrentKey(undefined)this.queryParams.parentId = '0'} else {if (this.queryParams.parentId === '0') {//右侧添加树this.getTree()this.$refs.treeRef.setCurrentKey(undefined)this.queryParams.parentId = '0'} else {//右侧添加子节点this.getList()}}}},treeNodeClick(obj) {this.queryParams.parentId = obj.idthis.$refs.treeRef.setCurrentKey(obj.id)this.getList()},getTree() {let that = thisthis.loading = truetreeTzLyLabel(this.queryParams).then(response => {that.tzLyLabelTree = []this.$nextTick(() => {that.tzLyLabelTree = response.data})this.loading = false})},/** 查询标签库列表 */getList() {this.loading = truelistTzLyLabel(this.queryParams).then(response => {this.tzLyLabelList = response.rowsthis.total = response.totalthis.loading = false})},// 取消按钮cancel() {this.open = falsethis.reset()},// 表单重置reset() {this.form = {id: null,parentId: null,name: null,isShare: null,createOrgId: null,createOrgName: null,createUser: null,createTime: null,modifyUser: null,modifyTime: null}this.resetForm('form')},/** 搜索按钮操作 */handleQuery() {this.queryParams.pageNum = 1this.getList()},/** 重置按钮操作 */resetQuery() {this.resetForm('queryForm')this.handleQuery()},// 多选框选中数据handleSelectionChange(selection) {this.ids = selection.map(item => item.id)this.single = selection.length !== 1this.multiple = !selection.length},/** 新增按钮操作 */handleAdd() {this.reset()this.action = 'right'this.open = truethis.title = '添加标签'},/** 修改按钮操作 */handleUpdate(row) {this.reset()this.action = 'right'const id = row.id || this.idsgetTzLyLabel(id).then(response => {this.form = response.datathis.open = truethis.title = '修改标签'})},/** 提交按钮 */submitForm() {this.$refs['form'].validate(valid => {if (valid) {this.form.parentId = this.queryParams.parentIdif (this.form.id != null) {updateTzLyLabel(this.form).then(response => {this.$modal.msgSuccess('修改成功')this.handleRefresh('auto')this.open = false})} else {addTzLyLabel(this.form).then(response => {this.$modal.msgSuccess('新增成功')this.handleRefresh('auto')this.open = false})}}})},/** 删除按钮操作 */handleDelete(row) {const ids = row.id || this.idsthis.$modal.confirm('是否确认删除数据项？').then(function() {return delTzLyLabel(ids)}).then(() => {this.getList()this.$modal.msgSuccess('删除成功')this.handleRefresh('auto')}).catch(() => {})},}
}
</script>
<style lang="scss">
.user-manage {padding: 0 10px;display: flex;.el-tree {width: 250px;overflow: auto;height: calc(100% - 70px);border-right: 1px solid #dfdfdf;::v-deep .el-tree-node {width: 100%;display: table;& > .el-tree-node__children {overflow: unset;}}}.user-panel {width: calc(100% - 201px);padding: 10px 0 10px 10px;}.yearnumremark {text-align: center;font-size: 18px;margin: 10px;color: red;}::v-deep .el-input__inner {font-size: 16px !important;}}::v-deep .el-textarea.is-disabled .el-textarea__inner {color: black;
}.topic span {font-size: 16px;font-weight: 700;}::v-deep .el-textarea.is-disabled .el-textarea__inner {font-size: 16px;font-weight: 700;
}::v-deep .el-form-item__content {font-size: 16px;font-weight: 700;
}.list-img {float: left;
}</style>