yrxzy/src/views/journalQun/Journal.vue

<style lang="scss">
    .preview{
        .el-form-item{
            margin-bottom:15px;
        }
        label,p{
            line-height: 25px !important;
        }
    }
</style>
<template>
    <section>
        <p>中科院全刊</p>
        <div class="content">
            <div class="filter">
                <el-form size="small" label-width="70px" :inline="true"  label-position="left">
                    <el-form-item label="">
                            <el-input clearable placeholder="请输入信息标题" v-model="form.name"></el-input>
                    </el-form-item>
                    <el-form-item>
                        <el-button  type="primary">搜索</el-button>
                    </el-form-item>
                    <el-form-item style="float:right" >
                        <el-button @click="add" type="primary">添加期刊</el-button>
                    </el-form-item>
                </el-form>
            </div>
            <el-table
                    class="table"
                    :data="list" height="50vh"
                    border  v-loading="loading"
                    default-expand-all row-key="id"
                    style="width: 100%">
                    <el-table-column
                    prop="img"
                    label="期刊封面">
                        <template slot-scope="scope">
                            <img :src="scope.row.img" alt="" height="80" width="60">
                        </template>
                    </el-table-column>
                    <el-table-column
                    prop="name"
                    width="180"  
                    label="期刊名称">
                    </el-table-column>
                    <el-table-column
                    prop="wxcode" 
                    label="微信号">
                    </el-table-column>
                    <el-table-column
                    prop="subject_name" 
                    label="主办单位">
                    </el-table-column>
                    <el-table-column
                    prop="desc"
                    width="300" 
                    label="简介">
                    </el-table-column>
                    <el-table-column
                    prop="name" 
                    label="中文名称">
                    </el-table-column>
                    <el-table-column
                    prop="ename" 
                    label="外文名称">
                    </el-table-column>
                    <el-table-column
                    prop="languages" 
                    label="语种">
                    </el-table-column>
                    <el-table-column
                    prop="editor" 
                    label="主编">
                    </el-table-column>
                    <el-table-column
                    prop="corganizers" 
                    label="主管单位">
                    </el-table-column>
                    <el-table-column
                    prop="publishingUnit" 
                    label="办刊单位">
                    </el-table-column>
                    <el-table-column
                    prop="publishingTime" 
                    label="创刊时间">
                    </el-table-column>
                    <el-table-column
                    prop="domestic" 
                    label="国内刊号">
                    </el-table-column>
                    <el-table-column
                    prop="issn" 
                    label="国际刊号">
                    </el-table-column>
                    <el-table-column
                    prop="website" 
                    label="期刊官网">
                    </el-table-column>
                    <el-table-column
                    prop="editorialAddress" 
                    label="编辑部地址">
                    </el-table-column>
                    <el-table-column  
                    prop="zip"  width="150"
                    label="操作">
                    <template slot-scope="">
                        <el-button type="text" @click="dialogVisible=true,edit=1">查看</el-button>
                        <el-button class="edit" type="text" @click="dialogVisible=true,edit=0">编辑</el-button>
                        <el-button class="del" @click="del" type="text">删除</el-button>
                    </template>
                    </el-table-column>
            </el-table>
            <Page  ref="pageButton" :current='form.page' :page_size='form.page_size' :total='total' @pageChange='gopage'/>
        </div>

        <el-dialog
        title="发送通知消息" :close-on-click-modal='false'
        :visible.sync="dialogVisible">
        <el-form size="small" class="preview" :inline='false' label-width="80px">
                <el-form-item label="标题">
                    <p v-if='edit'>关于集中使用期刊公众号的通知</p>
                    <el-input v-else v-model="form.name"></el-input>
                </el-form-item>
                <el-form-item label="消息内容">
                    <p v-if='edit'>
                        关于集中使用期刊公众号的通知关于集中使用期刊公众号的通知
                        关于集中使用期刊公众号的通知关于集中使用期刊公众号的通知
                        关于集中使用期刊公众号的通知关于集中使用期刊公众号的通知
                    </p>
                    <el-input v-else v-model="form.name" type="textarea"></el-input>
                </el-form-item>
                <el-form-item label="文件">
                    <p v-if='edit'>
                        <el-link type="primary">关于集中使用期刊公众号的通知.docx</el-link><br>
                        <el-link type="primary">关于集中使用期刊公众号的通知.docx</el-link>
                    </p>
                    <el-button v-else class="upload_btn" plain type="primary">选择文件 <input type="file"></el-button>
                </el-form-item>
                <el-form-item label="接收人">
                    <el-input placeholder="请输入内容" v-model="input" class="input-with-select">
                        <el-button slot="append" icon="el-icon-search"></el-button>
                    </el-input>
                    <el-tree
                    :data="data"
                    show-checkbox
                    node-key="id" default-expand-all
                    :props="defaultProps">
                    </el-tree>
                </el-form-item>
        </el-form>
        <span slot="footer" class="dialog-footer">
            <el-button size="small" type="primary" @click="dialogVisible = false">确 定</el-button>
        </span>
        </el-dialog>
    </section>
</template>
<script>
import Page from '../../components/Page';
export default {
  components:{
        Page
  },
  data(){
    return{
      edit:0,
      form:{name:'',page:1,page_size:20},
      total:1,
      list:[{name:'2333'}],
      loading:false,
      input:''
    }
  },
  methods:{
        gopage(size){
            if(size){
                this.form.page_size=size
            }
            this.form.page=this.$refs.pageButton.page
            this.getData()
        },
        add(){
            this.$router.push({path:'/journal/journal/add'})
        },
        detail(id){
            this.$router.push({ path: '/company/detail', query: {  id: id,page:this.form.page,page_size:this.form.page_size  } });
        },
        getData(){
            var parm=this.form;        
            this.loading=true
            this.$api.getJournalList(parm).then(res=>{
                this.list=res.data.data.list;
                this.total=res.data.data.total
                this.loading=false
            })
        },
        del(id){
                this.$confirm('确定删除吗', '提示', {
                        type: 'warning'
                    }).then(() => {
                    this.$api.deleteEnterprise({id:id}).then((res)=>{
                            this.$message({
                                message: '删除成功',
                                type: 'success'
                            })
                            this.getData()
                    })
                })
        },
  },
  created(){
      this.getData()
  }
}
</script>