|
- <!--
- * @Date: 2021-07-08 11:02:40
- * @LastEditTime: 2022-07-27 10:48:43
- * @Description: 广告位
- -->
- <template>
- <div class="app-container">
- <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="130px" class="resetform">
- <el-form-item label="图片" prop="image">
- <uploadFile :url.sync="ruleForm.image" type="image" width="1200" height="120"/>
- <p style="color: #909399;">*请上传1200*120的图片</p>
- </el-form-item>
- <el-form-item label="链接" prop="link">
- <el-input v-model="ruleForm.link"></el-input>
- </el-form-item>
- <el-form-item label="是否新开页面打开">
- <el-radio-group v-model="ruleForm.newOpen">
- <el-radio :label="1">是</el-radio>
- <el-radio :label="0">否</el-radio>
- </el-radio-group>
- </el-form-item>
- <el-form-item>
- <el-button type="primary" @click="submitForm('ruleForm')">保存</el-button>
- </el-form-item>
- </el-form>
- </div>
- </template>
- <script>
- import { guanggao2 } from '@/api/yyzrb'
- import { saveGuangGao } from '@/api/homePage'
- import uploadFile from '@/components/uploadFile'
-
- export default {
- components: {
- uploadFile
- },
- data() {
- return {
- ruleForm: {
- id: '',
- image: '',
- link: '',
- newOpen: '1'
- },
- rules: {
- image: [
- { required: true, message: '请上传图片', trigger: 'blur' }
- ],
- link: [
- { required: true, message: '请输入链接', trigger: 'blur' }
- ]
- }
- }
- },
- created() {
- this.getData()
- },
- methods: {
- getData() {
- guanggao2().then(res => {
- this.ruleForm.id = res.id
- this.ruleForm.image = res.image
- this.ruleForm.link = res.link
- this.ruleForm.newOpen = res.newOpen
- })
- },
- submitForm(formName) {
- this.$refs[formName].validate((valid) => {
- if (valid) {
- saveGuangGao(this.ruleForm).then(res => {
- this.$message({
- message: '操作成功!',
- type: 'success'
- })
- })
- } else {
- console.log('error submit!!')
- return false
- }
- })
- }
- }
- }
- </script>
|